Startseite Joomla Simple Picture Slideshow - Anleitung Plugin Code
Simple Picture Slideshow Plugin Verwendung - Code
Geschrieben von: Andreas Berger   
Sonntag, den 12. Juli 2009 um 18:03 Uhr

Übersicht über die Möglichkeiten des Aufrufs direkt aus dem Artikel.

Das "Simple Picture Slideshow" Plugin wird aus dem jeweiligen Artikel aufgerufen. Dabei gibt es - neben der Wahl des Ordners, in dem die Bilder liegen - weitere Möglichkeiten, die Slideshow aufzuwerten oder zu gestalten.

 

A.) Die Slideshow selbst

Der Code besteht aus dem Aufruf selbst {*besps}{/besps*} (ohne die Sterne) und enthält den Namen des Ordners, in dem wir gerade die Bilder abgelegt haben. Der eingestellte Pfad zum Ordner (imageroot), also per Default "/images/stories/" wird vom Plugin automatisch ergänzt und ist nicht mit anzugeben.

Ein Aufruf sieht also zum Beispiel so aus

{*besps}simpleslideshow{/besps*} - ohne die Sterne


Um einen Ordner in einem Unterordner zu verwenden, wird sinngemäß der Pfad unterhalb des eingestellten Hauptordners (per default "/images/stories/") angegeben, also zum Beispiel für den Ordner "/images/stories/ordner/unterordner":

{*besps}ordner/unterordner{/besps*} - ohne die Sterne

An sich war es das und die Slideshow ist einsatzfertig.




B.) Parameter Overrides

Beginnend mit Version 1.3 bietet die "Simple Picture Slideshow" die Möglichkeit, alle im Konfigurationspanel des Plugins gesetzten Werte direkt im Aufruf zu überschreiben. Damit können verschiedenst gestaltete Slideshows erstellt werden.
Dazu wird der Aufruf des Plugins um die benötigten Parameter erweitert. Diese folgen dem Ordnernamen, von diesem und untereinander jeweils getrennt durch einen vertikalen Trennstrich und haben das Format PARAMETER=WERT:

Übersicht über die möglichen Parameter:

width - Breite der Slideshow in Pixel (ganze Zahl) z.B.: 400

height - Höhe der Slideshow in Pixel (ganze Zahl) z.B.: 300

align - Ausrichtung der Slideshow im Artikel; mögliche Werte: 0 (rechts), 1 (mitte), 2 (links), 3 (float left), 4 (float right)

bgcol - Hintergrundfarbe der Slideshow als hexadezimaler Wert (ohne einleitende Raute) z.B.: ffffff

sdur
- Zeit die die einzelnen Bilder angezeigt werden in Sekunden (ganze Zahl) z.B.: 3

fdur - Dauer des Überblendens zwischen zwei Bildern in Sekunden (ganze Zahl) z.B.: 1

steps - Anzahl der Schritte beim Überblenden als Wert von 1 - 100 (ganze Zahl) z.B.: 50

auto - automatisch Starten beim Laden der Seite; mögliche Werte: 0 (nein), 1 (ja)

sort - Sortierung der Bilder; mögliche Werte: 0 (A-Z - DEFAULT), 1 (Z-A), 2 (alt-neu), 3 (neu-alt), 4 (zufällig)

setid - Name des Ordner als Identity des obersten DIV-containers; mögliche Werte: 0 (nein), 1 (ja)

ctrls - Kontrollelemente anzeigen; mögliche Werte: 0 (nein), 1 (ja)

csort - Anordnung der Kontrollelemente; beliebige Kombination aus den mögliche Werten:
1 (Counter), 2 (Start), 3 (Stop), 4 (rückwärts), 5 (vorwärts), - (Trennung links rechts)
z.B.: 1-2345 (Erläuterungen siehe Plugin Howto)

cstart - Wert für das Kontrollelement "Start"; mögliche Werte: leer (Standardbutton); beliebiger Text; Dateiname eines Buttons (siehe Plugin Howto)

