I'm trying to display all my product titles and URLs using.
<ul>
<h3>Products</h3>
{% for product in collections.all.products %}
<li>
{{ product.title }}
</li>
{% endfor %}
</ul>
But it is only displaying the first 50 pages. How can I make it to show all my products
Related
I want to show collection related products best selling on shopify cart page. I tried some product loop but doesn't work.
This is my code which i added:
<div class="row products">
{% if collection.best-selling.products.size > 0 %}
{% for product in collection.best-selling.products %}
<li>
<img src="{{ product.featured_image | product_img_url: 'medium' }}" alt="{{ product.title | escape }}" />
<a class="shop-now" href="{{ product.url }}">{{ product.title | escape }}</a>
</li>
{% endfor %}
{% endif %}
</div>
Anybody got any idea how to fix this
There are a few mistakes in yout code.
Liquid error
When targeting a specific collection you must use the collections keyword, not collection ( collection is available only on the collection page and returns that collection). So you should use here collections.best-selling.
This is deprecated product_img_url: 'medium' don't used named size such as small/medium/large etc..., use numbered sizes like 600x600 (where this is WIDTHxHEIGHT without cropping or changing the aspect ratio of the image).
HTML validation error
Outputting a li without it being in ul or ol is invalid HTML code and this will make your HTML code validation fail.
Your code should look like this
This assumes that you have a collection with a handle best-selling.
<div class="row products">
{% if collections.best-selling.products.size > 0 %}
<ul>
{% for product in collections.best-selling.products %}
<li>
<img src="{{ product.featured_image | product_img_url: '600x' }}" alt="{{ product.title | escape }}" />
<a class="shop-now" href="{{ product.url }}">{{ product.title | escape }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</div>
I'm using Shopify's Debut theme and would like to add the footer navigation to the bottom. In the backend, I have two navigations, "Main menu" and "Footer menu" set up.
This works:
<ul>
{% for link in linklists.main-menu.links %}
<li>{{ link.title }}</li>
{% endfor %}
</ul>
but this doesn't when I put "footer-menu":
<ul>
{% for link in linklists.footer-menu.links %}
<li>{{ link.title }}</li>
{% endfor %}
</ul>
The default footer menu is just footer not footer-menu.
So you should call linklists.footer.links instead.
Can you please guide me, How to create third level menu in shopify.
Sub Dropdown Menu for (Almost) Any Shopify theme.
Thanks in advance.
In navigation:
If your Shopify backend updated then simple drag and drag upto three level
see: screenshot http://prntscr.com/hzu8n3
Or use as create new menu with same handle of sub menu.
And use below code
<div class="menuItems">
<ul class="mebItemParent">
{% for link in linklists.mobile-menu.links %}
{% if linklists[link.handle] == empty %}
<li class="">{{ link.title }}</li>
{% else %}
<li class="hasSubItem">
<div class="withtiggle">
{{ link.title }} <span class="toggleItem">+</span>
</div>
<ul>
{% for l in linklists[link.handle].links %}
{% if linklists[l.handle] == empty %}
<li class="">{{ l.title }}</li>
{% else %}
<li class="hasSubItem">
<div class="withtiggle">
{{ l.title }} <span class="toggleItem">+</span>
</div>
<ul>
{% for l2 in linklists[link.handle].links %}
<li class="">{{ l2.title }}</li>
{% endfor %}
</ul>
</li>
{% endif %}
{% endfor %}
</ul>
</li>
{% endif %}
{% endfor %}
</ul>
</div>
I'm trying to make a clickable list of all collections on my collection page, but for some reason the following isn't working?
{% for collection in collections %}
{% collection.title %}
{% endfor %}
You can output a variable with double curly braces, like this: {{ collection.title }}
This snippet would give you a list of collections with links:
<ul>
{% for collection in collections %}
<li>{{ collection.title | link_to: collection.url }}</li>
{% endfor %}
</ul>
You can learn more about Liquid syntax here: https://shopify.github.io/liquid/basics/introduction/
I placed this code into my collection.liquid template so that customers can choose by product types. It's working great!
<ul class="types">
{% for product_type in collection.all_types %}
<li class="{{ product_type | handleize }}">{{ product_type | link_to_type }}</li>
{% endfor %}
</ul>
However, I want to be able to "hide" this list after something has been selected. This is because after the customer chooses T-Shirts, it takes them to the T-Shirts page, which has a huge title of "T-Shirts" at the top, and, because of the code above, a smaller "T-Shirts" below it. Having a duplicate of the page title is annoying and I've been having trouble trying to figure out how to remove the list after a product type has been chosen. I've tried this:
ul.nothing { display:none; }
<ul class="types" {% if page_title contains product_type %}class="nothing"{% endif %}>
{% for product_type in collection.all_types %}
<li class="{{ product_type | handleize }}">{{ product_type | link_to_type }}</li>
{% endfor %}
</ul>
It's not working and I want to avoid having to do this manually
body#t-shirts ul.types { display:none; }
etc...for all of my different product types.
Help!
Thank you in advance!
It should work if you change
{% if page_title contains product_type %}
to
{% if page_title == collection.current_type %}
<li> {% for collection in collections %}
{% if collection.products_count != 0 %}
<br> {{ collection.title }} <span class="count">({{collection.products_count}})</span>
{% endif%} {% endfor %} </li>