Home Joomla Simple Picture Slideshow - Howto Plugin Code
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
Support

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

Amount: 

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
Simple Picture Slideshow Plugin Usage - Code
Written by Andreas Berger   
Sunday, 12 July 2009 18:03

A survey of the possibilities to call, extend and modify slideshows with the code in the content item.

The "Simple Picture Slideshow" Plugin is called from within the content item. The code used offers - beside of setting the folder with the images - additional possibilities to enhance and arrange the slideshow.

A.) the slideshow

The code consists of the call {*besps}{/besps*} (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") is added by the plugin automatically and must not be inserted.

The complete call in our sample would look such as:

{*besps}simpleslideshow{/besps*} - without the asterisks

To use a folder within a folder, the path below the set root folder (by default "/images/stories/") is used, e. g. to use the folder /images/stories/folder/subfolder" the call would look such as:

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

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




B.) Parameter Overrides

Starting with version 1.3.0 the "Simple Picture Slideshow" offers the possibility to change every default setting from the backend whilst calling the plugin within the content item. With this feature it is possible to use different settings for every single slideshow.

To achieve this, the call of the plugin gets extended by the needed parameters. They are separated from the folder name and from each other by vertical bars (|). The have the syntax PARAMETER=VALUE:

List of possible parameters:

width - width of the slideshow in pixel (integer) e.g.: 400

height - height of the slideshow in pixel (integer) e.g.: 300

align - align the slideshow within the content item; possible values: 0 (right), 1 (center), 2 (left), 3 (float left), 4 (float right)

bgcol - background color as hexadecimal value (without leading #) e.g.: ffffff

sdur
- time to show pictures between two fades in seconds (integer) e.g.: 3

fdur - time the fading may take in seconds (integer) e.g.: 1

steps - steps to fade as value from 1-100 (integer) e.g.: 50

auto - start at pageload; possible values: 0 (no), 1 (yes)

sort - images sort order; possible values: 0 (A-Z - DEFAULT), 1 (Z-A), 2 (old-new), 3 (new-old), 4 (random)

setid - use folder name as identity of the top div-container; possible values: 0 (no), 1 (yes)

ctrls - show controls; possible values: 0 (no), 1 (yes)

csort - control elements sort order; any combination of the following values:
1 (Counter), 2 (Start), 3 (Stop), 4 (Back), 5 (Next), - (split between left and right)
e.g.: 1-2345 (refer to Plugin Howto)

cstart - value for control-element "start"; possible values "empty" (default button), any text, filename of button (refer to Plugin Howto)

cstop - value for control-element "stop"; possible values "empty" (default button), any text, filename of button (refer to Plugin Howto)

cfwd - value for control-element "fwd"; possible values "empty" (default button), any text, filename of button (refer to Plugin Howto)

cbwd - value for control-element "back"; possible values "empty" (default button), any text, filename of button (refer to Plugin Howto)

prld - load images afterwards (integer from 3 - "images in slideshow) e.g.: 5; refer to Plugin Howto

caps - show captions; possible values: 0 (no), 1 (yes)

inout - position of captions; possible values: 0 (below the main image), 1 (blended over the main image)

links - show links; possible values: 0 (no), 1 (yes)



Samples:

{*besps}slideshow|width=600|height=450{/besps*} - without the asterisks
Regardless of the settings in the backend, this gallery is shown with a width of 600 pixel (width=600) and a height of 450 pixel (height=450).

{*besps}slideshow|ctrls=0|caps=0|links=0|auto=1{/besps*} - without the asterisks
No controls, no captions, no links, start at pageload.

Notice:

The parameters listed here correspond with the parameters in the plugins configuration panel. Find a details description at: Howto Plugin .
The first parameter of the initial call always has to be the folder name (path). The sorting of the other parameters is arbitrarily.




C.) Captions

Captions and text have there own call. It´s:

{*besps_c}slideshow-number|imagefile|caption|text{/besps_c*} - without the asterisks

Slideshow-number:
The slideshow within one content item are numbered starting with 0.
This setting is obligatory.

Imagefile:
The name of the file "myimage.jpg".
Left empty, the call is used as default for the whole gallery. This means, if there is no setting for an image, this one is used. The file name and suffix are caseINsensitive.

Caption:
The Caption. If left empty . . . no caption is shown.

Text:
The additional text below the caption. If left empty . . . no text is shown.

Samples:

{*besps_c}0||myTitel|myText{/besps_c*} - without the asterisks
This call sets "myTitel" and "myText" as the default values for the first slideshow within the current content item by leaving the imagefile-value empty.
Notice: You don´t have to set a Default. If you don´t and there is no setting for an image, just nothing is shown.

{*besps_c}1|pic01.png||myText{/besps_c*} - without the asterisks
pic01.png of the second slideshow in the content item has no caption but the text "myText"

{*besps_c}0|pic02.png||{/besps_c*} -without the asterisks
pic02.png in the first slideshow shows no caption and no text although there is a default. The explicit setting overrides it.

{*besps_c}0|pic05.jpg|myTitelA|myTextA{/besps_c*} - without the asterisks
{*besps_c}0|pic06.jpg|myTitelB|myTextB{/besps_c*} - without the asterisks
{*besps_c}0|pic07.jpg|myTitelC|myTextC{/besps_c*} - without the asterisks
{*besps_c}0|pic08.jpg|myTitelD|myTextD{/besps_c*} - without the asterisks . . . and so on

Notice:
It is of no importance where within your content item and in which order your setting are.
The number of parameters has always to be 4. This means, a call always must contain 3 vertical bars, even if a setting is empty (e.g. the imagefile).
These vertical bars are protected characters within the calls and may not be used within your values.
Even when deactivated, Captions can be used to replace the (otherwise used by default) image filename as ALT-, TITLE-text.




D.) Links