cstop - Wert für das Kontrollelement "Stop"; mögliche Werte: leer (Standardbutton); beliebiger Text; Dateiname eines Buttons (siehe Plugin Howto)

cfwd - Wert für das Kontrollelement "Vor"; mögliche Werte: leer (Standardbutton); beliebiger Text; Dateiname eines Buttons (siehe Plugin Howto)

cbwd - Wert für das Kontrollelement "Zurück"; mögliche Werte: leer (Standardbutton); beliebiger Text; Dateiname eines Buttons (siehe Plugin Howto)

prld - Bilder nachladen (ganze Zahl von 3 - "Bilder in der Slideshow") z.B.: 5; Erläuterung siehe Plugin Howto

caps - Captions anzeigen; mögliche Werte: 0 (nein), 1 (ja)

inout - Position der Captions; mögliche Werte: 0 (unter dem Hauptbild), 1 (überblendet über das Hauptbild)

links - Links anzeigen; mögliche Werte: 0 (nein), 1 (ja)


Beispiele:

{*besps}slideshow|width=600|height=450{/besps*} - ohne die Sterne
Ungeachtet der Voreinstellungen wird diese Slideshow mit einer Breite von 600 Pixel (width=600) und einer Höhe von 450 Pixel (height=450) angezeigt.

{*besps}slideshow|ctrls=0|caps=0|links=0|auto=1{/besps*} - ohne die Sterne
Keine Kontrollelemente, keine Captions, keine Links, die Sldieshow startet automatisch.

Hinweise:

Die Parameter entsprechen den Parametern im Konfigurationspanel des Plugins und sind auf der Seite Anleitung Plugin ausführlich erläutert.
Der erste Parameter innerhalb eines Aufrufs ist immer der Ordner mit den Bildern. Danach ist die Reihenfolge, in der die Overrides angegeben werden frei wählbar.


C.) Captions

Überschriften und Texte werden mit einem eigenen Aufruf angegeben. Dieser lautet:

{*besps_c}Slideshownummer|Bilddatei|Titel|Text{/besps_c*} - ohne die Sterne


Slideshownummer:
Die Slideshows innerhalb eines Beitrages werden von 0 beginnend durchnummeriert.
Diese Eingabe ist unbedingt erforderlich

Bilddatei:
Der Name der Datei "meinbild.jpg".
Wird hier nichts eingegeben, dann wird der Aufruf als Default-Wert für die Slideshow verwendet. Das bedeutet, er wird bei allen Bildern angezeigt, für die keine eigene Eingabe vorhanden ist. Dateiname und Suffix sind CaseInsensitiv.

Titel:
Die Überschrift. Wird hier nichts eingegeben . . . dann wird keine Überschrift angezeigt.

Text:
Der Text unterhalb der Überschrift. Wird hier nichts eingegeben . . . dann wird kein Text angezeigt.

Beispiele:

{*besps_c}0||meinTitel|meinText{/besps_c*} - ohne die Sterne
Dieser Aufruf legt für die erste Slideshow im Beitrag den Standardtitel "meinTitel" und den Stadardtext "meinText" fest, indem kein Bild angegeben wird. Hinweis: natürlich muss man keinen Stadardtext festlegen. Findet das Plugin für ein Bild keine Angabe, dann wird eben nichts angezeigt.

{*besps_c}1|bild01.png||meinText{/besps_c*} - ohne die Sterne
Bei bild01.png in der zweiten Slideshow im Beitrag wird keine Überschrift und als Text "meinText" angezeigt.

{*besps_c}0|bild02.png||{/besps_c*} - ohne die Sterne
Bei bild02.png in der ersten Slideshow im Beitrag wird nichts angezeigt (Auch nicht der weiter oben festgelegte Standardtext/-titel.)

