Created: 13/03/2012
By: Matthew Ruddy
Plugin Version: 1.0.5.2
Thank you for purchasing the Riva Slider Pro. If you have any questions not covered in this documentation, feel free to send a support request here and I will get back to you as soon as possible.
The Riva Slider Pro is very easy to install and can be installed via the Wordpress Admin's Plugins panel. Upon downloading the plugin, unzip the .zip file you have received. There, you will see two files:
Upload the riva-slider-pro.zip file via the Upload tab in the Plugins panel:
Finally, the plugin should show in the list of plugins in the Plugins admin menu. Activate it as you normally would. A new tab titled 'Slideshows' should now be visible.
Displaying slideshows in posts is done very easily. In the Post Editor, navigate to the Slideshow Image metabox. You will see a button titled 'Insert a slideshow' with a drop-down menu above it. Select the slideshow you wish to insert into the post in the drop-down menu and click the button below. The appropriate slideshow will now be inserted into the post.
Slideshows can also be displayed in theme template files using the PHP function below. Replace the $id with the unique ID of the slideshow you wish to display.
<?php if ( function_exists( 'riva_slider_pro' ) ) { riva_slider_pro( $id ); } ?>
The unique ID's can be found here:
Riva Slider Pro has its own widget you can use to display a slideshow in a sidebar/widget area. Use the widget in the same fashion as you would use other widgets.
Adding a slideshow with the Riva Slider is very easy. To start, click the 'Add new' link within the 'Slideshows' tab.
This will bring you to the create a slideshow interface. Enter a name in the highlighted message box.
Now click the 'Create Slideshow' button. You will be prompted that the slideshow has been successfully created (unless there is an error). That's it.
To duplicate a slideshow, go to the 'Slideshow' admin tab. Here you can see all of your current slideshows. Hover over a specific slideshow, and click the 'Duplicate' link.
Deleting multiple slideshows in one go is possible with the Riva Slider. To do so, mark the slideshows you wish to delete by checking the checkboxes on the left have side fo the slider's name. Next, click the 'Bulk Actions' drop-down menu and select 'Delete'. Now click 'Apply', and the selected slideshows will be deleted one by one.
To add an image to a slideshow, click the 'Add an Image' button when editing that slideshow.
Next, you will be presented with the Wordpress Media panel. It should automatically be viewing the Riva Slider Pro tab. Click the 'Use this Image' button on the image you wish to add.
The image should now be visible in the slideshow editor panel.
To link an image to a webpage, click the image (in the slideshow editor) to edit the image's settings.
Under the 'Image', make sure 'Webpage' is selected from the option labelled 'Link Image Too''.
Now enter a webpage link into the option labelled 'Webpage URL' below the previous option. You must include 'http://' before the link in order for it to work..
Before adding a video, it is important to note that only Youtube & Vimeo videos will work with the Riva Slider Pro. To add a video, click the image you wish to link the video too (in the slideshow editor).
Select 'Video' under the option labelled 'Link Image Too'. The 'Webpage URL' option will now disappear and the video options will replace them.
Now it is time to get our video's URL. The Riva Slider Pro automatically fetches the video from the video's webpage for you, so there is no complicated procedure to follow. Simply navigate to the page containing the Youtube or Vimeo video you want to link the image too, and copy its URL from the address bar in your browser.
Next, select whether you want the video to automatically play when loaded via the 'Auto-play' option, and if you would like to display related videos once the video has ended via the 'Related Videos' option (Youtube only). Lastly, you can set the position of the play video button via the option labelled 'Button Position'. Save your slideshow's changes, and that image should now display a video when clicked in the slideshow.
Adding a title and/or text to an image is very straight-forward. As usual, click the image you wish to add the title/text to. This will open up the image's settings.
Now navigate to the 'Text' tab. Here you will see the various text options including the text overlays positioning, background colour, text colour alongside the title & text options themselves.
To change the text's background colour and text colour, you can use the colour-picker tool provided by clicking the icon to the right of the options labelled 'Background Colour' and 'Text Colour'.
Your title and/or text should now appear on the appropriate slideshow image.
Riva Slider Pro provides you with multiple options for changing the preload icon displayed when the slider is loading (if enabled). To change it, go to the 'Preloading' tab in the slideshow editor. Find the option labelled 'Preload Icon' and press the 'Show the options' button.
Click the preload icon you would like to use and it will become selected.
With the Riva Slider Pro, you can also add your own preload icons. This can be done by adding the custom icon to the images/loading folder inside the plugins files.
Only .jpg, .jpeg, .gif & .png images are compatible. Try to keep them to a maxium height & width of 24px ideally, but this is not necessary. As you can see below, the icon now appears within the various preloading icon choices.
The Pause timer is the scrolling bar displayed at the bottom of the slider indicating the time remaining before the next transition. It can be enabled or disabled from within the 'Transitions' tab inside the slideshow editor.
The Direction Navigation can be managed through the 'Navigation' tab within the slideshow editor panel. You can choose to only show it when the user hovers over the slideshow, or permanently. It can also be positioned inside or outside the slideshow itself.
The Control Navigation are the icons/numbers/thumbnails used to represent each individual image in the slideshow. They also highlight the image that is currently being shown, and allow the user to jump from image to image with ease.
You can choose which index type of control navigation you would like to display through the 'Navigation' tab in the slideshow editor, along with some other options such as the positioning.
When thumbnails are selected, the 'Thumbnail Width' and 'Thumbnail Height' options will appear. You can use these to adjust the width and height of each individual thumbnail.
The Pause Button is used to pause the slideshow from transitioning. I can be enabled or disabled from within the 'Navigation' tab in the slideshow editor. You can also choose to only show it when the user hovers over the slideshow, or permanently.
The General Settings can be managed from within the 'Settings' tab in the slideshow editor panel. Here you can control the width and height of the slider, the start image, the image order, the name and description (for your own reference).
The Auto-Play Setitings can be controlled from within the 'Settings' tab in the slideshow editor panel. You can choose to disable auto-play, only play through the slideshow images once and/or only display the navigation icons once all the images have been shown.
Riva Slider Pro makes it easy to create individually styled slideshows. Skins allow complete control for designers to use their own images and CSS to style the slideshow. Not only this, but the Riva Slider Pro also comes with an innovative and completely customizable styling interface that allows you to make your slideshow unique without having to touch any code at all.
To use the custom styling interface, set the option labelled 'Select a Skin' to 'Custom'. The Styling Directory will now appear.
Now select the part of the slideshow you wish to style by selecting it through the drop-down menu that currently is set to 'Select A Section' (as seen above). As an example below, I have chosen the 'Direction Navigation'. It's styling options have now appeared.
If you wish to add your own Skin to the Riva Slider, follow these steps.
/* Skin Name: My Custom Skin */You may replace the words My Custom Skin with the name of your skin. This is the name that will appear in the 'Select a skin' drop-down menu mentioned above.
Your custom skin should now be selectable in the 'Select a skin' drop-down menu (like below).
Due to the dynamic nature of the Riva Slider Pro's CSS, there are some custom-made constants that can be used in your custom skin's style.css file that will be replaced dynamically. These are as follows:
The Advanced Settings tab allows you to Backup that slideshow. It can be found in the 'Advanced' tab in the slideshow editor panel.
To import slideshow settings, copy the Export code from a different slideshow. Next, paste them into the 'Import' textarea of the slideshow you want to import the settings too. Now click the 'Save Changes' button and the settings will be imported. You should see a success message if all goes well.
Riva Slider Pro allows you to choose between using the Images Panel in the slideshow editor, or Images From Posts.
Selecting this option will disable the Images Panel.
The slideshow will now get its images from posts. The dropd-down menu currently set to 'All Categories' can be changed to a specific category if you wish. If so, the slideshow will only get images from that category only. However, first we have to make sure that atleast one of the posts has slideshow images set to them.
To set a slideshow image within a post, we first must edit the post in which we wish to do so.
Click the 'Insert an image' button. The Wordpress Media panel will show, which should automatically be viewing the Riva Slider Pro tab. Find the image you wish to use and click 'Use this Image'.
The image will now be inserted in the Slideshow Image metabox. Make sure you save the post. The image should now show in the appropriate slideshow(s) set to Images from Posts.
Linking image to webpage's and video's is done in the same way when using Images from Posts. As you can see above, you can edit all the Slideshow Image's settings from within the metabox similar to the way you would when using the Image Panel.
The Global Settings tab allows you to control what scripts are being loaded, and also provide you with some other information about your site and plugin version. It is often useful to quote the 'Installation Settings' values when making a support request over an issue you may be having.
Don't forget to enter your Serial Code if you wish to receive update notifications and have access to them. The plugin will work without the Serial Code, but it is a good idea to keep as up to date as possible. The Serial Code is the same code as the Paypal Transaction ID of your purchase (of the plugin).
To export plugin settings, click the 'Export Plugin Settings' button in the 'Global Settings' admin menu. This prompt your browser to download a .txt file contains all your Riva Slider Pro settings.
To import plugin settings, paste the code from the download export file into the "Import" textbox. Then click the 'Save Settings' button and the settings will be imported.
Riva Slider Pro comes with various custom user permissions that allow you to manage what user roles can view and edit certain pages of the plugin. These are as follows:
The permissions assigned to each User Role can be managed by the Members plugin.
Updates are distributd in the same way as all other Wordpress.org plugins. The 'Global Settings' admin menu will also notify you. If you see an update message, click the 'plugins' link.
This will take you to the Plugins admin menu. To begin the upgrade, click the 'updade automatically' link.
The plugin will then be automatically updated. Once completed, the update is complete!
This is a common problem that occurs when another plugin/theme is loading jQuery incorrectly. There are a couple of things you can try before making a support request.
If all of the above fail and the problem still persists, contact us providing a link to the page with the malfunctioning slideshow on it and we will get back to you as quickly as possible with a fix.
Generally visual issues with the plugin are caused by CSS conflictions from the theme or other plugins. This problem is most easily fixed if you contact us straight away, unless you wish to tackle the problem yourself. These issues are very quick fixes and reporting them to us will allow us to prevent them from occurring in future updates of the plugin.
This is a problem often caused by the hosting company you are using. Some hosting companies by default have GD_Library disabled (such as Hostgator). GD_Library is required for the Timthumb Image Resizing script to function correctly.
A temporary fix to this issue is to disable automatic image resizing within the plugins 'Global Settings' page (within the 'Slideshows' admin menu). Set Enable Image Resizing to false. This will stop the plugin from resizing your images, which may make them look distorted or too big/small for the slideshow. It would be advised in this scenario that you use images that have the same dimensions as the slideshow itself to achieve the best looking effect.
A permanent solution would be to contact your hosting companies support. Ask them to enable GD_Library on your hosting. This should be no problem. When done correctly the broken links issue will no longer occur and your images will now automatically be resized to fit the slideshow.
With the Riva Slider Pro, yes you can! The plugin comes with a .po file you can use to translate the plugin into your own language. However, support for foreign languages is not provided. Issues that may occur in the translation process are not our responsibility and we will not be able to assist you. We understand that it may be difficult to comprehend some of the functionality when your first language isn't English. If you are having such problems, please contact us and we will try our best to explain it in simple terms to you.
Updates are distributed in the same fashion as plugins from WordPress.org. When an update is released, WordPress will notify you from the "Plugins" admin panel.
Plugin updates will be annouced via our Twitter page, so please follow us. WordPress will also notify you of plugin updates (like it does for all other WordPress.org plugins) via the "Plugins" admin panel.
Yes, upgrading your license is no problem. The upgrade cost will be determined by the price of the license you wish to upgrade too minus the price of the license you have already purchased. To upgrade, contact us. Don't forget to state the license you currently possess followed by your previous purchase information.
The Riva Slider Pro is currently supported by the following browsers:
It is also only supported by Wordpress v3.0 or greater.
Thank you for purchasing Riva Slider Pro. Your contribution greatly assists the development of the plugin. If you are stuck or require assistance, as mentioned above you can make a support request through this link. Overall, I hope you enjoy using this plugin.
Matthew Ruddy