============================================
Edit site navigation
============================================

.. raw:: html

  <div style="
    position: relative;
    width:100%;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    margin-bottom:20px;"
    >
    <iframe
    style="top:0;
    left:0;
    width:100% !important;
    height:100% !important;
    position: absolute;"
    width="560" height="315" src="https://www.youtube.com/embed/JfF7lT82gXA?rel=0" frameborder="0" allowfullscreen></iframe>
    </div>


New pages are not explicitly tied to the navigation. This allows for sites to have multiple navigation trees and lets you keep the main navigation as simple or as complicated as you want regardless of how many pages exist on your site.

**To add a page to the navigation**

* Copy the URL of the page you'd like to add *after* the **.com** (or .org, etc.) to your clipboard. For example, ``/about`` or ``/shop/school-supplies/pencils``.

* Hit the Gear button in the bottom right corner of the page.

.. image:: /_static/publish-row.png
   :alt: Publishing tools

* Select the "Site Admin" tab at the top right of the overlay. This will take you to the Glass Control Panel.

.. HINT::
   A shortcut to get to the Glass Control Panel is to type **/_glass** at the end of the domain of your site. For example, **http://site.com/_glass**

.. image:: /_static/new-page.png
   :alt: New page dialog

* Choose "Site Navigation" from the sidebar. Most sites only have one Navigation tree. If there are multiples, they'll be listed here. Click the blue "Navigation" link from the top of this area.

.. image:: /_static/nav-main.png
   :alt: Main Navigation Dialog

* You'll see a list of the navigation items on your site.
* Toggle the arrows next to the main navigation items to see the nested navigation items.

.. image:: /_static/nav-list.png
   :alt: Navigation List

* Click **edit** next to any of the items to change the text or URL.

 .. image:: /_static/nav-edit.png
    :alt: Edit Navigation

* To rearrange the navigation list, simply drag existing items around. Drag an element *between* items or *on* items to nest them within sections.

.. image:: /_static/nav-dragging.png
   :alt: Navigation dragging


* To add a new item, hit the "Add New Navigation Item" button at the top of the list.
* The "Name" field is how the item will display in the navigation.
* The "URL" field should start with a "/" if it's an internal page. For example, "/about". If the navigation item should direct to an external site, it should start with http or https. For example, "https://google.com".

.. HINT::
   When building a navigation initially, the "Save and add another" button speeds up the process a good bit, but it also has a keyboard shortcut. If you hit **Cmd+Enter** on a mac or **Ctrl+Enter** on Windows or Linux, You can create a large list all at once without leaving your keyboard. Make the whole list, and then drag-to-order when you're done.

.. image:: /_static/nav-new.png
   :alt: New page dialog