Moving Navbar Below the Slider

Occasionally, a branding design calls for moving the navbar to an area below the header.  

Go to the Edit HTML / CSS Page. Locate and open theme.liquid.

Locate and move the navbar line of code:

{% include 'navbar' with 'top' %}

      {% if settings.slider-width != "window-width" or settings.show-breadcrumbs %}
      <div class="container">
        {% if settings.slider-width == "site-width" and template == "index" %}{% include 'slider' %}{% elsif settings.slider-width == "site-width" %}{% include 'banner' %}{% endif %}
      </div>
      {% endif %}

Also locate and move the breadcrumbs below the navbar.

The final code will look like:

  <div id="wrap">
    
    <div id="content">
      {% if settings.logo-placement == "above-main-content" %}{% include 'brand' %}{% endif %}
    	{% if has_main_menu %}
    	<div class="container">
    		{% include 'navbar' with 'main' %}
    	</div>
    	{% endif %}
      {% if settings.slider-width == "window-width" and template == "index" %}{% include 'slider' %}{% elsif settings.slider-width == "window-width" %}{% include 'banner' %}{% endif %}
      
      {% if settings.slider-width != "window-width" or settings.show-breadcrumbs %}
      <div class="container">
        {% if settings.slider-width == "site-width" and template == "index" %}{% include 'slider' %}{% elsif settings.slider-width == "site-width" %}{% include 'banner' %}{% endif %}
      </div>
      {% endif %}
      
      {% include 'navbar' with 'top' %}
      <div class="container">
        {% if settings.show-breadcrumbs and template != 'index' %}{% include 'breadcrumbs' %}{% endif %}
      </div>