Прості хлібні крихти для сторінки товару в Shopify

У цьому короткому повідомленні ми додамо декілька простих хлібних крихт для сторінки товару в Shopify.

Спочатку перейдіть до редагування коду теми (наприклад, візьміть базову тему Dawn) і знайдіть файл main-product.liquid у папці Sections та додайте його на правильне місце.

<section id="breadcrumb">
	<ul itemscope itemtype="https://schema.org/BreadcrumbList">
  		<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
          <a itemprop="item" href="/"><span itemprop="name">Home</span></a>
          <meta itemprop="position" content="1" />
      	</li>
  		<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
          <a itemprop="item" href="/collections/all"><span itemprop="name">Catalog</span></a>
          <meta itemprop="position" content="2" />
      	</li>
		{% for collection in product.collections %}
      		{% if forloop.last == true %}
              <li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
                <a itemprop="item" href="{{ collection.url }}"><span itemprop="name">{{ collection.title }}</span></a>
                <meta itemprop="position" content="3" />
              </li>
      		{% endif %}
        {% endfor %}	
      <li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"><span itemprop="name">{{ product.title }}</span><meta itemprop="position" content="4" /></li>
	</ul>
</section>

У цьому прикладі ми додаємо хлібні крихти з міткою schema.org одразу. Перше посилання буде шляхом до головної сторінки, друга позиція буде посиланням на загальний каталог, третя позиція буде посиланням на колекцію товарів (якщо у нас є більше однієї пов'язаної колекції, буде відображена остання). І на останньому місці буде відображено назву нашого товару у вигляді тексту.