_includes/header.html

<nav class="navbar navbar-expand-md navbar-light bg-light">
  <a class="navbar-brand" href="{{ "/" | prepend: site.baseurl }}">
		<img src="{{ "/assets/img/gem5ColorLong.gif" | prepend: site.baseurl }}" alt="gem5" height=55px>
	</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNavDropdown">
    <!-- LIST FOR NAVBAR -->
    <ul class="navbar-nav ml-auto">
      <!-- HOME -->
      <li class="nav-item {% if page.title == "Home" %}active{% endif %}">
        <a class="nav-link" href="{{ "/" | prepend: site.baseurl }}">Home</a>
      </li>

      <!-- ABOUT -->
			<li class="nav-item dropdown {% if page.parent == "about" %}active{% endif %}">
				<a class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
					About
				</a>
				<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
          <a class="dropdown-item" href="{{ "/about" | prepend: site.baseurl }}">About gem5</a>
          <a class="dropdown-item" href="{{ "/publications" | prepend: site.baseurl }}">Publications</a>
          <a class="dropdown-item" href="{{ "/governance" | prepend: site.baseurl }}">Governance</a>
				</div>
			</li>

      <!-- DOCUMENTATION -->
			<li class="nav-item dropdown {% if page.layout == "documentation" %}active{% endif %}">
				<a class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
					Documentation
				</a>
				<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
					<!-- Pull navigation from _data/documentation.yml -->
					{% for item in site.data.documentation.docs %}
            <a class="dropdown-item" href="{{ item.items[0].url | prepend: site.baseurl }}">{{ item.title }}</a>
					{% endfor %}
				</div>
			</li>

      <!-- EVENTS -->
			<li class="nav-item dropdown {% if page.url == "/events/" %}active{% endif %}">
        <a class="nav-link" href="{{ "/events/" | prepend: site.baseurl }}">Events</a>
			</li>

      <!-- CONTRIBUTING -->
      <li class="nav-item {% if page.title == "Contributing" %}active{% endif %}">
        <a class="nav-link" href="{{ "/contributing" | prepend: site.baseurl }}">Contributing</a>
      </li>

      <!-- BLOG -->
      <li class="nav-item {% if page.url == "/blog/" %}active{% endif %}">
        <a class="nav-link" href="{{ "/blog" | prepend: site.baseurl }}">Blog</a>
      </li>

      <!-- SEARCH -->
			<li class="nav-item {% if page.title == "Search" %}active{% endif %}">
        <a class="nav-link" href="{{ "/search" | prepend: site.baseurl }}">Search</a>
      </li>
    </ul>
  </div>
</nav>