Slider Revolution WP
09.27.2016
Creating Numbered Bullets with the Navigation Editor
Create a new Custom Navigation Style for Numbered Bullets.A general example for creating any type of custom navigation for your sliders.
1. Create a new Custom Navigation Style.
1.1 From the plugin's Navigation Editor, scroll to the "Custom" style, and click the "Duplicate" button:
1.2 Scroll to the top, and click "Bullets -> Edit" for the new "Custom-2" Navigation style.
1.3 Next, from the "Editing" section, from "Actions -> Parameters", select "Parameter 1".
1.4 Next, paste the following CSS into the very bottom of the CSS editor.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
.custom-2 .tp-bullet { /* bg colors */ background-color: #000; /* text styles */ font-family: Trebuchet MS; font-size: 12px; font-weight: bold; text-align: center; color: white; /* bullet size */ width: 32px; height: 26px; padding-top: 5px; } /* hover and active bullet styles */ .custom-2 .tp-bullet:hover, .custom-2 .tp-bullet.selected { background-color: #444; border-bottom: 2px solid #FFF; } |
1.5 Then click the save button.
2. Assign the new Navigation Style to your Slider.
2.1 Enable "Bullets" in your slider's navigation, and choose "Custom-2" for the style
3. Add the numbers to each individual slide.
3.1 From "Slide Info", enter the slide's number into the "Parameter 1" section:
