Make website scroll down only on homepage

Store Design
,

Topic summary

A user implemented code to automatically scroll their website down on page load to immediately display their homepage image. However, the code affected all pages site-wide instead of just the homepage.

Solution provided:

  • Wrap the existing scroll code in a Liquid conditional statement
  • Use {% if template == 'index' %} before the code and {% endif %} after
  • This restricts the scroll behavior to only the homepage (index template)

Outcome:

  • The user confirmed the solution worked successfully
  • The scroll functionality now applies exclusively to the homepage as intended
Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
1

I recently put in some code for my website to load further down the page so my homepage image could be instantly shown. I soon realized that it also did it for every single page on my website. I only want it to start further down on the homepage, and not any other page.

Viibed_0-1722198202843.png
Viibed_0-1722198202843.png1845×908 485 KB

Here’s where the other pages start.

I can paste the code I am using now, (this code is located in theme.liquid above the tag)

I only want this code to work ONLY on my homepage, and not any other page. Here is my website: Viibed

Please help, and thank you!

2

Hi @Viibed

{% if template == 'index' %}

{% endif %}
1 Like
3

Do I replace the original code with this?

4

Yes, exactly.

1 Like
5

Worked, thank you!