Search Help:  
 
Enter keywords to search help.

Changing Navigation Button Order

The Store Editor allows you to customize the order of navigation buttons on all pages using a variable (Nav-buttons) with the exception of the Home page. You can edit the order of navigation buttons directly on the Home page in Edit mode, or you can override the Nav-buttons variable on any page to customize the order of buttons on a specific page. Since navigation buttons should be consistent between pages to make it easy for visitors to navigate your site, you will edit the Nav-buttons variable on the "Variables" page to make the order consistent across all pages.

To change the order of standard buttons using a variable:

  1. From the Store Editor, click "Variables" in the Editor toolbar on any page.
  2. Scroll to the "Button Properties" section of the Variables page (see figure 1).
  3. Click the "Change" button for the "Nav-buttons" field.
    The Edit List Position page loads where you can edit the button order (see figure 2).
  4. Enter a new value for the button(s) you wish to move.
  5. Click "Update" when finished.
  6. Click "Update" to return to the "Edit" view of the page. Your changes should appear.
  7. When ready, click "Publish" in the Editor toolbar to push your changes to your live site.
Figure 1: Button Properties section of the Variables page.


Figure 2: Edit List Position—edit the position of buttons by changing the number or delete the number to remove the button from the navigation bar.

These changes are made to all navigation bars throughout your store with the exception of the Home page and any pages with variable overrides.

To change the order of standard buttons on the Home page:

  1. From the Store Editor, navigate to the Home page.
  2. Click the "Edit" button in the Editor toolbar.
  3. Click the "Change" button for the "Buttons" field. (see A figure 3)
    The Edit List Position page loads where you can edit the button order.
  4. Enter a new value for the button(s) you wish to move.
  5. Click "Update" when finished.
  6. Click "Update" to return to the "Edit" view of the page.
    Your changes should appear.
  7. When ready, click "Publish" in the Editor toolbar to push your changes to your live site.

These changes only affect navigation buttons on the Home page.

Figure 3:Store Editor Home page Edit view with "Change" button called out.


Figure 4: Edit List Position—edit the position of buttons by changing the number or delete the number to remove the button from the navigation bar.

You can also change the button order on a specific page by overriding the Nav-buttons variable.

To change the button order on a specific page:

  1. From the Store Editor, navigate to the page on which you wish to change the button order.
  2. Click "Edit" in the Editor toolbar.
  3. Click the "Override Variable" button at the top of the page (see A figure 5). The Override Variable page loads.
Figure 5: Store Editor Section page edit view with "Override Variable" button called out.
4. Select "Nav-buttons" from the drop-down menu and click "Update".
Figure 6: Override Variables page which allows you to select a variable to override. The selected variable override will be added to the page under Custom Properties in the Edit view.

The "Edit" view of the page loads again and the "Nav-buttons" variable override appears in the "Custom Properties" section.

Figure 7: Store Editor Section page Edit view showing "Nav-buttons" variable override in "Custom Properties" section.
5. Follow steps 3-6 above to order buttons in the navigation bar for the page. Note: You will need to enter numbers for the button order rather than reorder buttons.
6. When ready, click "Publish" in the Editor toolbar to push your changes to your live site.

This change affects only the navigation buttons on the page you edited. Repeat these steps to make changes to additional pages.

When you edit the order of buttons you assign the "Contents" button a position relative to other buttons (such as Home=1 Contents=2 which places all contents below the Home button). However, a button will appear for each section. The Order is determined by the order in which the sections were created. You can reorder Sections by moving them in the Store Editor.

To change button order for Contents (Section buttons):

  1. From the Store Editor, navigate to the Home page.
  2. Click the "Move" button in the Editor toolbar.
  3. Click the Section link you wish to move on the Home page.
  4. Click the Section link to which you wish to move the section.
    For example, if your Home page contains three sections and you wish to move section one to section three's position, you select the link for section one after clicking "Move" and then click the link for section three. The result—section two is first, followed by section three, and then section one (see figures 8-9).
Figure 8: Home page of a sample store.


Figure 9: Home page of sample store after moving the "Wooden Widgets" section from the first position to the third position. Compare with figure 8 above. To move the "Wooden Widgets" section, you would click "Move" in the toolbar and then click "Wooden Widgets" link (the section to move) and then click "Metal Widgets" link (the position to which you wish to move the section).

5. When finished, click "Publish" in the Editor toolbar to push the changes to your store.

See Also


Was this article helpful?

Yes   No
Click to contact Customer Care for further assistance.