If we want to link the images of our slideshow, there is a third call to do so:

{*besps_l}slideshow-number|imagefile|URL|titel|target{/besps_l*} - without the asterisks

Slideshow-number:
The slideshow within one content item are numbered starting with 0.
This setting is obligatory.

Imagefile:
The name of the file "myimage.jpg".
Left empty, the call is used as default for the whole slideshow. This means, if there is no setting for an image, this one is used. The file name and suffix are caseINsensitive.

URL:
The URL you want to link the image with. e.g.: http://www.bretteleben.de

Titel:
The titel, shown when the mouse is over the image. e.g.: bretteleben.de

target:
The window, you want to open the linked URL. e.g.: _blank (new window), _self (same window)

Samples:

{*besps_l}0||http://www.bretteleben.de|bretteleben.de|_blank{/besps_l*} - without the asterisks
This call sets a default link for the first slideshow within the current content item by leaving the value for the imagefile empty. The link opens in a new window.

{*besps_l}1|pic01.png|http://www.disney.com|Disney|_self{/besps_l*} - without the asterisks
pic01.png in the second slideshow within the content item is linked to www.disney.com. The link opens in the current window.

{*besps_l}0|pic02.png|||{/besps_l*} -without the asterisks
We don´t want pic02.png in the first slideshow within the content item to be linked. A special case, because as soon as we have links within a slideshow, every image gets linked. Setting this empty call the image is linked to the current page, without any further setting.

{*besps_l}0|pica.jpg|http://www.my.domain.com/myGreatProduct1|greatProduct1|_self{/besps_l*} - without the asterisks
{*besps_l}0|picb.jpg|http://www.my.domain.com/myGreatProduct2|greatProduct2|_self{/besps_l*} - without the asterisks
{*besps_l}0|picc.jpg|http://www.my.domain.com/myGreatProduct3|greatProduct3|_self{/besps_l*} - without the asterisks
{*besps_l}0|picd.jpg|http://www.my.domain.com/myGreatProduct4|greatProduct4|_self{/besps_l*} - without the asterisks ... and so on

Notice:
It is of no importance where within your content item and in which order your setting are.
The number of parameters has always to be 5. This means, a call always must contain 4 vertical bars, even if a setting is empty (e.g. the imagefile).
These vertical bars are protected characters within the calls and may not be used within your values.




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 extensions.joomla.org.

Last Updated on Wednesday, 12 January 2011 15:06
 
Comments (38)
Slideshow with Captions
8 Friday, 06 May 2011 13:06
Joomlamerica

I can get the slideshow to work without captions, but with captions just shows me the code. I am trying to pull in photos from the same subfolder, generically numbered 1.jpg, 2.jpg, etc.  So I have the code as

{*besps_c}0|kymri/mothers/1.jpg|Peru|A Peruvian mother teaches her daughter the traditional skill of weaving as a means of supporting both family and culture.{/besps_c*}
{*besps_c}1|kymri/mothers/2.jpg|China|A young mother sits with her only child, a daughter, on her rural farm in Yichang, China.{/besps_c*}
[...]
{*besps_c}10|kymri/mothers/9b.jpg|USA|An American mother teaches her daughter how to surf in the Pacific waters of San Diego, California.{/besps_c*}

No matter how I do this, I can't get the slideshow to display with captions and titles.

Add Class to links
7 Saturday, 30 April 2011 18:55
Dylan

Am I able to add a class to the links on the slideshow? I want to use the use the following : rel="lightbox" and class="jcepopup"

Please advise

@Dylan
Sunday, 01 May 2011 20:57
A. Berger

Hi Dylan!

It is of course possible to patch the plugin. Check the file /plugins/content/besps.php, line 320.

Best regards
Andreas

Captions not working.
6 Friday, 29 April 2011 04:47
Chris

Hi.

This is a fantastic plugin, I am just having some difficulty using the captions. The site uses Joomla 1.5.15 (thefitzwilliamgallery.com).

Here is the code I am using:
{*besps}slideshow{/besps*}
{*besps_c}0|1.jpg|title1|myTextA{/besps_c*}
{*besps_c}0|2.jpg|title2|myTextA{/besps_c*}
{*besps_c}0|3.jpg|title1|myTextA{/besps_c*}
{*besps_c}0|4.jpg|title2|myTextA{/besps_c*}
{*besps_c}0|5.jpg|title1|myTextA{/besps_c*}
{*besps_c}0|6.jpg|title2|myTextA{/besps_c*}
{*besps_c}0|7.jpg|title1|myTextA{/besps_c*}

