Joomla Blog

Tutorials, reviews, case studies and other tips to help website owners and website developers master the Joomla content management system.

How to create Joomla sliders

This week we’ll take a look at a new slider building extension from Offlajn. It's a pretty nice toy to play with, and while we haven't had it for long enough to become complete experts yet, the benefits are pretty clear if you're wanting to include dynamic content on your website.

It’s Joomla 1.5 native, and it’s compatible with 1.6, 1.7 and 2.5.

Whether they’re built with Javascript / Ajax, Flash or some other technology, sliders and accordions have been around for quite a while now on the web. All wildly popular effects used in websites end up feeling dated or cliché, but accordion effects have stayed popular for many reasons. They have always been very customizable in look and feel, and they provide a real function for a website with a lot of information to display. We’ll quickly discuss their main benefits and then jump right into showing how SmartSlider works.

Sliders are great because you can fit a large amount of content within a small area. This is particularly good if you're working with a smaller, fixed layout website, or you have a lot of written content to display but don't want to scare readers away with a "wall of words." We all know that web pages can be “infinitely scrollable”, but we also know how quickly most of us will leave a page if it looks like a novel has been pasted into the home page.

Good organization of content makes navigation much more fluid and natural, and it also allows your visitors to find the content they want quicker and more easily. They will thank you for that by staying on your site longer.

The SEO benefits of accordion sliders are also quite nice. You can carefully craft a large amount of text and place it into a small amount of real estate. If you go to the front end of your site, load the page and view the source you'll see all of your text in the html. This is important because if you can see it in the source, the search engines will see it as well. Where you place the accordion module on the page and where you put the slides is important too, so plan everything out carefully.

The extension is pretty easy to install. There may be a bit of a learning curve with this one, but that will get better and better as more documentation and examples come online. There are a lot of buttons to push and knobs to tweak with this extension. If you like to tinker, you’ll love this one. Once you spend some time with it, the pages feel more intuitive. For instance, the slider pages allow you to set overall settings such as the Name, Width, Height and of course the Slider Type as you can see below:

On that same page, you have the option to choose a Theme and then manage that Theme. We went with the default settings, but as you can see below there are quite a few settings to tweak and customize for the overall look and feel:

Once you’ve created your slider, you move on to the slides themselves, and they are attached to the slider in the back end so you don’t have to go hunting for them through the Article Manager or K2 items. Kind of nice. So once you tell the extension to create some slides for your slider, you can edit them and define the content for each one.

This extension has the ability to create some pretty complex accordion sliders. You can create multi-dimensional slides where you have a horizontal slider within one slide of a vertical slider. If you have no idea what that means, head over to their demo site and have a look around at what they’ve created:

The editor section of the slide editing page looks like this:

Most of the settings are pretty self-explanatory, but the ability to create a hyperlink from a linked image within the slide is pretty nice. You don’t have to upload every image to your Joomla website, and you can direct users to wherever you want very easily this way.

The editing page also features a constantly updating preview of the slider as you work on it. If you’ve worked with extensions where you have to make your change, save, close, go to the front end and refresh every time you make a change, you’ll see how handy this preview is:

And next is the final product. It took very little time really, and as you can see the extension provides a very easy way to include Youtube videos directly in the content of a slide. If you know the Youtube video ID, and you can copy/paste, you can have video in your accordion sliders!

With the SEO, navigation and space saving benefits of accordion sliders it’s no wonder that they are so popular. This extension makes some complex and quite nice looking modules possible with just a bit of patience and practice.

Rate this blog entry:
K2 templates
K2 Tags

Related Posts



No comments made yet. Be the first to submit a comment

Free Joomla TutorialLearn Joomla for free with our 16 lesson, 2 hour course.

Get Started