{*besps_c}0|bilda.jpg|meinTitelA|meinTextA{/besps_c*} - ohne die Sterne
{*besps_c}0|bildb.jpg|meinTitelB|meinTextB{/besps_c*} - ohne die Sterne
{*besps_c}0|bildc.jpg|meinTitelC|meinTextC{/besps_c*} - ohne die Sterne
{*besps_c}0|bildd.jpg|meinTitelD|meinTextD{/besps_c*} - ohne die Sterne ... ich glaube, das Prinzip ist klar

Hinweise:
Wo im Beitrag und in welcher Reihenfolge diese Angaben gemacht werden ist ohne Belang.
Die Anzahl der Parameter in einem Aufruf muss immer 4 sein. Das bedeutet, es müssen immer 3 vertikale Trennstriche (broken vertikal bar) angegeben sein, auch wenn zum Beispiel kein Text angegeben wird, der Trennstrich nach dem Titel muss vorhanden sein!
Diese Trenner sind hier geschützte Zeichen und dürfen im Text der Eingaben nicht verwendet werden.
Sind Captions im Konfigurationspanel des Plugins deaktiviert, dann können sie trotzdem verwendet werden um mit dem Titel den (ansonsten automatisch eingefügten) Dateinamen als ALT- und TITLE-Tag zu ersetzen.


D.) Links

Möchten wir die Bilder der Slideshow verlinken, dann kommt zusätzlich noch eine dritte Form des Aufrufs zum Einsatz:

{*besps_l}Slideshownummer|Bilddatei|Verweisziel|Titel|target{/besps_l*} - ohne die Sterne


Slideshownummer:
Die Slideshows innerhalb eines Beitrages werden von 0 beginnend durchnummeriert.
Diese Eingabe ist unbedingt erforderlich

Bilddatei:
Der Name der Datei "meinbild.jpg".
Wird hier nichts eingegeben, dann wird der Aufruf als Default-Wert für die Slideshow verwendet. Das bedeutet, er wird für alle Bilder verwendet, für die keine eigene Eingabe vorhanden ist. . Dateiname und Suffix sind CaseInsensitiv.

Verweisziel:
Die URL zu der verlinkt werden soll. Z.B.: http://www.bretteleben.de

Titel:
Der Text, der beim Überfahren des Bildes für den Link angezeigt werden soll. z.B.: bretteleben.de

target:
Das Fenster, in dem das Verweisziel geöffnet werden soll. z.B.: _blank (neues Fenster), _self (selbes Fenster)

Beispiele:

{*besps_l}0||http://www.bretteleben.de|bretteleben.de|_blank{/besps_l*} - ohne die Sterne
Dieser Aufruf legt durch den leeren Bildnamen für die erste Slideshow im Beitrag den Standardlink www.bretteleben.de mit dem Text bretteleben.de fest, geöffnet wird der Link in einem neuen Fenster.

{*besps_l}1|bild01.png|http://www.disney.com|Disney|_self{/besps_l*} - ohne die Sterne
bild01.png in der zweiten Slideshow wird mit www.disney.com verlinkt, der Link öffnet im selben Fenster.

{*besps_l}0|bild02.png|||{/besps_l*} - ohne die Sterne
bild02.png in der ersten Slideshow im Beitrag soll nicht verlinkt werden. Ein Sonderfall, denn wenn man Links aktiviert hat, dann werden alle Bilder der Slideshow verlinkt. bild02.png wird in diesem Fall einen leeren Verweis haben und auf die selbe Seite verlinken.

{*besps_l}0|bilda.jpg|http://www.meine.domain.com/meinTollesProdukt1|tollesProdukt1|_self{/besps_l*} - ohne die Sterne
{*besps_l}0|bildb.jpg|http://www.meine.domain.com/meinTollesProdukt2|tollesProdukt2|_self{/besps_l*} - ohne die Sterne
{*besps_l}0|bildc.jpg|http://www.meine.domain.com/meinTollesProdukt3|tollesProdukt3|_self{/besps_l*} - ohne die Sterne
{*besps_l}0|bildd.jpg|http://www.meine.domain.com/meinTollesProdukt4|tollesProdukt4|_self{/besps_l*} - ohne die Sterne ... usw.

