Referencing Pages With No Properties In Liquid Conditionals For Shopify Store
I successfully implemented a slider that shows different content on each page of a Shopify store. Out of the five pages where I would like to put unique content (an about page, a blog feed, another manually added static content page, the homepage, and the catalog page), I can't provide unique content for the homepage and the catalog page because I can't reference them in liquid.
I created a test snippet to show all potentially useful variables in order to discover a means of referencing my pages in a conditional:
<div class="grid__item__nm--wrap">
<span><h1>THIS IS WHAT THE PAGE HANDLE IS:</h1> {{ page.handle }}</span>
<span><h1>THIS IS WHAT THE PAGE TITLE IS:</h1> {{ page.title }}</span>
<span><h1>THIS IS WHAT THE PAGE TEMPLATE SUFFIX IS:</h1> {{ page.template_suffix }}</span>
<span><h1>THIS IS WHAT THE PAGE ID IS:</h1> {{ page.id }}</span>
</div>
(Note: The above snippet works fine and doesn't need troubleshooting. I post it as a succinct way to demonstrate what I'm doing.)
Including this snippet in theme.liquid works for all the pages I added to the navigation and for the "About Us" page, showing the different propertiers. However, nothing is output for any of the properties on the homepage or the catalog page.
The best I can do is to show the same content on the homepage and catalog page through the "else" case. This is not good enough. I want different content for the homepage and catalog page. In fact, ideally I would like to exclude the catalog page (but not the homepage) from the inclusion of the snippet that generates the slider. I don't know how to do either of those things without having any properties to use for referencing the catalog page.
Answer
According to Shopify schema, a page is something with the url as follow - //mystorelink.com/pages/page-handle
. So when you use {{ page.title }}
it will display the page title only when the url is in the above format.
Don't confuse between a "Shopify page" and a "webpage" for both are completely different.
A Shopify page is a template while a webpage is a normal html page. In order for your requirement refer to following link types and templates
/
or//myshoplink.com
-> index.liquid ->{{ page_title }}
&{{ page_description }}
/collections/xyz
-> collection.liquid ->{{ collection.title }}
&{{ collection.description }}
/products/xyz
or/collections/abc/products/xyz
-> product.liquid ->{{ product.title }}
&{{ product.description }}
/pages/xyz
-> page.liquid ->{{ page.title }}
&{{ page.description }}
etc similarly for other templates.
P.S. You can have multiple product/collection/pages etc. templates using suffix values, but {{ <template>.title }}
remains the same
P.P.S. If nothing is to be changed you can plainly use {{ page_title }}
and {{ page_description }}
everywhere. It defaults to the template currently in use.
Related Questions
- → Does anyone know how to solve IP canonicalization with shopify platform?
- → How can I add a featured image from a blog post to my homepage on shopify
- → Shopify - Get list of product from a specific collection
- → Shopify webhooks not wanted
- → Comparing two large files are taking over four hours
- → Need "add to cart" button price to update with correct amount depending on what checkbox is checked
- → How to append a variable inside another vaiable name in liquid html
- → GET /admin/webhooks.json returns an empty array
- → Javascript function not getting executed properly
- → How to give border to to current displaying border
- → Shopify background image
- → Dynamic Attribute Names in Shopify Cart
- → What after added shopify store into shipstation