<nav class=“navbar navbar-expand-lg navbar-dark bg-primary”>

<div class="container">
  <a class="navbar-brand" rel="author" href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>

  {%- assign page_paths = site.header_pages -%}
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
    aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav ml-auto">
      {%- for path in page_paths -%}
        {%- assign my_page = site.pages | where: "path", path | first -%}
        {%- if my_page.title -%}
        <li class="nav-item">
          <a class="nav-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
        </li>
        {%- endif -%}
      {% endfor -%}
      {% if site.homepage %}
      <li class="nav-item">
        <a class="nav-link" href="{{ site.homepage }}" aria-label="Go to homepage"><i class="fas fa-home fa-2x" title="Go to homepage."></i></a>
      </li>
      {% endif %}
      {% if site.github_username %}
      <li class="nav-item">
        <a class="nav-link" href="https://github.com/{{ site.github_username }}" aria-label="Follow @{{ site.github_username }} on Github"><i class="fab fa-github fa-2x" title="Follow @{{ site.github_username }} on Github"></i></a>
      </li>
      {% endif %}
      {% if site.twitter_username %}
      <li class="nav-item">
        <a class="nav-link" href="https://twitter.com/{{ site.twitter_username }}" aria-label="Follow @{{ site.twitter_username }} on Twitter"><i class="fab fa-twitter fa-2x" title="Follow @{{ site.twitter_username }} on Twitter"></i></a>
      </li>
      {% endif %}
      {% if site.linkedin_username %}
      <li class="nav-item">
        <a class="nav-link" href="https://www.linkedin.com/in/{{ site.linkedin_username }}/" aria-label="Follow @{{ site.linkedin_username }} on LinkedIn"><i class="fab fa-linkedin fa-2x" title="Follow @{{ site.linkedin_username }} on LinkedIn"></i></a>
      </li>
      {% endif %}
    </ul>
  </div>
</div>

</nav>