Hinweise:
Wo im Beitrag und in welcher Reihenfolge diese Angaben gemacht werden ist ohne Belang.
Die Anzahl der Parameter in einem Aufruf muss immer 5 sein. Das bedeutet, es müssen immer 4 vertikale Trennstriche (broken vertikal bar) angegeben sein, auch wenn eine Angabe (zum Beispiel der Name der Bilddatei) leer bleibt!
Diese Trenner sind hier geschützte Zeichen und dürfen im Text der Eingaben nicht verwendet werden.




Für Fragen und Anregungen steht die Kommentarfunktion zur Verfügung. Bitte geben Sie bei Ihrer Frage die verwendete Joomla! Version an und posten Sie bei Problemen - soweit möglich - einen Link zur betroffenen Seite.

Wer für sein Projekt zusätzliche Funktionen oder Adaptierungen über die Möglichkeiten des hier gebotenen Supports benötigt, der ist eingeladen, mich mit einer Beschreibung der gewünschten Leistungen und dem angedachten Budget per Email zu kontaktieren (Menüpunkt "Kontakt" im Topmenü).

Wer die Erweiterung nutzt den bitte ich, sie auf extensions.joomla.org zu bewerten und einen Erfahrungsbericht zu posten.

Zuletzt aktualisiert am Mittwoch, den 12. Januar 2011 um 15:06 Uhr
 
Kommentare (147)
3. Bildunterschrift wird nicht angezeigt
147 Montag, den 19. Dezember 2011 um 09:16 Uhr
stroberry

Hallo Andreas, tolles Plugin, habe ich schon mehrmals verwendet.

Mein Problem: ich hatte erst zwei Bilder mit Bildunterschift, habe ein drittes hinzugefügt, aber diese dritte Bildunterschrift wird nicht angezeigt.

Code:
{*besps}galerie{/besps}
{*besps_c}0|bild01.png|Neue Nazarethkirche am Leopoldplatz|{/besps_c*}
{*besps_c}0|bild02.png|Alte Nazarethkirche am Leopoldplatz|{/besps_c*}
{*besps_c}0|bild03.png|Nauener Tor in Potsdam|{/besps_c*}

Link: www.ra-fkz.de

Hab ich irgendwo eine Einstellung übersehen?

Danke
stroberry

Das war ja einfach ...
Donnerstag, den 05. Januar 2012 um 12:13 Uhr
stroberry

Vielen Dank, was man manchmal so übersieht vom zu vielen Gucken ...

Tolles Plugin, toller Support, danke.

@stroberry
Montag, den 19. Dezember 2011 um 21:30 Uhr
A. Berger

Hallo stroberry!

Du hast kein Bild "bild03.png", Du hast allerdings ein Bild "bild 03.png". Versuchs mal mit dem. :)

Gruß
Andreas

Text file for Captions?
146 Donnerstag, den 01. Dezember 2011 um 20:24 Uhr
Daniel

Hi . . . if the captions are placed in a text file in the image folder how are they formatted in the text file? Am I using the bracketed code {*besp}{/besp*} you mentioned? That is plugin code so I am not sure I need to add it like that in a text file. Let me know your opinion.

thanks,
Daniel

Adding Cations
145 Donnerstag, den 01. Dezember 2011 um 19:43 Uhr
Daniel

Just need to understand . . . are the captions placed in a text file, like captions.txt, and dropped in the same folder as the images?

thanks

@Daniel
Donnerstag, den 01. Dezember 2011 um 23:03 Uhr
A. Berger

Hi Daniel!

Check the section "C.) Captions" above:
Captions are set using additional line of code within the article.

sample:
{*besps}whateverfolder{/besps*} ... call the slideshow
{*besps_c}0||default title|default text{/besps_c*} ... set a default caption (title/text) for all images


