| RokZoom Enabled | | Print | |
| Written by Administrator |
| Saturday, 26 January 2008 05:38 |
|
RokZoom is a custom ground up script written in motools 1.1+ that has the features of slimbox with an exciting zoom effect transition to give your image galleries and popups an added flair. Populus fully integrates the JavaScript and the CSS for RokZoom so all you have to do to utilize this technique is install the RokZoom mambot and add an extra element to your image link. Check out the demo below:
The SyntaxBelow is the HTML syntax that you will have to use. Simply place this into your articles. <a href="images/stories/colorado/image1.jpg" rel="rokzoom[colroado]" title="Image 1"> <img src="images/stories/colorado/image1_tn.jpg" alt="image1" class="album" /> </a> An exemplified preview is constructed below to aid your understanding of the HTML format of rokzoom <a href="main image url(relative path)" rel="rokzoom[album name]" title="Title"> <img src="thumbnail url(relative)" alt="Image name" class="album" /> </a> RokZoom - The GuideHow to implement RokZoomRokZoom galleries or single images can be inserted in Content and Custom modules. By utilising a few simple commands, you can easily insert a gallery onto your page. Step 1 - LoginLogin to the Joomla! Administration Control Panel. Go to www.yoursite.com/administrator. Enter the Administrator's Username and password.
Step 2 - NavigationNavigate to the Article Manager. Once you have logged in, hover over the Content link on the top taskbar, scroll down to Article Manager.
Step 3 - Article Content ManagerWhen you have selected the Article Manager link, you will be sent to the Article Manager control panel. Select either Edit or New, depending on whether you want to add rokzoom to an existing or new item.
Step 4 - RokZoom CommandsYou now need to enter the syntax into your content editor. This should resemble the screenshot below. The syntax, in both HTML can be found at the section located here.
The Examples
For the examples of the rokzoom command, all images are located within
the directory images/stories/photos. If we wanted to load image1.jpg by
itself, we would enter:
<a href="images/stories/photos/image1.jpg" rel="rokzoom[colroado]" title="Image 1"> <img src="images/stories/colorado/image1_tn.jpg" alt="image1" class="album" /></a> 
If we wanted to load photo1.jpg, photo2.jpg and photo3.jpg as part of an album, we would use the following syntax:
<a href="images/photos/image1.jpg" rel="rokzoom[photo]" title="Image 1"> <img src="images/photos/image1_tn.jpg" alt="image1" class="album" /> </a> <a href="images/photos/image2.jpg" rel="rokzoom[photo]" title="Image 1"> <img src="images/photos/image2_tn.jpg" alt="image1" class="album" /> </a> <a href="images/stories/photos/image3.jpg" rel="rokzoom[photo]" title="Image 1"> <img src="images/stories/photos/image3_tn.jpg" alt="image1" class="album" /> </a> |
| Last Updated on Friday, 08 February 2008 10:07 |
Group 1 Tab
The exciting new Populus template features a module driven design with loads of module positions, making it one of the most flexible templates we have ever offered. Harness the power and flexibility of Populus to create the ultimate community portal site.
Populus also features our popular integrated tabbed module system, providing you with a powerful way to display your content. Also making its return is the stylish RokSlideShow module, as well as many more features you've come to expect from RocketTheme templates including: RokMooMenu, an incredible 22 module positions with subtle module variations, RokZoom integration, and so much more...
Group 2 Tab
Populus features an incredible 22 fully collapsible module positions providing you with the ultimate in flexibility. Populus includes built in style and implementation for the extra module positions "user10 - user 17". These module positions are not defined in a default Joomla install and must be added.
Group 3 Tab
Populus utilises the javascript library known as mootools to power special effects such as the RokMooMenu, RokSlide integration, and RokZoom features. Populus uses the latest development build of the mootools javascript library, but is also now compatible with the earlier 1.11 version of mootools as well for better integration and backwards compatibility.
Populus' built in mootools javascript and functionality can also be disabled, should you need to use third party extensions which utilise other javascript libraries. Visit the RocketTheme Populus forum for more information. You can find out more information about Mootools on their website, located at http://mootools.net.
Group 4 Tab
The all new Populus template includes custom styling for better integration of the popular Fireboard Joomla forum solution. Using the custom Populus Fireboard theme, you can deploy a great looking forum that will match perfectly with any of the preset Populus color styles!
