Nivo Slider : Customizing bullets, behaviour and corners

Do you want to share WYSIWYG Web Builder tips, tricks, tutorials or useful HTML code? You can post it here...
(no questions or problems please, this section is not monitored by support).
Forum rules
This section is to share tips, tricks and tutorials related to WYSIWYG Web Builder.
Please do not post questions or problems here. They will not be answered.

PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
Post Reply
User avatar
Pascal-Gilles
 
 
Posts: 83
Joined: Tue Apr 05, 2011 8:06 pm
Location: France
Contact:

Nivo Slider : Customizing bullets, behaviour and corners

Post by Pascal-Gilles »

Hello,

Nivo Slider is an astonishing addon for WB8 which can really give a plus to your site.
You can read the excellent post from protectourlands which provides many useful instructions and setting information.

Whereas it comes with very nice options, it is possible to go further and give a more personal look to this impressive slider.

* Make round corners (CSS3)

Not so easy with a CSS File change but check out this solution to overcome this.

* Display a random slide at loading


Use the
randomStart: true
option but be sure you have the latest Nivo Slider javascript file uploaded to your server.

* Remove the ‘image click’ on the slider
* Put the bullets where you want to
* Adjust the space between each bullet
* Use Hover bullet and customize it
* Have unique bullets for each slide (very nice)
* Reverse bullets direction


These last 6 tweaks are described in detail here.

Please note that most of the tricks given above will only work in ‘live mode’, not in preview mode.
Don’t forget to save all the modified files (notably CSS Files) to a local folder (backup) in case you would replace them by mistake on the server (uploading of original files).

My advice: Check don’t show hidden files, folders and drives in the ‘nivo-slider’ folder properties on your local publish folder.

Enjoy!
Post Reply