another sample:
{*besps}whatelsefolder{/besps*} ... call another slideshow
{*besps_c}0|pic01.jpg|title for pic01|text for pic01{/besps_c*} ... set title/text for pic01.jpg
{*besps_c}0|pic02.jpg|title only for pic02|{/besps_c*} ... set a title only for pic02.jpg
{*besps_c}0|pic03.jpg||text only for pic03{/besps_c*} ... set a text only for pic03.jpg
{*besps_c}0||default title|default text{/besps_c*} ... set a default title/text for all the rest

Best regards
Andreas

doesn't change automatically
144 Montag, den 28. November 2011 um 17:47 Uhr
Dario

Hi! the image doesn't change automatically but only when I reloading my browser. How can I do it?

Please, can you write step by step how can I do it?

Thank you

@Dario
Mittwoch, den 14. Dezember 2011 um 20:00 Uhr
A. Berger

Hi Dario!

First, temporarily switch to another template (preferably to a default Joomla! template) and check if this solves the problem. If it does, let me know which template you are using and where to download it.

If this does not solve the problem and you have absolutely no idea which one of the other installed extensions could possibly deal with JavaScripts in the head of the site, disable them one by one and check the page after every step (make sure that the cache is disabled!). As soon as you detected the extension that causes the problem - let me know.

Best regards
Andreas

how can I fix it
Mittwoch, den 14. Dezember 2011 um 16:27 Uhr
Dario

Ok! I understand that there is an error, but how can I fix it? What should I editin index.php? Could you explain the steps to do step by step. thank you very much.

@Dario
Mittwoch, den 30. November 2011 um 21:59 Uhr
A. Berger

Hi Dario!

Either your template (check the index.php) or a third party extension prevents the JavaScript files "caption.js" and "mootools.js" from getting loaded. This is done to speed up the site. It's a nice idea but the extension you are using or the snippet in the index.php does not only prevent those two scripts from getting loaded but also the JavaScript needed by the slideshow too (/plugins/content/plugin_besps/besps.js). Modify the extension/snippet to allow the JavaScript besps.js to get linked from the head of the page (done by the plugin automatically - if it is allowed to) and the slideshow will work fine.

Best regards
Andreas

DOESN'T CHANGE AUTOMATICALLY
Mittwoch, den 30. November 2011 um 08:18 Uhr
Dario

Hi! Andreas.

Ok the link is: www.italcoel.com/it/servizi/telepoint.html
Go to the bottom page.

Thank you so much!

@Dario
Montag, den 28. November 2011 um 20:12 Uhr
A. Berger

Hi Dario!

Sounds like either an extension (or a snippet in the index.php of your template) prevents the JavaScript /plugins/content/plugin_besps/besps.js from getting linked from the page head or another JavaScript causes a failure.
If you could post a link to the page, I will have a look at it.

Best regards
Andreas

Align Caps with CTRL IMG
143 Samstag, den 26. November 2011 um 09:18 Uhr
Marc

Link: www.claudiahofmair.de/index.php/architektur

Dear Andreas, I have been fighting with pushing the arrows down a little and levelling the CAPS to be in line with the arrows. Where can I do that?

Thanks and best regards, Marc

@Marc
Sonntag, den 27. November 2011 um 11:29 Uhr
A. Berger

Hi Marc!

The stylesheet of the plugin is /plugins/content/simplepictureslideshow/files/besps.css. The selectors with "ctrl(s)" in the name handle the controls, the selectors with "caps" in the name handle the captions.

Best regards
Andreas

Fließtext drumherum?
142 Mittwoch, den 02. November 2011 um 12:24 Uhr
Sascha

Danke für das super Plugin,

es zählt zu meinen "must haves" :)
Gibt es eine Einstellung/Parameter mit dem man die Slideshow mitten im Textblock platzieren kann und der Text dann je nach Platzierung der Slideshow rechts, links oder beidseitig herumläuft?

Viele Grüße & Danke,
Sascha

