Thickbox Demo

Some examples and complete syntax snippets for using Thickbox for Joomla.

Beware: image path may be different on your installation! Relative paths from your Joomla installation directory should work.

 

Iframed Content (click here)

Syntax:

{ tiframe linktext:="Iframed Content" width:="850" height:="650" url:="http://www.jibbie.de"}

Just add a "thumb"-path to link from image:

Have a nice day

Syntax:

{ tiframe linktext:="Have a nice day" width:="1050" height:="750" url:="http://www.jibbie.de" thumb:="/images/jibbie_250.gif"}

Just add a "gal"-name to create a link gallery (fka 'web tours') :


Go Linux 1 - LinuxMint
Go Linux 2 - Manjaro
Go Linux 3 - Elementary OS
Go Linux 4 - Find your own

Syntax:

{ tiframe linktext:="Go Linux 1" width:="1050" height:="750" url:="http://www.linuxmint.com" gal:="link"}
{ tiframe linktext:="Go Linux 2" width:="1050" height:="750" url:="http://mageia.org" gal:="link"}
{ tiframe linktext:="Go Linux 3" width:="1050" height:="750" url:="http://distrowatch.com/dwres.php?resource=major" gal:="link"}

Since v.1.2 you can do this with thumbnails as well :


Go Linux 1 Go Linux Go Linux 2 Go Linux 3

Syntax:

{ tiframe thumb:="/images/tux2_klein.jpg" linktext:="Go Linux 1" width:="1050" height:="750" url:="http://www.linuxmint.com" gal:="link"} { tiframe thumb:="/images/tux2_klein.jpg" linktext:="Go Linux 2" width:="1050" height:="750" url:="http://mageia.org" gal:="link"} { tiframe thumb:="/images/tux2_klein.jpg" linktext:="Go Linux 3" width:="1050" height:="750" url:="http://distrowatch.com/dwres.php?resource=major" gal:="link"}

 

 

Inline Content

First create a div with a unique ID and some important content like this:

You should read this text again in a single box.

Syntax:

<div id="test"><p>You should read this text again in a single box.<p></div>
{ tinline linktext:="Inline Content" width:="450" height:="300" inlineId:="test" }

 

 

 

Single image

schöne Blume

Syntax:

{ timg title:="schöne Blume" thumb:="/images/plant4_t.jpg" img:="/images/plant4.jpg"}

 

 

Image Gallery

am Rhein am Rhein am Rhein am Rhein

Syntax:

{ timg title:="am Rhein" thumb:="/images/landscape10_t.jpg" img:="/images/landscape10.jpg" gal:="gallery-landscape"} { timg title:="am Rhein" thumb:="/images/landscape5_t.jpg" img:="/images/landscape5.jpg" gal:="gallery-landscape"} { timg title:="am Rhein" thumb:="/images/landscape7_t.jpg" img:="/images/landscape7.jpg" gal:="gallery-landscape"} { timg title:="am Rhein" thumb:="/images/landscape8_t.jpg" img:="/images/landscape8.jpg" gal:="gallery-landscape"}

 

 

new in v.2.0:

Image Gallery from Image-Folder with Thumbnail Creation

Produces a gallery from every image (gif/jpg/png) in the specified subfolder of Joomla's image-dir. Thumbnails will be generated in /tmp. Single parameter required is "title".

 

myGallery myGallery myGallery myGallery

Syntax:

{ gallery title:="myGallery"}sampledata/parks/landscape{ /gallery}

 

 

Invisible Inline Content (requires v0.7 or higher)


My invisible Inline Content Box
{ thickbox linktext:="Invisible Inline Content" width:="350" height:="250" }
... some content ...
{ /thickbox}

With v.1.2 you may link to invisible contents from image link as well


My invisible Inline Content Box
{ thickbox thumb:="/images/preview_f2.png" linktext:="My invisible Inline Content Box" width:="350" height:="250" }
... some content .... { /thickbox}
zu den Downloads
zum Forum
zum Blog