Shopify themes, liquid, logos, and UX
Hi guys,
My site always forgot previous scroll position and auto scroll to top when press back from product page in IOS. I had tested in Window and Android still good. 😞
My site use Debut theme: http://1975nails.com/.
Please help me check it. Thank you!
help me please 😞
Hi there,
hope that will help:
the problem is, that the main content of your side is not really preloaded. So the browser can not remember the Y-Scroll position.
E.G: If you press on a link in your footer, scroll down and then click page back it should work also in mobile.That's while the footer is completey loaded.
You're not writing what is your theme, so i give you a short instruction on the new DAWN theme:
1. Go to Online-Store --> themes
2. Click on --> Actions --> Duplicate (just for a backup
3. If done click --> Actions --> EDIT CODE
4. Open your theme.liquid in LAYOUT
5. Find the section where youre header is loaded. Something like:
{% section 'header' %}
Directly after the section has been loaded, the main-content will be loaded e.g.:
<main id="MainContent" class="content-for-layout focus-none" role="main" tabindex="-1">
{{ content_for_layout }}
Remove this line:
<main id="MainContent" class="content-for-layout focus-none" role="main" tabindex="-1">
After that your code should be shown e.g. like this:
{% section 'announcement-bar' %}
{% section 'header' %}
{% comment %} DISABLED:
<main id="MainContent" class="content-for-layout focus-none" role="main" tabindex="-1">
{% endcomment %}
{{ content_for_layout }}
{% section 'footer' %}
Click SAVE, Reload your page, try it.
Hope that works for you.
Have a great day,
Stefan
help :((
Hello @username102
I'm not a professional but I've checked your website on my iPhone and it seems OK.
Actually you only need to remove the tabindex="-1" in theme.liquid's <main> tag.
This line should be changed
<main id="MainContent" class="content-for-layout focus-none" role="main" tabindex="-1">
to:
<main id="MainContent" class="content-for-layout focus-none" role="main">
my code is like this, but still happening in some device
Hi PeanutButter,
Fantastic tip! It worked for me.
Thank you very much man!
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024