How To: Add A Parallax Content Slider to WordPress with Free Plugin
Parallax is a nice effect which scrolls the background along with the foreground at different speeds to give the effect of depth, we have previously looked at themes that used it but what if you want to use it in your existing site ? That’s where the free plugin “WP Parallax Content Slider” comes in. It’s a simple free slider plugin which uses CSS3 and jQuery to animate the slides. It is based on code from codrops, you can check out a demo here. In this post I will show you how to install and configure it.
Install The Plugin
Download the plugin and in your WordPress admin, visit “Plugins” > “Add New” > “Upload” and upload the file.
Click “Activate” under the plugin and you will see it then adds a new menu under “Settings” called “WP Parallax Content Slider” visit that to start with the plugin.
Configure the Plugin
The first thing you will need to do is place some code to display the slider – there are two methods for this, adding some PHP code into your theme directly or by placing a Shortcode. These two methods aren’t ideal – I would have liked a method to auto-insert it into the theme.
General Display Options
The next section contains the display options – you can choose whether to make it dynamic which means it pulls content from your blog posts or static HTML, you can set the number of pixels for the background to move and the delay in milliseconds for each slide and finally you have a choice of colors for the background.
This is how the backgrounds look :
The next section is for configuring the dynamic mode options – here you can set whether to use blog posts, pages or both for the slider. You can choose the number to display, sort order and can choose from just your chosen categories. Finally you can set the max title length and choose an image to use if there is no “featured image” set for the particular post.
I quite liked this plugin – it might be a little difficult to install if a user is not familiar with placing PHP code into a theme file – they might struggle to know which theme file to place it in etc and a shortcode is not ideal either as these only work within posts and pages etc.
The actual effect in the slider looks good but I would like to see it a little bit smoother – also uploading a custom background image would be a nice touch. At the moment the easiest way to do this would be to create your image and save it over one of the default images included.
So, check this plugin out if you are looking for something simple to display your existing posts in an attractive way – if you need something more powerfull then I recommend you seek out a commercial example.