Skip to content

Highlight Active Tag

Wraps a given tag in an HTML <span> tag, with a class attribute of active, if the tag is currently active. This only applies to collection tags.

Example

Data
json
{
  "data": {
    "tags": [
      "fighter",
      "cleaning",
      "collect",
      "fishing"
    ]
  }
}
liquid
{% for tag in data.tags %}
  {{- tag | highlight_active_tag }}
{% endfor %}

Output

<span class="active">fighter</span>

cleaning

collect

fishing