Adding an Alphabetical list of Products title in debut theme

[LucasAlbuq]

Hi everyone! I'm  trying to add an alphabetical list of the products in my page, trying to change the following code:

<ul>
  {% assign current = "" %}
  {% for product_vendor in shop.vendors %}
    {% assign first_letter = product_vendor | strip_html | upcase | truncate: 1, '' %}
    {% unless first_letter == current %}
      <li class="vendor-letter">{{ first_letter }}</li>
    {% endunless %}
    <li>{{ product_vendor | link_to_vendor }}</li>
    {% assign current = first_letter %}
  {% endfor %}
</ul>

The problem is that the code retry a list of the vendors in alphabetical order, but when i try to change it to get the products title i get an error. I guess that I ain't doing it correctly. Has anyone a solution for this?

My site is fotosprorio.com

Many Thanks!

[pvoulg]

Hi @LucasAlbuq,

You need to switch things up a bit, in order to accommodate products, instead of vendors. Mainly, you need to loop through all of your store's products, kind of like this:

<ul>
  {% assign current = "" %}
  {% for product in collections.all.products %}
    {% assign first_letter = product.title | strip_html | upcase | truncate: 1, '' %}
    {% unless first_letter == current %}
      <li class="vendor-letter">{{ first_letter }}</li>
    {% endunless %}
    <li><a href="{{ product.url }}" title="{{ product.title }}" aria-label="{{ product.title }}">{{ product.title }}</a></li>
    {% assign current = first_letter %}
  {% endfor %}
</ul>

Now, this will only work if the number of products on your store are less than the pagination limit. Otherwise you'd need to paginate the results, which would mean that you'd also need to alter your letter index snippet as well.

[violetas]

{% for tag in collection.all_tags %}
{% if tag contains '        ' %}

Could you provide a code like this for the product tags, not vendor tags under the alphabet letter with no bullet points listed in a paragraph format?  Thanks