What I really want to do is get rid of the file name on mouseover. Thanks in advance for any help.

@Chris
Saturday, 30 April 2011 11:58
A. Berger

Hi Chris!

The code you posted looks fine and if it is the first slideshow in the article (first parameter is set to "0") and the image file names correspond to the image file names set in the second parameter it should show the captions.
Anyway, to get rid of the image file names as tooltips, in the current version just add the code for an empty default caption:
{*besps_c}0|||{/besps_c*} ... without the asterisks
The next update of this plugin will come with a backend switch to do this (I just integrated this option into the "Very Simple Image Gallery" where it is working fine).

In addition, I invite you to submit this site as a showcase for the plugin:
http://www.bretteleben.de/lang-en/joomla/simple-picture-slideshow/-showcase.html

Best regards
Andreas


Is there a way to work your awesome plugin into a module?
5 Wednesday, 27 April 2011 16:12
Tamara Garza

I'd love to feature this as a site banner graphic / slideshow - but in doing so, need to work it into a module.. is there a clever workaround (that I am obviously unable to figure out) to make this happen? Or is there a reason perhaps why I WOULDN't want to do that?

Thanks in advance for your help!

@Tamara Garza
Wednesday, 27 April 2011 20:29
A. Berger

Hi Tamara!

If you want to show the slideshow at a module position, you could use a module for custom content, or a module to embed articles in modules. Anywhere, there are limitations.
First, not all of these extensions allow the plugin (or content plugins at all) to work. The page FAQ&Troubleshooting lists two extensions (there may be more - if you find one, please let me know) that allow the plugin to be used at module positions.
Secondly, please be aware that - even if the plugin works this way - the fact that a module is not an article - up till now (till the next version is out) causes problems if you are going to use multiple instances of the plugin on one page because the plugin will not be able to write unique identifiers for JavaScript and CSS. If you need multiple instances on one page, I would indeed use a slideshow, explicitly developed as a module.

Best regards
Andreas

A little question
4 Tuesday, 19 April 2011 19:49
Seb

Hello,

Could you tell me if it is possible to have text and an active hyperlink below the image in caption? Indeed I wish to make a slideshow with images from differents photographers and thus put an active link to their site in caption.

Thank you for your reply.

Bests Regards.
Seb

PS : I'm using joomla version 1.5 ;o) and sorry for my english ...

@Seb
Tuesday, 19 April 2011 21:05
A. Berger

Hi Seb!

Yes, don't format the title line (it is used for ALT and TITLE of the image) but formatting the text line (the second part of the captions) using your WYSIWYG-editor is possible (not because of my coding capabilities but because I didn't manage to break it up till now :)) and you can even add links to this part of the captions. What you shouldn't use are paragraphs (P) because they break the JavaScript and you should always make sure that the HTML-tags you insert don't overlap the code and stay within the text line.

Best regards
Andreas

Thanks
3 Friday, 15 April 2011 12:32
Alex

Cheers, just what I was after, simple to use, simple to implement and works as needed.

Thanks again.
Alex

Question
2 Wednesday, 13 April 2011 12:35
Stashiq

Hi, great job!

Is there a possibility to let width and height to be in percent. and: Is there a possibility to let height be set automaticaly after a width was set?

Thanks a lot!

@Stashiq
Friday, 15 April 2011 18:06
A. Berger

Hi Stashiq!

I confess I haven't even thought about such a feature but I'm pretty sure it would be possible to patch the plugin and integrate such JavaScript driven width/height-adjustment. In addition, the plugin is licensed under the GPL, therefore it is absolutely within the scope of the license if you modify it to fit your needs.

Best regards
Andreas

width/height
Friday, 15 April 2011 17:42
Stashiq

hi again,

is there a possibility to let change/override the width by screen resolution?

Thanks!

@Stashiq
Wednesday, 13 April 2011 21:35
A. Berger

Hi Stashiq!

I'm sorry but the answer to both of your questions is no, it is not possible. Maybe you want to check extensions.joomla.org to see, if another extension meets your requirements.

Best regards
Andreas

Caption Font
1 Monday, 11 April 2011 03:04
RPL

Is there a way to change the caption font size and type?

@RPL
Monday, 11 April 2011 20:08
A. Berger

Hi RPL!

You can change the appearance of the captions in the stylesheet of the plugin: /plugin/content/plugin_besps/besps.css

.besps_caps {} ... captions in general
.besps_caps div.bs_inside {} ... captions, placed over the main image
.besps_caps div.bs_outside {} ... captions, placed below the main image
.besps_slides div a, .besps_slides div a:link, .besps_slides div a:visited, .besps_slides div a:focus, .besps_slides div a:hover, .besps_slides div a:active {} ... appearance of title and text line if feature links is activated
.besps_caps div span {} ... appearance of the title line
.besps_caps div span + span {} ... appearance of the text line

Best regards
Andreas

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
English
Panoramic Image Viewer
Follow me on Facebook
Follow me on Google+

bretteleben.de

Add to circles

Who's Online
We have 83 guests online