I am using category-archive plugin for my Jekyll project. I want to have a category list menu for each category archive page so the user can navigate between different category archives. I would like to add class="active" to the category list link for the category archive page currently viewed. I have something similar going for the site navigation by comparing the page.url to navitem.url the difference is that for the site nav i specify the list of navitem.urls in config.yml and for the category archive the list of category names is generated based on the categories specified in the post itself, and i am having trouble using the {{ category | first }} variable within the {% if %} operator so i could either check for "==" or "contains"
This is what i have at the moment but it doesn't seem to work
<ul class="product-categories">
{% for category in site.categories %}
{% if page.url == {{ category | first }} %}
{% assign class = "active" %}
{% else %}
{% assign class = "" %}
{% endif %}
<li>
<a href="/{{ category | first }}/" class="{{ class }}">{{ category | first }}</a>
</li>
{% endfor %}
Please help =)
The class liquid variable is inside the for loop so when you use it outside the scope is empty, also it should be "contains" instead of == because the path contains more characters that won't be present in the category of.
<ul class="product-categories">
{% assign class = "" %}
{% for category in site.categories %}
{% assign cat=category|first %}
{% if page.url contains cat %}
{% assign class = "active" %}
{% endif %}
<li>
<a href="/{{ category | first }}/" class="{{ class }}">{{ category | first }}</a>
</li>
{% endfor %}