Perfect Layouts

I The spacing for all elements like headings, paragraphs and others are em based. Perfect vertical rhythm is now easy to work with!

Piecemaker 2

II I developed my own 3D slider extension to give you a smart solution and easy to use. The demo is ready for you! Give it a try!

Multiple Styles & Automatic Adjustments

III Skywalker comes with 8 beautiful color themes: Blue, Red, Green, Orange, Yellow, Purple, Grey, Magenta, and various scripts to keep the design XHTML valid and cross-browser compatible.

You are here: Home Template Documentation Development NivoSlider
Today isWednesday,22October,2014

Nivo Slider Quick Guide

Welcome to Nivo Slider

This is a quick documentation for NivoSlider module for Joomla! 1.6 on how to re-create the demo content.

What is NivoSlider?

This demo site is using a customized version of NivoSlider, which is a jQuery powered module for Joomla! 1.5, Joomla! 1.6 and Joomla! 1.7 to create a beautiful slider for the images within a folder you can configure in the Module Manager. The module comes with various transitions effects and flexible options. See below :)
You are free to use any slideshow, I would highly recommend GK Tools, and if you need a kickstart, send me a line.. see Support and Feedback.

Download

NivoSlider is a free, GNU license extension. To download the extension, please follow this quick guide:

  • Visit the developer website to download the module. Click here to go now.
  • Scroll down the Download page and click the NivoSlider version for your Joomla! 1.5 or Joomla! 1.6 website.
  • Save the mod_nivoslider.zip or mod_nivoslider_j1.6.zip to your desktop.

Installation

To install the extension, please follow this quick guide:

  • Log in to your administration section (http://your-web-site.com/administrator).
  • Go to Extensions menu at the top, and click Extensions Manager (Install/Uninstall for J1.5).
  • Click Choose file button and browse for the installation file (mod_nivoslider.zip or mod_nivoslider_j1.6.zip) on your desktop (or your Downloads folder). Once the installation file is found, click to select it and click the Open button.
  • Now click the Upload & Install (Upload File & Install for J1.5).
  • That's it!

 

Configuration

All newly installed modules are unpublished and using the standard position position-5 (or left in J1.5). To configure NivoSlider, please follow this quick guide:

  • Log in to your administration section (http://your-web-site.com/administrator).
  • Go to Extensions menu at the top, and click Modules Manager.
  • Use the search feature and find Nivo-Szaki Slider. Once found, click on the module title or select it and click the Editbutton.
  • For the Slideshow directory parameter, type in the path to your images folder. Example: images/slideshow
    Please make sure those images are there and they have the same width x height. Example: 980x300 pixels. Don't worry, the slider should be centered.
  • For the Images attributes parameter, type in descriptions and links for each slide. The usual attributes are alt, title and url, and use one row for each slide. Skipping one of the attributes will result in disabling it in front-end.
    Example 1 - default slide description settings for 5 images:
    Code
    Image1|Image1 Description|http://www.your-link1.net
    Image2|Image2 Description|http://www.your-link2.net
    Image3|Image3 Description|http://www.your-link3.net
    Image4|Image4 Description|http://www.your-link4.net
    Image5|Image5 Description|http://www.your-link5.net
    

    Example 2 - skip slide description for 1 of the 5 images:
    Code
    Image1|Image1 Description|http://your-link1.net
    Image2
    Image3|Image3 Description|http://your-link3.net
    Image4|Image4 Description|http://your-link4.net
    Image5|Image5 Description|http://your-link5.net
    
    For image2, we only need the alt attribute to be used for the image slide. The title and the url are disabled in the front-end.
  • Set the module to use the slideshow module position.
  • Select the Home and/or any other menu items you want your pages to load the NivoSlider.
  • Select the Enhanced option of the Style parameter.
  • Select the No option of the Use sound FX parameter.
  • Select the Slide down option of the Effect parameter.
  • Click the Save button in the Module Manager toolbar.
  • For design customization, please check (and use) the nivo-slider-enhanced.css file in the quickstart package located in Quickstart/modules/mod_nivoslider/assets folder.
  • For questions and error reporting, please contact the developer.

Elegant Design

Crafted with 8 unique styles, Skywalker Template is a great kick start for professionals, corporate clients and blogs.

Awesome Typography

Enrich your content with block numbers, columns, text & code highlight, block quotes, list styles, image wrapping and much much more..

T3 Framework Inside

The man behind the T3 Framework Wikies releasing his first ever template for Joomla! 1.6. A fully featured template backed up by pure power and flexibility. Layouts, profiles, compression, Theme Builder, form replacements... everything you need packed up and ready to go!