Shopify themes, liquid, logos, and UX
Hi!
This has been asked before, but the solutions are outdated and do not work.
I need my collection page to become my homepage. So when a client enters my website address in a browser, they would land on this collection page. Will appreciate if someone would help with this. Thanks in advance!
Hey Oscar,
It well depends on your theme, but I think you can just reuse collection.liquid file making sure to fetch the collection you want your product to be fetched from and provided it as the context so the code in the collection.liquid has it available.
Hope that helps!
make sure you back up the site first.
But you could probably just copy the template used for catalog, probably something like catalog.liquid, and paste it into index.liquid
Dear Sergiu and Ryan, thank you for your replies.
I use Supply theme.
Not sure if I understood you fully Sergiu, but I think you and Ryan mean the same thing?
I have tried this before. After I copy the contents of my collection-template.liquid into index.liquid, I receive an error "Line 215 — Liquid syntax error: Unknown tag 'schema'". So I cannot even save it.
Will appreciate further help with this 🙂
Hey Oscar,
I didn't know what theme you are using, hence a more general suggestion. I now know you are running on Supply theme, so here is a more detailed one.
Replace the content of your index.liquid with:
{% section 'collection-template' %}
Open sections/collection-template.liquid for editing and the following snippet to the top:
{% if section.settings.homepage_collection %}
{% assign collection = collections[section.settings.homepage_collection] %}
{% endif %}
At the bottom of the page, you should see the schema used to define the collection-template section settings which are editable through Theme Customization tool. Add a new field to it:
...
,
{
"type": "text",
"id": "homepage_collection",
"label": "Homepage collection"
}
...
Go to Theme Customization, on the left handside bar you should see the new Collection setting, click on it, in the section settings you should now see the newly created field "Homepage collection". You can type the collection handle you want the products to originate from, hit save and you should be good to go.
You can work it further to your liking. Hope that helps!
Hey Sergiu, your solution works fine to show the products on the main page, but the filter and sort buttons get broken. did you ever manage to fix this?
it would be nice if someone would answer this and keep the content up to date. Has anyone seen how to successfully make the Collections page become the Homepage for the Debut theme?
This information is out of date.
Dear Sergiu,
Thank you so much, it worked.
However, I have some issues, for ex. no pruduct filter on the sidebar, and I have two Sort By dropdowns. Screenshot attached.
So how can I:
Add the below code and insert theme.liquid before the head tag
{%- if template contains 'index' -%}
<script>
window.location.href = '/collections/all';
</script>
{%- endif -%}
bingo, this worked instantly and saved me $600.
@BeamJokerFavor That's Awsome 😀
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