Answers.Body: <p>You don't need the quotes or braces in twig tags to reference variables.</p>
  
  <pre><code>{% for category in categories %}
      &lt;li {% if craft.request.segment(2) == category.slug %}class="active"{% endif %}&gt;&lt;a href="{{ category.url }}"&gt;{{ category.title }}&lt;/a&gt;&lt;/li&gt;
  {% endfor %}﻿
  </code></pre>
  
  <p>You could also use ternary operators:</p>
  
  <pre><code>{% for category in categories %}
      &lt;li {{ craft.request.segment(2) == category.slug ? 'class="active"' : "" }}&gt;&lt;a href="{{ category.url }}"&gt;{{ category.title }}&lt;/a&gt;&lt;/li&gt;
  {% endfor %}﻿
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-07-22T16:00:34.913Z
Answers.Text: What if I wanted to set class based on the url having no segment 2?
Answers.UserDisplayName: jeff_nordstedt
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-07-22T16:09:34.093Z
Answers.Text: I haven't tried it, but you could try using twig's default filter: `craft.request.segment(2)|default("")`
Answers.UserDisplayName: Bryan Redeagle
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-07-22T16:10:18.170Z
Answers.Text: Actually, I guessed and answered my own follow up by replacing "category.slug" with "null" to set class when no category is selected.
Answers.UserDisplayName: jeff_nordstedt
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2014-07-22T15:31:20.250Z
Answers.LastActivityDate: 2014-07-22T15:31:20.250Z
Answers.UserDisplayName: Bryan Redeagle
Answers.Body: <p>Small update for Craft3 in the syntax :</p>
  
  <pre><code>{% set categories = craft.categories().all() %}
  {% nav category in categories %}
      &lt;li class="nav-menu-item {{ craft.app.request.getSegment(2) == category.slug ? 'nav-menu-item-current' : '' }}{% endif %}"&gt;
          &lt;a href="{{ category.url }}"&gt;{{ category.title }}&lt;/a&gt;
      &lt;/li&gt;
  {% endnav %}
  </code></pre>
  
  <p>PS. Is there any other way to achieve this ? Going through craft.app is apparently frowned upon : <a href="https://docs.craftcms.com/v3/templating/global-variables.html#craft-app" rel="nofollow noreferrer">https://docs.craftcms.com/v3/templating/global-variables.html#craft-app</a></p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2018-05-30T21:32:24.047Z
Answers.LastActivityDate: 2018-05-30T21:32:24.047Z
Answers.UserDisplayName: fdelaneau
Answers.Body: <p>I use the current <code>entry</code> as something to compare against, instead of the <code>craft.app.request….</code> Also one can also use the id instead of the slug. So here, based on the previous examples a little variation:</p>
  
  <pre><code>{% set categories = craft.categories().all() %}
  {% nav category in categories %}
      &lt;li class="nav-menu-item {{ entry.id == category.id ? 'nav-menu-item-current' : '' }}{% endif %}"&gt;
          &lt;a href="{{ category.url }}"&gt;{{ category.title }}&lt;/a&gt;
      &lt;/li&gt;
  {% endnav %}
  </code></pre>
  
  <p>Example untested. Please correct me, if wrong.</p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-02-20T15:34:18.850Z
Answers.LastActivityDate: 2020-02-20T15:34:18.850Z
Answers.UserDisplayName: Frank Lämmer
Body: <p>Here is the code I am trying to use to set an active state for category navigation:</p>
  
  <pre><code>    {% for category in categories %}
          &lt;li {% if craft.request.segment(2) == "{{ category.slug }}" %}class="active"{% endif %}&gt;&lt;a href="{{ category.url }}"&gt;{{ category.title }}&lt;/a&gt;&lt;/li&gt;
      {% endfor %}﻿
  </code></pre>
  
  <p>It seems that the conditional can't check against the category.slug output. Is this the case? What would be a better approach?</p>
  
  <p>Any help is appreciated.</p>
  
Tags: <templating><categories><conditional>
Title: How do I conditionally set active state in category navigation?
ThreadText: # How do I conditionally set active state in category navigation?
  
  (Asked by: username_0 on 2014-07-22)
  
  Here is the code I am trying to use to set an active state for category navigation:
  
  ```
      {% for category in categories %}
          <li {% if craft.request.segment(2) == "{{ category.slug }}" %}class="active"{% endif %}><a href="{{ category.url }}">{{ category.title }}</a></li>
      {% endfor %}﻿
  
  ```
  
  It seems that the conditional can't check against the category.slug output. Is this the case? What would be a better approach?
  
  Any help is appreciated.
  
  **Tags:** templating, categories, conditional
  
  
  ---
  
  ## 3 answers
  
  ### Answer by username_1 on 2014-07-22. Score: 2 | Accepted answer
  
  You don't need the quotes or braces in twig tags to reference variables.
  
  ```
  {% for category in categories %}
      <li {% if craft.request.segment(2) == category.slug %}class="active"{% endif %}><a href="{{ category.url }}">{{ category.title }}</a></li>
  {% endfor %}﻿
  
  ```
  
  You could also use ternary operators:
  
  ```
  {% for category in categories %}
      <li {{ craft.request.segment(2) == category.slug ? 'class="active"' : "" }}><a href="{{ category.url }}">{{ category.title }}</a></li>
  {% endfor %}﻿
  
  ```
  
  > **Comments:**
  > **username_0**: What if I wanted to set class based on the url having no segment 2?  
  > **username_1**: I haven't tried it, but you could try using twig's default filter: `craft.request.segment(2)|default("")`  
  > **username_0**: Actually, I guessed and answered my own follow up by replacing "category.slug" with "null" to set class when no category is selected.  
  
  ---
  
  ### Answer by username_2 on 2018-05-30. Score: 1
  
  Small update for Craft3 in the syntax :
  
  ```
  {% set categories = craft.categories().all() %}
  {% nav category in categories %}
      <li class="nav-menu-item {{ craft.app.request.getSegment(2) == category.slug ? 'nav-menu-item-current' : '' }}{% endif %}">
          <a href="{{ category.url }}">{{ category.title }}</a>
      </li>
  {% endnav %}
  
  ```
  
  PS. Is there any other way to achieve this ? Going through craft.app is apparently frowned upon : <https://docs.craftcms.com/v3/templating/global-variables.html#craft-app>
  
  
  ---
  
  ### Answer by username_3 on 2020-02-20. Score: 1
  
  I use the current `entry` as something to compare against, instead of the `craft.app.request….` Also one can also use the id instead of the slug. So here, based on the previous examples a little variation:
  
  ```
  {% set categories = craft.categories().all() %}
  {% nav category in categories %}
      <li class="nav-menu-item {{ entry.id == category.id ? 'nav-menu-item-current' : '' }}{% endif %}">
          <a href="{{ category.url }}">{{ category.title }}</a>
      </li>
  {% endnav %}
  
  ```
  
  Example untested. Please correct me, if wrong.
  
  
  ---
  
  