title: How to add "active" class to wp_nav_menu() current menu item (simple way)
body: <p>I am creating custom Wordpress theme using a starter theme _Underscores and Bootstrap.</p>
  <p>I would like to modify <code>wp_nav_menu</code> so that it assigns the current menu item <code>.active</code> class instead of the default <code>.current-menu-item</code>. I need this in order to use <code>.active</code> class from Bootstrap.</p>
  <p>Here is what I have (extra stuff comes from WP so please scroll to the right):</p>
  <pre><code>&lt;ul id=&quot;menu-main-menu&quot; class=&quot;nav navbar-nav&quot;&gt;
     &lt;li id=&quot;menu-item-14&quot; class=&quot;menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-13 current_page_item menu-item-14&quot;&gt;&lt;a href=&quot;&quot;&gt;item1&lt;/a&gt;&lt;/li&gt;
     &lt;li id=&quot;menu-item-12&quot; class=&quot;menu-item menu-item-type-post_type menu-item-object-page menu-item-12&quot;&gt;&lt;a href=&quot;&quot;&gt;item2&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  <p>And here is what I need:</p>
  <pre><code>&lt;ul id=&quot;menu-main-menu&quot; class=&quot;nav navbar-nav&quot;&gt;
     &lt;li id=&quot;menu-item-14&quot; class=&quot;active menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-13 current_page_item menu-item-14&quot;&gt;&lt;a href=&quot;&quot;&gt;item1&lt;/a&gt;&lt;/li&gt;
     &lt;li id=&quot;menu-item-12&quot; class=&quot;menu-item menu-item-type-post_type menu-item-object-page menu-item-12&quot;&gt;&lt;a href=&quot;&quot;&gt;item2&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  <p>I would prefer to achieve this without modifying <code>../wp-includes/nav-menu-template.php</code> and without using JS.</p>
  <hr />
  <p>UPDATE: I found the answer just before posting this question, but since I had a rather hard time finding it, posting this as a QA to hopefully save someone some time.</p>