Main Menu
Most Read
Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_mostread/helper.php on line 79 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_mostread/helper.php on line 79 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_mostread/helper.php on line 79 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_mostread/helper.php on line 79 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_mostread/helper.php on line 79

If you like the products on these pages, your support is highly appreciated. Thank you very much!


Latest Items
Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_latestnews/helper.php on line 109 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_latestnews/helper.php on line 109 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_latestnews/helper.php on line 109 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_latestnews/helper.php on line 109 Warning: Creating default object from empty value in /var/www/clients/client396/web1968/web/modules/mod_latestnews/helper.php on line 109
Very Simple Image Gallery Plugin Installation and Usage
Written by Andreas Berger   
Monday, 29 December 2008 08:04

A step for step tutorial on how to install and use the Very Simple Image Gallery Plugin.


1.) Log into your administration interface

2.) Go to "Extensions" > "Install/Uninstall"

3.) Select the Package File with the Very Simple Image Gallery Plugin

4.) Click "Upload file & Install"

5.) If everything worked fine, you get the message "Install Plugin Success"

6.) Select "Extensions" > "Plugin Manager"

7.) Find the "Very Simple Image Gallery Plugin" and click it

8.) "Gallery width" is the complete width. If you decide to display the thumbnails below the main image, this is the width of the main image. If you decide to display the thumbnails right of the main image, "gallery width" is the width of the main image plus the space, used by the thumbnails.

9.) "max. Image height" allows to set if the images use the full available width (empty) or if they get scaled to meet the set maximum height (integer, e.g.: 300). Using this parameter makes sense if you are showing images of different proportions in one gallery.

10.) The next parameter is the quality of the images in percent. Values from 80 to 90 will do fine. Remember, the higher the quality, the larger the filesize!

11.) The next parameter sets the position of the gallery within the available space. You may choose between left - centered - right, float left and float right. The last two options allow the gallery to get wrapped by your text. They also increase the dependence from the used template and will not always show the desired results!

12.) The next parameter to configure is the maximum width of the thumbnails in pixel.

13.) Next comes the maximum height of the thumbnails in pixel.

14.) The next parameter sets if thumbnails get scaled proportionally or cropped to fit the set maximum values.

15.) The next parameter is the quality of the thumbnails in percent. Values from 60 to 70, maybe 80 will do fine. Remember, the higher the quality, the larger the file size!

16.) Next comes the space between the thumbnails in pixel. Try out what fits best, there is no given rule.

17.) The thumbnails may get displayed left, right or below the main image. What fits your needs depends on your template.

Starting with Version 1.2.0 there is a third option available "below justified". If selected, the plugin takes your settings and modifies the size of the main image and the size of the thumbnails to justify the thumbnails exactly below the main image.
This works only, if you have set the width of the main gallery in pixel!

18.) If you have decided to show the thumbnails right of the main image, this is the parameter to set the number of columns of thumbnails to show. If the set value leads to a situation where there is no more room for the main image at all, the plugin shows one column only.
If you have decided to show the thumbnails below the main image, this parameter is of no relevance.

19.) "Sort Order" sets the order the images are shown. You may choose between alphabetic ascending, alphabetic descending, old to new and new to old (both use "last changed" not "created"!) and random.

20.) Starting with version 1.5.0 the parameter "Sets" offers the possibility to split a gallery into multiple sets (refer the samples). Left empty all images are shown on one page. Same goes, if the given value is higher than the number of images found.

Any other value (3, 4, ...) creates multiples sets and generates links that allow to navigate between the sets. In addition, a counter is generated, that shows the number of sets available.

21.) "Label Sets" tells the counter how to - yep - label the sets. "Set", Desk", "Page" ... your turn.

22.) The parameters "Link/Button forward" and "Link/Button backward" set the button/text, you want to use for the links, that allow to navigate between the sets.

Left empty the plugin will use the automatically installed default buttons.

If you insert text, this text will be used.

