<nav class=“navbar navbar-expand-md navbar-dark bg-dark sticky-top mb-3”>

<div class="container">
  <a class="navbar-brand" href="{{ '/' | relative_url }}">{{ site.title }}</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-controls="navbar-collapse"
    aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbar-collapse">
    {%- assign default_paths = site.pages | map: "path" -%}
    {%- assign page_paths = site.header_pages | default: default_paths -%}
    {%- if page_paths -%}
      <ul class="navbar-nav mr-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 }}</a>
            </li>
          {%- endif -%}
        {%- endfor -%}
      </ul>
    {%- endif -%}
    {%- if site.author -%}
      <ul class="navbar-nav">
        <li class="nav-item">
          {%- assign default_path = '/' | relative_url -%}
          <a href="{{ site.homepage | default: default_path }}" class="nav-link">{{ site.author }}</a>
        </li>
      </ul>
    {%- endif -%}
  </div>
</div>

</nav>