my store does not work on a cell phone but does on a computer

Shopify Discussion
1

my store does not work on a cell phone but does on a computer

2

Hello @RyanEastwood !

Could you tell me a little bit more about what happens when you try to access your store on a mobile device?

Do you get some kind of error message? If possible, a screenshot would be very helpful.

If you’re comfortable with that, could you also share your store link with me here so that I can try and have a look at it on my end?

It would also help if you could provide me the name of your theme and let me know if this is a new issue and it used to work before, or if it never worked for you.

Are you currently in the building stages of your online store? Aside from the mobile access issue, how is everything else going?

I would be happy to see what else I can help you out with.

3

Hi thank you for responding so the home page opens when on a cell phone but the drop down menu does not work, herewith the link to my website

https://pcptact.co.za/

4

Hi Ryan, Looks like when your menu was converted to 2 lines on desktop some JS code necessary for mobile navigation was removed.

I’d try the following changes in your theme.js (theme.js.liquid?) asset:

  1. find the following code
timber.responsiveNav = function () {
//  $(window).resize(function () {
//    afterResize(function () {
//      // Replace original nav items and remove more link
//      timber.cache.$navigation.append($('#moreMenu--list').html());
//      $('#moreMenu').remove();
//      timber.alignMenu();
//      timber.accessibleNav();
//    }, 200, 'uniqueID');
//  });
  timber.alignMenu();
  timber.accessibleNav();
  timber.mobileNav();
};

and comment alignMenu line out:

timber.responsiveNav = function () {
//  $(window).resize(function () {
//    afterResize(function () {
//      // Replace original nav items and remove more link
//      timber.cache.$navigation.append($('#moreMenu--list').html());
//      $('#moreMenu').remove();
//      timber.alignMenu();
//      timber.accessibleNav();
//    }, 200, 'uniqueID');
//  });
//  timber.alignMenu();
  timber.accessibleNav();
  timber.mobileNav();
};

this will prevent collapsing your menu to single line on desktop later.

  1. at the very bottom of the file find the following line
sections.register('slideshow-section', theme.SlideshowSection);

and add another line so it looks like this:

sections.register('slideshow-section', theme.SlideshowSection);
  sections.register('header-section', theme.HeaderSection);

I expect it to fix your problem, but can’t be 100% sure from ‘outside’.

5

Thanks for sharing this.

I tested this out on my end, and I can see what you’re saying.

What is the name of your theme?

If you’re using one of our free Shopify themes, our own themes team could look into this for you, and if it’s a third party theme, I could direct you to the support of the theme developers so that they can have a look at it instead.

I see you have a few code editing suggestions on this thread, but I wanted to recommend that before you implement any of those suggestions, duplicate the theme by following these steps here.

This will allow you to go back to an untouched copy of your theme in case something goes wrong.