| WordPress

Smart Slider 2

One of our students was having issues configuring a WordPress slider that was buggy. So we suggested he give Smart Slider 2 a try instead.  After using Smart Slider 2 his review was:

"I just accomplished in less than 30 minutes what I have been trying to do since yesterday. Very intuitive ui and gives me exactly what I was looking for."

So we created this tutorial for Smart Slider 2 so that you can see what it's capable of. Let's get started.

Install

media_1401844519165.png

In your WordPress admin area, go to:

  • Plugins
  • Add New
media_1401844609889.png
  • Keyword >> Smart Slider 2
  • Search Plugins
  • Install Now
media_1401851409529.png
  • Click OK to confirm the installation.
media_1401851494347.png
  • Activate Plugin

Add New Slider

media_1401851717739.png
  • You'll now see a new Sliders menu item in the left menu. Click on it.
media_1401855455135.png
  • Let's start with the quick slider.
media_1401855572045.png
  • Most of the options are available in the Paid version, but even in the Free version you still have the bare essentials available for a nice looking slider.
media_1401855814461.png
  • Click Add Image
media_1401855800097.png
  • Drag and Drop your images to upload, or use the Select Files button to add them one-by-one.
media_1401856847739.png
  • Select your images
  • Fill-in the information about the image
  • Finally, Add to Slider
media_1401857023336.png
  • If you want users to be able to click the image and be taken to a different page, add the Link for the image
media_1401857322043.png
  • Once you're ready, Generate the slider.

Full Options

media_1401857293376.png
  • To get the full options, click on your Slider's name on the left side.
media_1401880276572.png
  • One of the most interesting options is the Export as HTML. This could be really useful for a static site for which you need a nice looking slideshow.
  • Click on Edit Slider to see additional options.
media_1401880484077.png

You're now presented with many of additional options, such as:

  • Responsive mode
  • Alignment
  • Margin
  • Font-size
media_1401880587755.png
  • Animation controls
media_1401880639700.png
  • Resize
  • Randomize
  • Autoplay
media_1401880725635.png
  • Device display
media_1401880785679.png
  • Navigation
  • And a lot more features in their Paid version, if you need anything extra.

Publish

media_1401880967425.png
  • Navigate to your post or page, then click on the S icon in your WYSIWYG toolbar.
media_1401880992933.png
  • Click on your slider's name
media_1401881012793.png
  • A short code will be inserted into page or post: [smartslider2 slider="1"]
  • The number within the quotes is the ID of your slider
media_1401881468609.png

About the author

Nick is the Director of Support at OSTraining and you can find him in almost every area of the site, from answering support requests and account questions to creating tutorials and software.