Please note, this is a STATIC archive of website www.themepunch.com from 28 Sep 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Navigation Editor

The Navigation Editor can be used to edit existing Navigation templates or to create your own.

1. Find a Navigation Style you'd like to edit.

select-navigation

2. From the Navigation Editor, click the "Duplicate" icon for the navigation style.

navigation_editor

3. The duplicated template will now be listed in the "Custom Navigations" section, where it can be renamed and edited.

custom-nav

4. Click the "Edit" button for the navigation type you wish to edit. In this example, we'll edit the "Arrows".

edit-nav-arrows

5. Scroll to the editing section (2), and click the purple CSS bar to open the CSS editor.

edit-nav-css

6. Select the "Dynamic Values" option, and click the "Add" button.

add-dynamic-value

7. Choose "Text/Custom" for the "Type", and then give the new option a Title, Handle and a Default Value.

Limit the characters to letters, dashes and underscores when creating the “Handle”.

nav-dynamic-value

8. Edit the CSS with your new dynamic value.

In the following example, the navigation template’s “border-radius” property was previously hard-coded at “50%”.  But in the screenshot below, we’ve now replaced this with our newly created dynamic value.

nav-css-edit

9. Scroll back to the top of the page, and click the save button for the new custom Navigation template.

save-custom-style

10. The dynamic value can now be edited Globally and also per-slide.

Adjusted globally for the entire slider
new-arrow-style
Adjusted for a single slide
per-slide-nav-edit