This tutorial was requested by a Joomla training student in our forum. They wanted to make images and videos on their site more interesting by showing them in a pop-up.
Our advice was to try Rokbox from Rockettheme. This extension can place images, videos, audio files, flash files or even entire websites inside a pop-up. This plugin is also available for WordPress.
We're going to show you several ways to use Rokbox on your site:
The normal way of using Rokbox will only work inside articles. Try using this simple example as a test:
That should place Joomla's save button inside a pop-up for you and also generate a thumbnail for you to click on.
If that doesn't work, you may have a problem with generating thumbnails automatically. You can then try one of these two options:
Using Rokbox in Articles
There are lots of examples on the Rockettheme demo site: Rocketwerx.com. These are very simple examples to get you started:
Using Rokbox Outside of Articles
You can use Rokbox in your other extensions. The only thing you need to do is modify your links so that they contain rel="rokbox".
For example < a href="http://google.com" > becomes < a href="http://google.com" rel="rokbox" > (I've added a space after each < and before each > so you can see the code)
We've used this technique inside many different extensions.
There are three places where you can configure options for Rokbox:
1) Inside Extensions >> Plugin Manager >> Content - RokBox
Here you can change the settings for the thumbnails that Rokbox generates automatically:
2) Inside Extensions >> Plugin Manager >> System - RokBox
Here you can select from several different themes for Rokbox. The default is "Light" which provides a white background, but there are others:
If you enable "Legacy Parameters", you'll also get a much wider range of options. Full documentation on those is available on the Rocketwerx site.
3) For Individual Pop-Ups
We saw some examples earlier. Here are some ways you can modify individual pop-ups: