RokBox is a mootools powered JavaScript slideshow that allows you to quickly and easily display multiple media formats including images, videos (video sharing services also) and music.
RokBox provides a theme system that allows you to create your own custom ones to fit your websites design. It includes three predefined themes, a Light and Dark theme and a Mynxx theme that will fit seamlessly into your site design. RokBox is as easy as pie to install and customize, providing an easy way to create your own custom themes for it.
Below you will find some examples of the syntax used for a variety of RokBox functions.
This demo will check the directory for existing images and load them
[rokbox title="Multiple Images :: Sample Caption" size="300 200" album="album" class="link-class" imgclass="image-class rt-image" twidth="100" theight="80"]http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/general/rokstories-sample/*[/rokbox]
This demo will load a image
[rokbox title="Audi RS8 :: Sample Caption for RS8 Image" size="561 350" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/rs8_thumb.jpg"]http://demo.rockettheme.com/extensions/images/stories/demo/rokbox/rs8.jpg[/rokbox]
This demo will load a image and use text instead of a thumbnail".
[rokbox size="561 350" title="Audi RS8 :: Sample Caption for RS8 Image" text="RokBox link with no Thumbnail"]http://demo.rockettheme.com/extensions/images/stories/demo/rokbox/rs8.jpg[/rokbox]
This demo will load a image without having provided sizes.
[rokbox thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/sshot2_thumb.jpg" title="Vauxhall VXR8"]http://www.rockettheme.com/images/extensions/joomla/rokbox/sshot2.jpg[/rokbox]
This demo will demonstrate RokBox handling images not found.
[rokbox title="Audi RS8 :: Sample Caption for RS8 Image" size="561 350" thumb="images/some_folder/not_existing_thumb.jpg"]images/some_folder/not_existing.jpg[/rokbox]
This demo will load and play a mp3 file.
[rokbox title="RocketTheme promo" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/mp3.jpg" size="250 15" album="demo"]http://demo.rockettheme.com/extensions/images/stories/demo/rokbox/rockettheme.mp3[/rokbox]
This demo will load a simple flash movie (.swf) file.
[rokbox title="RocketTheme :: RocketTheme Logo's flash movie" size="400 140" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/flash.gif"]http://demo.rockettheme.com/extensions/images/stories/demo/rokbox/rt_movie.swf[/rokbox]
This demo will load a YouTube movie.
[rokbox title="Cars :: 2010 Aston Martin Vantage V 12" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/youtube.jpg" size="854 505" album="demo"]http://www.youtube.com/watch?v=6RWQz0Q7_zY&hd=1&autoplay=1[/rokbox]
[rokbox title="Cars :: 2010 Aston Martin Vantage V 12" text="normal quality" size="425 373" album="demo"]http://www.youtube.com/watch?v=6RWQz0Q7_zY[/rokbox]
[rokbox title="Cars :: 2010 Aston Martin Vantage V 12" text="HD + autoplay + layout colors" size="854 505" album="demo"]http://www.youtube.com/watch?v=6RWQz0Q7_zY&autoplay=1&fs=1&color1=0x5d1719&color2=0xcd311b&hd=1&border=1[/rokbox]
[rokbox title="Cars :: 2010 Aston Martin Vantage V 12" text="HD + autoplay + start from 36s" size="854 505" album="demo"]http://www.youtube.com/watch?v=6RWQz0Q7_zY&hd=1&autoplay=1&start=36[/rokbox]
This demo will load a FLV movie.
[rokbox title="Primavera :: A look at Earth and space." thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/flv.jpg" size="854 505" album="demo"]http://demo.rockettheme.com/extensions/images/stories/demo/rokbox/primavera.flv&buffer=10&autostart=true&fullscreen=true&width=854&height=505[/rokbox]
This demo will load a Metacafe movie.
[rokbox title="Magic Beans :: How to Make Jumping Magic Beans" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/metacafe.jpg" size="400 345" album="demo"]http://www.metacafe.com/watch/1291008/how_to_make_jumping_magic_beans/[/rokbox]
This demo will loads an external site, in our case Google's home page.
[rokbox title="Did you mean... :: ...Google?" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/google.jpg" size="700 450"]http://www.google.com[/rokbox]
This demo acts like the previous one, but we're using percentages as size.
[rokbox size="65% 80%" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/google.jpg"]http://www.google.com[/rokbox]
This demo acts like the previous one, but instead of percentages we're using the fullscreen option as size.
[rokbox size="fullscreen" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/google.jpg"]http://www.google.com[/rokbox]
This demo will load a PDF file.
[rokbox size="fullscreen" album="demo" title="RokBox :: PDF File" thumb="http://www.toolsinc.com/wordpress/wp-content/rockettheme/rt_panacea_wp/rokbox/pdf.gif"]http://demo.rockettheme.com/extensions/images/stories/demo/rokbox/rokbox.pdf[/rokbox]