PicShow_XH - ein CMSimple_XH (ab Version 1.7) Plugin

Bauklötze

PicShow_XH ermöglicht die Anzeige aller Bilder in einem angegeben Ordner als Diashow. Diese Diashows erlauben keinerlei Interaktion durch den Benutzer.Mehrere Diashows mit unterschiedlichen Effekten und Zeitabläufen sind möglich.PicShow_XH ist rein CSS (Javascript oder JQuery wird nicht benötigt)





Bitte lesen Sie diese Dokumentation bevor Probleme auftreten!

Voraussetzungen

PicShow_XH ist ein Plugin für CMSimple_XH ≥ 1.6. Es benötigt PHP ≥ 5.2.0.

zum Seitenanfang

Installation

  1. Sichern Sie die Daten auf Ihrem Server.
  2. Entpacken Sie die ZIP-Datei auf Ihrem Rechner.
  3. Laden Sie das ganze Verzeichnis picshow/ auf Ihren Server in CMSimple_XHs Plugin-Verzeichnis hoch.
  4. Machen Sie die Unterverzeichnisse config/ und languages/ beschreibbar.
  5. Gehen Sie zu "PicShow" im Administrationsbereich, um zu prüfen, ob alle Voraussetzungen erfüllt sind.
zum Seitenanfang

Einstellungen

Sie können das komplette Stylesheet für Ihren Parrallax-Hintergrund komplett im Adminbereich einarbeiten. Weitere Eistellungen sind in den Tooltips erklärt!

back to top

Verwendung

Um eine Diashow auf allen Seiten anzuzeigen, fügen sie ins Template ein:

<?php echo picshow('%ORDNER%','(optional = Slide-Direction)'
,(optional = feste Höhe)');?>

Um eine Diashow auf einer einzelnen Seite oder in einer Newsbox anzuzeigen, geben auf der Seite ein:

{{{picshow('%ORDNER%');}}}
%ORDNER%
Der Pfad eines Ordners relativ zu CMSimple_XHs Bilderordner. Alle JPEG, PNG und GIF Bilder in diesem Ordner werden für die Diashow verwendet; es müssen sich mindestens zwei Bilder in diesem Ordner befinden.
(optional = Slide-Direction)
Es stehen 5 Parameter zur Verfügung
fade,top,bottom,right,left
Wird keine Parameter angegeben, gelten die globalen Einstellungen im Plugin-Menue
(optional = feste Höhe)
Die Höhe des Containers wird immer vom höchsten Bild berechnet. Bilder werden formfüllend platziert.
Feste Höhe - stellt den Container fix ein.
Die Eingabe der Höhe kann durch einen festen Wert oder durch Höhe/Breite kalkuliert werden. (z.Bsp. 100% oder 450px oder calc(100vw * 9/16) oder calc(100vw * 4,5/16) oder calc(100vw * 450/1600))

Beispiele

Zum Anzeigen der Bilder in userfiles/images/banner/ mit den Voreinstellungen auf jeder Seite:

<?php echo picshow('banner');?>

Zum Anzeigen der Bilder einer Seite oder Newsbox:

{{{picshow('banner','fade');}}}

Bildeffekt-Slider

css slider custom effects

Ganz Ohne ein kleines Javascript kommt dieser Slider nicht aus, da man diesen Effekt-Slider auch mit Radio-Buttons steuern kann. Dafür gibt es ein weiteren Parameter den wir integriert haben, zu den oben genanten 5 Effekten kommen "effects-3","effects-4","effects-5","effects-9",,"effects-r" hinzu. ("effects-r" - ist die Option für Zufallseffekt)

Genau für diese 5 Effektparameter, kann man bestimmen, ob die Radio-Buttons angezeigt werden sollen oder nicht. Ist dieser 4. Parameter auf "true" gesetzt (also die Radio-Buttons werden angezeigt) stopt automatisch die Animation wenn man daruber fährt, egal ob in den globalen Einstellungen der Hacken bei stop Animation gesetzt ist oder nicht! Die automatische Animation beginnt dann, wenn man den Bereich verässt.

{{{picshow("picshow/show2","effects-4","0.21",true);}}}

Slick-Slider

css slider custom effects

Auch PickShow Slick-Version ist in rein css umgesetzt. Bilder einfach in ein Verzeichnis einfügen und den Pfad angeben. Am Besten ist es die Bilder alle von den Abmessungen gleich zu halten. Der 2. Parameter "slick" refrenziert diesen Slider. Der 3. Parameter kann in px oder für dynamische Größenänderung mit calc angegeben werden, um die Höhe des slicksliders an zu passen! Wird er weggelassen, ist der Referenzwert das höchste Bild und wird im Verhältnis zur Breite des Browsers eingefügt wie "calc(100vw * 1)" was wenig Sinn macht.
Mit der Kalkulationsmethode "calc" werden die Bilder, bei Veränderung der Browserbreite dynamisch mit angepasst.

{{{picshow("picshow/partner","slick","calc(100vw * 0.163)");}}}
oder 
{{{picshow("picshow/partner","slick","150px");}}}
zum Seitenanfang

Lizenz

PicShow_XH kann unter Einhaltung der GPLv3 verwendet werden.

© 2022 Ingo Sell (knollsen)

back to top

Danksagung

Das Plugin wurde von Ingo Sell entworfen. Vielen Dank für die Veröffentlichung als Freeware.

Vielen Dank an Sascha Schroeter (SiNiTaSa) im CMSimple_XH-Forum für Tipps, viele Anregungen und das Testen.

Vielen Dank an Dr. Martin Sereday (Tata) im CMSimple_XH-Forum für für slowakische und englische Übersetzungen.

back to top