Search code examples
jekyllliquidjekyll-theme

Counting loop value in jekyll schema breadcrumb list


This question is related to What are some good ways to implement breadcrumbs on a Jekyll site? and I need to get the position from the loop. <meta itemprop="position" content="">

<nav class="breadcrumbs bootstrap hidden-sm-down">
<ol class="breadcrumb list-unstyled" itemscope itemtype="https://schema.org/BreadcrumbList">
 <li class="breadcrumb-item" itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem"><a itemprop="item" href="/"><span itemprop="name">Home</span></a><meta itemprop="position" content="1"></li>
 {% assign crumbs = page.url | split: '/' %}
 {% assign crumbs_total = crumbs | size | minus: 1 %}
   {% for crumb in crumbs offset: 1 %}
    {% if forloop.index == crumbs_total %}
        <li class="breadcrumb-item active"itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem"><meta itemprop="item" content="{{ site.url }}{{ page.url | relative_url }}"><span itemprop="name">{{ page.crumbtitle }}</span><meta itemprop="position" content=""></li>
    {% else %}
        <li class="breadcrumb-item" itemprop="itemListElement" itemscope
      itemtype="http://schema.org/ListItem"><a itemprop="item" href="{% assign crumb_limit = forloop.index | plus: 1 %}{% for crumb in crumbs limit: crumb_limit %}{{ crumb | append: '/' }}{% endfor %}"><span itemprop="name">{{ crumb | replace:'-',' ' | upcase }}</span></a><meta itemprop="position" content=""></li>
    {% endif %}
  {% endfor %}
</ol>
</nav>


Solution

  • On line #12 Just add one. <meta itemprop="position" content="{{ crumbs_total | plus:1 }}"> Line # 16 already has the var, {% assign crumb_limit = forloop.index | plus: 1 %} So, on line # 18 you only need <meta itemprop="position" content="{{ crumb_limit }}">

    {% if page.layout != 'home' %}
    <nav class="breadcrumbs bootstrap hidden-sm-down">
    <ol class="breadcrumb list-unstyled" itemscope itemtype="https://schema.org/BreadcrumbList">
     <li class="breadcrumb-item" itemprop="itemListElement" itemscope
          itemtype="http://schema.org/ListItem"><a itemprop="item" href="/"><span itemprop="name">Home</span></a><meta itemprop="position" content="1"></li>
     {% assign crumbs = page.url | split: '/' %}
     {% assign crumbs_total = crumbs | size | minus: 1 %}
        {% for crumb in crumbs offset: 1 %}
        {% if forloop.index == crumbs_total %}
            <li class="breadcrumb-item active"itemprop="itemListElement" itemscope
          itemtype="http://schema.org/ListItem"><meta itemprop="item" content="{{ site.url }}{{ page.url | relative_url }}"><span itemprop="name">{{ page.crumbtitle }}</span><meta itemprop="position" content="{{ crumbs_total | plus:1 }}"></li>
        {% else %}
    {% assign crumbs_position = 1 %}
            <li class="breadcrumb-item" itemprop="itemListElement" itemscope
          itemtype="http://schema.org/ListItem"><a itemprop="item" href="{% assign crumb_limit = forloop.index | plus: 1 %}{% for crumb in crumbs limit: crumb_limit %}{{ crumb | append: '/' }}{% endfor %}"><span itemprop="name">{{ crumb | replace:'-',' ' | upcase }}</span></a>{% assign crumbs_postion = crumbs_position | plus:1 %}<meta itemprop="position" content="{{ crumb_limit }}"></li>
        {% endif %}
      {% endfor %}
    </ol>
    </nav>
    {% endif %}