<p>Perhaps not the most elegant solution, but this works:</p>

<pre><code>{% set queryTags = craft.request.getQuery('tags') %}

{% for tag in craft.tags.relatedTo(resourceTags) %}
   &lt;a
     href="{% if tags == "" %}/learning/resources?tags={{ tag.title|kebab }}{% else %}/learning/resources?tags={{ tags|replace(' ', '+') }}+{{ tag.title|kebab }}{% endif %}"
     class="btn btn-default{% if tag.title|kebab in queryTags %} disabled{% endif %}"
   &gt;{{ tag.title }}&lt;/a&gt;
{% endfor %}
</code></pre>

<p>Adding <code>disabled</code> rather than <code>active</code>.</p>

CC BY-SA 4.0
2016-05-13T15:01:14.540Z
2018-05-16T17:53:20.190Z
2018-05-16T17:53:20.190Z
Matt Ellis
<p>The easiest way to do this is to create an array of tag ids for tags that should be active.</p>

<p>I would use a comma to separate multiple tags in your query string since the browser interprets a plus sign as a space. For example, if your tags were "New Videos" and "Maths" the url would look like this:</p>

<p><code>domain.com/learning/resources?tags=New+Videos,Maths</code></p>

<p>First, get the "tags" query parameter and make an array splitting each tag at a comma:</p>

<pre><code>{% set tagsQuery = craft.app.request.getParam('tags')|split(',') %}

{# tagsQuery = ["New Videos","Maths"] #}
</code></pre>

<p>Search your tag group for matching titles and return an array of ids. This assumes you have a tag group with the handle "tags":</p>

<pre><code>{% set activeTags = tagsQuery ? craft.tags.group('tags').title(tagsQuery).ids() : null %}
</code></pre>

<p>Then it's a simple matter of testing if the tag.id is in the activeTags array.</p>

<pre><code>{% for tag in craft.tags.relatedTo(resourceTags) %}
  {{ tag.title }}

  {# Use a conditional #}
  {% if item.id in activeTags %}active{% endif %}

  {# or an output tag with a conditional #}
  {{ item.id in activeTags ? 'active' }}
{% endfor %}
</code></pre>

CC BY-SA 4.0
2018-05-13T08:53:00.527Z
2018-05-13T08:53:00.527Z
Alex Roper
<p>I'm outputting all tags that are in use and then allowing the user to click these build up a query string to filter and display the results. It's all working fine.</p>

<p>Except, I'm having difficulty understanding what can I use to set an 'active' class on all the selected tags that are being added to the query string.</p>

<p>Setting 1 tag as active is simple enough, but when multiple are selected, I'm not so sure.</p>

<p>The URL looks like this: <code>domain.com/learning/resources?tags=Video+Maths</code></p>

<p>Setting tags via getParam:</p>

<pre><code>{% set tags = craft.request.getParam('tags') %}
</code></pre>

<p>Listing all tags in use like this:</p>

<pre><code>{% set resourceTags = craft.entries.section('resources').limit(null) %}
{% for tag in craft.tags.relatedTo(resourceTags) %}
</code></pre>

<p>Outputting results like this:</p>

<pre><code>{% craft.entries.section('resources').limit(craft.config.paginateLimit).search(tags) as entries %}`
</code></pre>

CC BY-SA 3.0
2016-03-10T14:13:53.933Z
I'm still having trouble with this. Is tags and search the wrong way to go about this?
Matt Ellis
<search><tags><css><querystring>
How to set multiple 'active' classes from query string
# How to set multiple 'active' classes from query string

(Asked by: username_0 on 2016-03-01)

I'm outputting all tags that are in use and then allowing the user to click these build up a query string to filter and display the results. It's all working fine.
Except, I'm having difficulty understanding what can I use to set an 'active' class on all the selected tags that are being added to the query string.
Setting 1 tag as active is simple enough, but when multiple are selected, I'm not so sure.
The URL looks like this: domain.com/learning/resources?tags=Video+Maths
Setting tags via getParam:
{% set tags = craft.request.getParam('tags') %}

Listing all tags in use like this:
{% set resourceTags = craft.entries.section('resources').limit(null) %}
{% for tag in craft.tags.relatedTo(resourceTags) %}

Outputting results like this:
{% craft.entries.section('resources').limit(craft.config.paginateLimit).search(tags) as entries %}`

**Tags:** search, tags, css, querystring
> **Comments:**
> **username_0**: I'm still having trouble with this. Is tags and search the wrong way to go about this?  

---

## 2 answers

### Answer by username_0 on 2016-05-13. Score: 1 | Accepted answer

Perhaps not the most elegant solution, but this works:
{% set queryTags = craft.request.getQuery('tags') %}

{% for tag in craft.tags.relatedTo(resourceTags) %}
   {{ tag.title }}
{% endfor %}

Adding disabled rather than active.


---

### Answer by username_1 on 2018-05-13. Score: 1

The easiest way to do this is to create an array of tag ids for tags that should be active.
I would use a comma to separate multiple tags in your query string since the browser interprets a plus sign as a space. For example, if your tags were "New Videos" and "Maths" the url would look like this:
domain.com/learning/resources?tags=New+Videos,Maths
First, get the "tags" query parameter and make an array splitting each tag at a comma:
{% set tagsQuery = craft.app.request.getParam('tags')|split(',') %}

{# tagsQuery = ["New Videos","Maths"] #}

Search your tag group for matching titles and return an array of ids. This assumes you have a tag group with the handle "tags":
{% set activeTags = tagsQuery ? craft.tags.group('tags').title(tagsQuery).ids() : null %}

Then it's a simple matter of testing if the tag.id is in the activeTags array.
{% for tag in craft.tags.relatedTo(resourceTags) %}
  {{ tag.title }}

  {# Use a conditional #}
  {% if item.id in activeTags %}active{% endif %}

  {# or an output tag with a conditional #}
  {{ item.id in activeTags ? 'active' }}
{% endfor %}


---

