Using Themes with the Nivo Slider

To use themes with the Nivo Slider you will have to carry out a few more steps to get the theme to work. First you will need to include the theme in your page (a theme is simply a stylesheet):

<!-- Include the theme stylesheet in the <head> section --> 
<link rel="stylesheet" href="nivo-slider/themes/default/default.css" type="text/css" />

Then you will need to tweak your HTML and make sure it is in the following format:

<div class="slider-wrapper theme-default"> 
    <div class="ribbon"></div> 
    <div id="slider" class="nivoSlider"> 
        ... 
    </div> 
</div>

Now you can call jQuery as normal and your slider should look beautiful with the new theme showing. Note: You can load as many themes (stylesheets) as you want in the <head> section, however they will not be applied to the slider until you add the class theme-{theme name} to the slider-wrapper div.