Answers.Body: <p>Depends on your URL structure ultimately and whether you have sub pages, but I think the easiest way to do it would be something like:</p>
  
  <pre><code>{% if mainNav.navitems|length %}
   {% for row in mainNav.navitems %}
    &lt;li&gt;
      &lt;a href="{{ url(row.url) }}"
       {%- if craft.request.segment(1) == row.url %}class="active"{%- endif %}&gt;
       {{ row.name }}
      &lt;/a&gt;
    &lt;/li&gt;
   {% endfor %}
  {% endif %}
  </code></pre>
  
  <p>You don't have to use the <code>segment(1)</code> method if it doesn't suit, take a look at <a href="https://craftcms.com/docs/templating/craft.request" rel="nofollow noreferrer">the request docs</a> to find something that suits your URLs</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-06-08T09:47:45.507Z
Answers.Text: Thanks alec, I managed to solve it just before you answered. But in your one the active class would be added to the <a> tag, so wouldn't work as needs to go on the <li>
Answers.UserDisplayName: mention79
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-06-08T09:43:48.230Z
Answers.LastActivityDate: 2017-06-08T09:43:48.230Z
Answers.UserDisplayName: Alec Ritson
Answers.Body: <p>I have solved it <code>{% if row.url == craft.request.firstSegment %}class="active" {% endif %}</code></p>
  
  <p>Here's the full code.</p>
  
  <pre><code>{% if mainNav.navitems|length %}
  {% for row in mainNav.navitems %}
    &lt;li {% if row.url == craft.request.firstSegment %}class="active" {% endif %}&gt;&lt;a href="{{ row.url }}"&gt;{{ row.name }}&lt;/a&gt;&lt;/li&gt;
  {% endfor %}
  {% endif %}
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-06-08T09:42:39.680Z
Answers.LastActivityDate: 2017-06-08T09:42:39.680Z
Answers.UserDisplayName: mention79
Body: <p>I have a simple nav set up using Globals in a table, but I'm struggling to get it to add an active class to only the active page.</p>
  
  <p>The below code adds the nav links, but I need to know what to add to it to get the active class on only the current page.</p>
  
  <p>Need a little help please?</p>
  
  <pre><code>{% if mainNav.navitems|length %}
      {% for row in mainNav.navitems %}
          &lt;li&gt;&lt;a href="{{ row.url }}"&gt;{{ row.name }}&lt;/a&gt;&lt;/li&gt;
      {% endfor %}
  {% endif %}
  </code></pre>
  
  <p><a href="https://i.sstatic.net/N46Pm.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/N46Pm.png" alt="Main Nav"></a></p>
  
Tags: <navigation>
Title: Add active class to nav created from globals
ThreadText: # Add active class to nav created from globals
  
  (Asked by: username_0 on 2017-06-08)
  
  I have a simple nav set up using Globals in a table, but I'm struggling to get it to add an active class to only the active page.
  
  The below code adds the nav links, but I need to know what to add to it to get the active class on only the current page.
  
  Need a little help please?
  
  ```
  {% if mainNav.navitems|length %}
      {% for row in mainNav.navitems %}
          <li><a href="{{ row.url }}">{{ row.name }}</a></li>
      {% endfor %}
  {% endif %}
  
  ```
  
  [![Main Nav](https://i.sstatic.net/N46Pm.png)](https://i.sstatic.net/N46Pm.png)
  
  **Tags:** navigation
  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_1 on 2017-06-08. Score: 2
  
  Depends on your URL structure ultimately and whether you have sub pages, but I think the easiest way to do it would be something like:
  
  ```
  {% if mainNav.navitems|length %}
   {% for row in mainNav.navitems %}
    <li>
      <a href="{{ url(row.url) }}"
       {%- if craft.request.segment(1) == row.url %}class="active"{%- endif %}>
       {{ row.name }}
      </a>
    </li>
   {% endfor %}
  {% endif %}
  
  ```
  
  You don't have to use the `segment(1)` method if it doesn't suit, take a look at [the request docs](https://craftcms.com/docs/templating/craft.request) to find something that suits your URLs
  
  > **Comments:**
  > **username_0**: Thanks username_1, I managed to solve it just before you answered. But in your one the active class would be added to the <a> tag, so wouldn't work as needs to go on the <li>  
  
  ---
  
  ### Answer by username_0 on 2017-06-08. Score: 1
  
  I have solved it `{% if row.url == craft.request.firstSegment %}class="active" {% endif %}`
  
  Here's the full code.
  
  ```
  {% if mainNav.navitems|length %}
  {% for row in mainNav.navitems %}
    <li {% if row.url == craft.request.firstSegment %}class="active" {% endif %}><a href="{{ row.url }}">{{ row.name }}</a></li>
  {% endfor %}
  {% endif %}
  
  ```
  
  
  ---
  
  