Instead of the default buttons or text links you may also use custom buttons. Just insert the name of the image-file you want to be used (including the suffix). The plugin detects .jpg, .gif and .png and searches for the corresponding file in the set folder (we will set this a little later, by default it is "/images/stories/vsig_buttons"). If the file exists, the image is shown.

23.) If you activate "Show captions?", you have the possibility to add Title and Text to your images.

24.) "Position of Captions" sets if the captions (and text) are shown cross-fading over the lower part of the main image or below the main image.

25.) "Use links?" allows - if activated - to set links for the images.

26.) If "Link Original Image?" is activated, the plugin automatically creates a link from the main image to the original image file, opened in a new window.

27.)Image root configures the path to the folder you are uploading (directly or stored in subfolders) your images. By default this parameter is set to /images/stories/ in Joomla!1.5 and /images/ in Joomla!1.6/1.7 (and this folder is also used when the parameter is empty). In most cases this setting will fit your needs and there is no reason to change it. Only if you have organized your images in a folder structure outside of the default image folder, put the path here.
The set value of this parameter will be added to the folder name you insert in the code in your article automatically by the plugin and must not be repeated in the article.

28.) Buttonfolder
If you are going to use custom buttons for the navigation between sets, this is the place to put the path to the folder you uploaded this buttons. By default this parameter is set to /images/stories/vsig_buttons/ in Joomla!1.5 and /images/vsig_buttons/ in Joomla!1.6/1.7 (and this folder is also used when the parameter is empty).

29.) "Use JavaScript?" decides if a click on a thumbnails just replaces the main image without reloading the page (option YES) or if a click reloads the page with the new main image. To use JavaScript is more comfortable for your visitors, but if page-views are very important for you, you may choose to work without.
Visitors having JavaScript disabled will get served the second option anyway. This way we provide a noscript-fallback so anyone can use the gallery.

30.) If you activate the parameter "Switch on hover thumb?", the main image is changed when the mouse-pointer moves over the thumbnail. The feature requires the parameter "Use JavaScript?" to be activated.

31.) The parameter "Preload images" allows to load every - not already visible at page load - image/thumbnail using JavaScript as soon as the page finished loading. This is a good idea in general but really important if you have activated the parameter "Switch on hover Thumb?" because in this situation, the time it takes to load the image when a visitor hovers a thumbnail is extremely disturbing.

32.) "File names as tooltips?" allows to activate/deactivate the usage of the image file name (without suffix) for ALT and TITLE of the images if neither a caption nor a link is specified.

33.) The parameter "Foldername as ID" gives you the possibility to set the name of the folder, from which the images are taken, as identity of the surrounding div-container of the gallery. (id="foldername").

The plugin contains in the folder (Joomla-Installation)/plugins/content/plugin_vsig (Joomla!1.5) or (Joomla-Installation)/plugins/content/verysimpleimagegallery/files (Joomla!1.6/1.7) the stylesheet vsig.css. This stylesheet is loaded after the css-settings the plugin writes to the head-section of the page and gives you the possibility to overwrite every single setting. This works anyway and applies to all "very simple image galleries" on your site.
Setting a unique identity gives you furthermore the possibility to use this identity as a CSS-Selector and use individual styles for one single gallery.

34.) At the last you find the results of the GD-check, the plugin performs. The GD library is the most widely spread extension of PHP when it comes to image manipulation and the plugin makes use of this library to create the plugins. It checks if the library is available at all and if the relevant image file formats (jpg, png and gif) are supported.

If one or two file formats are not supported, the plugin will still work with image files of the remaining file format(s).

If the GD library is not available at all, the plugin cannot be used. In this case I recommend to ask your hoster if the GDlib can get enabled for your account.

35.) Activate the plugin

36.) Click "Save" - done



Next we need the images. We upload them to a folder in (Joomla-Installation)/images/stories in Joomla!1.5 or (Joomla-Installation)/images in Joomla!1.6/1.7. The following points refer to Joomla!1.5, anyway, beside of the folder nothing changes in Joomla!1.6/1.7.

1.) Go to "Site" > "Media Manager"

