Difficulty

gold-star blank-star blank-star blank-star blank-star

How long will it take?

1397068449_clock 5 Minutes

Youtube Video

youtube-icon

Not yet available

Step 1

From the control panel dashboard, click on ‘Appearance’ located on the navigation bar down the left side of the screen.

01

Step 2

At the top of the page you will see two tabs: ‘Main Menu’ and ‘Responsive Menu’. Ensure that Main Menu is the selected tab.

The Main Menu is the navigation bar that will be displayed on PC and Tablet devices.

The Responsive Menu is the navigation bar that will appear on mobile devices if your website is responsive.

02

Step 3

On the left of the screen there is a box called ‘Pages’. Select the page (or pages) that you would like to add using the checkboxes by ticking them, then click on the ‘Add to Menu’ button located at the bottom right of the box.

By default only recently created pages are shown. If the page you want to add is not there, click on ‘View All’ and it will now be displayed in the box.

03

Step 4

The main segment of the screen represents the layout of the navigation bar. The newly added pages will appear as grey bars at the bottom of the list. Simply drag and drop this bar to place it where you would like it to appear in the navigation.

If the bars are slightly indented, it means that it will appear as a drop-down menu under the above page, instead of a main page. To reposition the bar click and drag it to the left or right.

04

Step 5 (Optional)

Click on the arrow at the end of the grey bar to access options for the page. The only thing of importance is the ‘Navigation Label’. You can edit this if you would like the text that appears in the navigation bar to be different from the page name.

This is very useful to truncate the text on the navigation as there is only limited space available. For example the page ‘Web Design Services in Wigan’ could be displayed as ‘Web Design’ on the navigation.

05

Step 6

Click on ‘Save Menu’ located on the right of the page.

Your navigation menu will now have been successfully updated! Be sure to check the menu to ensure that everything is displaying as intended

06

Additional Information – Updating the Responsive Menu

If you would like to add the page to the responsive menu, simply click on the ‘Responsive Menu’ tab at the top of the page and follow all of these steps again to add pages to the responsive menu.

Keep in mind that additional drop downs do not work well on mobile touch screen devices. It is recommended to ensure that there are no sub-pages under other pages. This can easily be seen as all of the bars representing pages will all be aligned together on the left with no indentations.

A1

Additional Notes – Deleting a Page from the Menu

To remove a page, click on the arrow on the right of the grey bar that represents the page, then click on ‘remove’. Remember to update the menu afterwards!

A2

Additional Notes – Adding Custom URLs

If you want to add a custom URL – for example linking to another website – this can be done through the box named ‘Custom Links’ located directly above the ‘Pages’ box. Copy and paste the desired URL into the URL box, and then type in the text that you want to appear for the link on the navigation menu.

You can then add the new link just as above by clicking ‘Add to Menu’ then dragging and dropping it where you want it to go.

Be sure to double check the menu that is selected – Main Menu or Responsive. You don’t want to edit the wrong one! And as always, click on ‘Save Menu’ when you are finished.

A3

Top