@Sascha
Mittwoch, den 02. November 2011 um 21:15 Uhr
A. Berger

Hallo Sascha!

Mittig bzw. beidseitig umflossen geht nicht, aber für links oder rechts umflossen sind die Alignements "float-left" und "float-right" vorgesehen.

Gruß
Andreas

transparent background possible?
141 Montag, den 24. Oktober 2011 um 12:21 Uhr
Dick

Hi,

I like the plugin, but I've modified my site from Joomla 1.6 to 1.7. My old template wasn't working and found a nice new one. This has not a white background but some kind of grey (from a jpg, so it's not a solid grey color). Is it possible to have in besps a transparent background? So that the original background is being used and not a solid color? I'm still in the process of finding the best one matching to my site.

Thanx in advance.

@Dick
Montag, den 24. Oktober 2011 um 20:38 Uhr
A. Berger

Hi Dick!

Yes and No :)
Yes, it is possible, just set the background color to "#transparent" and you will get a transparent background because this setting gets misinterpreted by the browser.
No, because a transparent background has the unwanted side-effect that the next image in the row gets visible (100%) to early if you are using images of different size (and I suppose you do, because otherwise a transparent background wouldn't make any sense).

Best regards
Andreas

Link to specific slide number
140 Mittwoch, den 19. Oktober 2011 um 21:03 Uhr
Ragout

Hey,

I was wondering if it was possible to start the slideshow for example at number 3 using an anchor link.
Currently i have a page with some images, clicking these images will open a page with besps. Now it will always open at the first image. What I want is that when I click my third image the besps will also start at the third image.

Is this possible with besps or can I change something so this will work?

Thanks,
Ragout

@Ragout
Donnerstag, den 20. Oktober 2011 um 19:13 Uhr
A. Berger

Hi Ragout!

I'm sorry, but this is not possible without heavily rewriting the plugin.

Best regards
Andreas

problem with "Plugin in Module"
139 Donnerstag, den 13. Oktober 2011 um 18:08 Uhr
nils

I’m using your great plugin and I really love it!

I have a small problem and I wanted to see if you could help me: I’m using the "Simple Picture Slideshow" Plugin inside a module and since I have a bilingual website, I’m using the Additional Parameters option to show 2 different slideshows in each language. I enter in the Additional Parameters this code: {*besps}English-folder{/besps*}, I know it’s wrong, but that’s the only way I can make it work.
The problem is that the code types in "Plugin in Module" are working a bit differently than the one you have and so if I just enter the name of the folder I don't see a thing and if I write the whole code in there, I get this:

{*besps
then the slideshow content
}{/besps*}

Do you have an idea how I can make it work without getting the extra code?
I really appreciate your help!

nils

@nils
Mittwoch, den 26. Oktober 2011 um 18:23 Uhr
A. Berger

Hi Nils!

How do you realize your multi-language website? Are you using Joom!Fish? If so, use the default parameters of the module to execute the plugin and change the folder name within the Joom!Fish translation.

Best regards
Andreas

Deviation function
138 Samstag, den 18. Juni 2011 um 15:13 Uhr
Cat

Dear, great plugin, very easy to use and to install. Explanations are clear, thanks.

One question for you: how do I add a "deviation" function?
If I do understand correctly "deviation" is when I have some small and some big pictures and I would like them to appear all alligned with the title for example (and not centered).

Thanks & BR,
Cat

@Cat
Sonntag, den 26. Juni 2011 um 18:11 Uhr
A. Berger

Hi Cat!

Sorry for the late response!

About your question: To align all images left instead of centered you have to modify the plugin. Open the file /plugins/content/besps.php (goes for Joomla!1.5) and change line 300

from: $besp_xdelta=intval(($bs_width_-$besp_showwidth)/2);
to: $besp_xdelta=0;

Best regards
Andreas

Deutsch
Panoramic Image Viewer
Follow me on Google+

bretteleben.de

Add to circles

Wer ist online
Wir haben 45 Gäste online