2.) Navigate to the folder "Media" > "stories"

3.) Create a new subfolder for your images. In this sample I choose the name "verysimple"

4.) Open the new folder ...

5.) ... and upload your images to it. The plugin accepts images of type ".jpg", ".gif" and ".png".

6.) Go to "Article Manager" and open the article you want to display the gallery.

7.) At the place you want the gallery to be shown insert the code to call it.



The code consists of the call {*vsig}{/vsig*} (without the asterisks) and contains the name of the folder with your images. The configured path to this folder (image root, by default "/images/stories" in Joomla!1.5 or "/images/" in Joomla!1.6) is added by the plugin automatically and must not be inserted.

The complete call in our sample would look such as:

{*vsig}verysimple{/vsig*} - without the asterisks

To use a folder within a folder, the path below the set root folder is used, e. g. to use the folder /images/stories/folder/subfolder" the call in Joomla!1.5 would look such as:

{*vsig}folder/subfolder{/vsig*} - without the asterisks

In general that´s it and the gallery is ready to go.

How to show title and text with our images or modify the current gallery from the default-settings in the backend, find out in the second part of this howto (link at the end of the page).


8.) Save - done!



The plugin creates in the given folder subfolders called "vsig_images" and "vsig_thumbs". Into these folders it saves the images/thumbs following the naming convention:

"imagename" underline "width" underline "height" underline "quality" point "filetype"

e.g.: "myimage_80_60_80.jpg"

Although the plugin creates this files, it does not delete them. Therefore - after having tried different settings - it may be useful to delete obsolete images/thumbnails.

1.) To do so - after having opened the gallery at least once in the frontend - we go to "Site" > "Media Manager" again

2.) The folder with our images ("verysimple" in this sample) now contains the subfolders "vsig_images" and "vsig_thumbs".

3.) Obsolete files in these folders may be deleted. If you delete a - still needed - image/thumbnail too: No problem, the plugin recreates it automatically.

The plugin validates images by name and size. Therefore the plugin will not automatically notice, if you have replaced a image with another of the same name and size. To have an image/thumbnails created for the new image you have to delete the corresponding scaled image/thumbnail by hand from the folders mentioned above. This way the plugin will use the new original image to recreate the image/thumbnail.

A survey of the possibilities to call, extend and modify galleries with the code in the content item (Paramater Overrides, Links, Captions): Howto Plugin Code

If you have questions or suggestions, please use the comment-function. Please include the installed Joomla! version and if you have problems - if any possible - the affected page in your comment.

If you need additional features or customizations for your project that exceed the scope of support offered through the comments, you are invited to submit your requirements specification and the planned budget by email (menu item "Contact" in the menu at the top).

If you use this extensions, please post a rating and a review at

Last Updated on Tuesday, 08 November 2011 22:11
Comments (35)
folder not found
15 Wednesday, 26 October 2011 19:36

Installed VSIG on Joomla 1.7 and used in an article but says folder could not be found.

But the folder path the plugin displays is correct path.

Pls help

Thursday, 27 October 2011 18:19
A. Berger

Hi pelister!

Please check the directory permissions of the folder (folder - 755, files - 644) and - in a second step - check if the path to the folder is fragmented by HTML tags in your article (switch to HTML view and check for BR, SPAN, P, etc.) If there are any, remove them.

If neither the first nor the second step solves the problem, please provide a link to the page, I will have a look at it.

Best regards

Controlling position
14 Wednesday, 26 October 2011 04:49

Hi, I have the plugin installed and working proper.y. Can it be configured to be placed in the left margin, instead of along with all the other articles?

I don't understand the usefulness of this plugin if it's only shown as an article?
After three or four articles, it's shifted to the end of the page, then off the main page. I also have about 100 images I'd like to display, so the thumbnails are very long down the page.
Perhaps this isn't the right plugin for me? If it's not possible to configure this as an image gallery that is always visible on the page, maybe you have a suggestion for a more suitable plugin?

Thanks so much.


Wednesday, 26 October 2011 13:15
A. Berger

Hi dave!

What you are looking for is rather a module than a plugin. The purpose of a module is to display it's content at a fixed module-position. The purpose of a content-plugin (like this one) is to modify content (e.g. replace code in an article with a gallery).

Best regards

Captions wie einfügen?
13 Friday, 21 October 2011 21:51

Hallo, würde in der Galerie gerne den Bildern einen Titel und zwei Zeilen Text hinzufügen. Wo muss man das bei Joomla 1.6 machen?


Wednesday, 26 October 2011 12:47
A. Berger

Hallo Lars!

Captions werden über zusätzliche Codezeilen im Artikel selbst definiert. Die Seite "Howto Plugin Code" (Link im Menü links) erklärt das Feature.


target of linked image
12 Thursday, 13 October 2011 22:43

First of all: a real brilliant plugin!

One question: I enabled the use of "Link original image", but I would like to change the target in a way that the new window shows without the browser bar. I think it can be changed in the Javascript...could you please help me out and tell me how and where to modify the script?

Thanks a lot!

Wednesday, 26 October 2011 17:27
A. Berger

Hi Laurens!

To achieve this, you will have to patch not only the JavaScript but the whole plugin because at the moment, the link to the original image is a pure X-HTML link. What you need for your link is JavaScript. This is not within the scope of the plugin up till now.

Best regards

thanks your art
11 Tuesday, 27 September 2011 09:27

thanks so much!

10 Thursday, 08 September 2011 06:42

Un grand merci de La Réunion, petite île très au sud de l'Europe !

Il manque juste la traduction française sinon c'est un plugin parfait !

9 Saturday, 13 August 2011 14:13

outstanding work. thank you.

Thanks very much
8 Wednesday, 15 June 2011 14:54

Hi Andreas,

Just wanted to thank you for your excellent work.
Your plugin works great for me!!


very simple image
7 Sunday, 05 June 2011 19:15

installationsanleitung ist total easy beschrieben, hab auch gedacht, dass ich das doch prima kann, aber leider funktionierts nicht - fehlermeldung "404 - beitrag nicht gefunden" erscheint...
wieso denn das?

liebe grüsse

Monday, 06 June 2011 20:16
A. Berger

Hallo Gina!

Deaktiviere im Backend das Plugin und ruf den Artikel erneut auf. Aller Voraussicht nach wirst Du die selbe Fehlermeldung erhalten, was dann eindeutig zeigt, dass sie nichts mit dem Plugin zu tun hat.
Überprüfe den Menüpunkt, den Du für den fraglichen Artikel angelegt hast. Er ist vermutlich nicht korrekt.

Sollte das Deaktivieren des Plugins doch den Fehlr 404 beseitigen - dann poste bitte einen Link zur Seite, ich schau mir das gerne an.


linking to large images
6 Thursday, 02 June 2011 01:53

Hi, this extension works great. Thank you so much for it. Is it possible to link each main (large) image to its own article? In other words, I'd like people to hover over the thumbs then see the large image, then place a link onto that large image to its own page so they can print it. Is there an easy way to do this? Thanks. (oh also I want to do what you said and make custom thumbnails, in case that affects what I'm saying--I don't think it would). I'm on 1.6 using JCE.

Thursday, 02 June 2011 20:54
A. Berger

Hi Vicky!

To link the main image to a specific target you can use the feature "Links", check the page "Howto Plugin Code" (find the link in the menu at the left), it explains the feature.
To link the main image to the original image file - just enable the parameter "Link original image?".

About custom thumbnails - it is of course possible to replace the thumbnails the plugin creates with your own but be aware that the plugin will create new thumbs as soon as you adjust settings that change the thumbnail dimension or quality.

Best regards

Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 129 Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 135 Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 129 Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 135 Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 129 Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 135 Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 129 Warning: Illegal string offset 'active' in /var/www/clients/client396/web1968/web/templates/biz_blue_ii/html/pagination.php on line 135
Panoramic Image Viewer
Follow me on Facebook
Follow me on Google+

Add to circles

Who's Online
We have 97 guests online