Heute wollen wir mal eine kleine WordPress-Erweiterung Beckspaced Supersized vorstellen, welche wir kürzlich für eine Kundenwebseite entwickelt haben.
Es dreht sich hierbei um das jQuery Plugin Supersized, mit welchem man Hintergrundbilder in einer Art Vollbild-Modus in eine Webseite integrieren kann. Wie das ganze aussieht, kann man sich hier bei unserer Kunden Webseite MaiPenRai Bungalows Koh Phangan gleich mal anschauen.
Tatsächlich gibt es ja schon ein WordPress Plugin namens WP Supersized, welches wir auch anfänglich genutzt haben. Diese WordPress Erweiterung kann neben WordPress interner Bildergalerie auch Bilder aus der NextGen Bildergalerie, Flickr, Picasa, Smugmug, lokalen Ordner oder einer XML Datei nutzen.
Wie man leicht erkennen kann bietet WP Supersized allerhand Funktionalität, dennoch hat es einen entscheidenden Nachteil. Selbst wenn manche Funktionalität des Plugins nicht genutzt wird, so läd das Plugin dennoch überflüssige Javascript Dateien bei jeden Seitenaufruf, was wiederum zu langsamen Seitenladezeiten führt.
Und wer mag schon gerne langsame Ladezeiten der Webseite?
Natürlich sind wir immer bestrebt das Rad nicht wieder neu erfinden zu müssen, dennoch haben wir uns in diesem Fall dazu entschlossen, ein speziell auf unsere Anforderungen zugeschnittenes WordPress Plugin Beckspaced Supersized zu entwickeln.
Beckspaced Supersized kann die Hintergrundbilder für den Vollbild-Modus nur aus einer NextGEN Bildergalerie laden (WordPress Plugin NextGEN Gallery muss natürlich installiert sein!) und benötigt hierfür die ID der NextGen Bildergalerie, welche nach Installation des Plugins, unter Einstellungen > Supersized Einstellungen, im WordPress Admin-Bereich eingetragen werden kann.
Um das Beckspaced Supersized WordPress Plugin zu installieren laden Sie zuerst die .zip Datei auf Ihren lokalen Rechner herunter und entpacken diese.
Danach laden Sie den Ordner ‚bs-supersized‚ via FTP in das /wp-content/plugins/ Verzeichnis der WordPress Installation.
Alternativ kann man auch via den WordPress Admin-Bereich unter Plugins > Plugins Hinzufügen > Hochladen die .zip Datei installieren.
Auch Google liefert gute Hilfe zum Installieren von WordPress Plugins.
Nachdem das Plugin installiert wurde, muss man es nur noch im WordPress Admin-Bereich unter Menupunkt Plugins aktivieren.
Sobald das Beckspaced Supersized Plugin aktiviert wurde, muss man noch im WordPress Admin-Bereich unter Menupunkt Einstellungen > Supersized Einstellungen die NextGen Bildergalerie ID eintragen und fertig ist das ganze 😉
Danach wählt die WordPress Erweiterung Beckspaced Supersized bei jeden Seitenaufruf jeweils ein Bild, nach dem Zufallsprinzip, aus der NextGen Bildergalerie aus und stellt es als Hintergrundbild im Vollbild-Modus dar.
Wer das Plugin nicht auf jeder Webseite aktiviert haben möchte, kann alternativ das Laden des Plugins in der wp-config.php global deaktivieren. Hierzu definieren Sie in der wp-config.php zwei Konstanten wie folgt:
define( 'BS_SUPERSIZED_LOAD_JS', false);
define( 'BS_SUPERSIZED_LOAD_CSS', false);
Danach kann man via WordPress Templates das Laden des Plugins nur für die gewünschten Seiten wieder aktivieren. Siehe folgenden Code:
if (is_callable(array($bsSupersized, 'loadStyles'))) $bsSupersized->loadStyles();
if (is_callable(array($bsSupersized, 'loadScripts'))) $bsSupersized->loadScripts();
Hierbei muss man nur darauf achten, dass der Aufruf im Template vor der Funktion wp_head() bzw. getHeader() erfolgt.
An dieser Stelle gleich noch vielen Dank an die Entwickler des jQuery Plugins Supersized und ebenso WP Supersized für das „Abschauen“ der Funktion images_from_ngg_gallery()
Wer Fragen oder Probleme hat einfach hier einen Kommentar hinterlassen. Natürlich kann das Plugin Beckspaced Supersized frei genutzt, verbreitet und ebenso verändert werden. Viel Spass!
Jetzt WordPress Plugin Beckspaced Supersized herunterladen
Mit freundlichen Grüßen
Becki Beckmann
CEO Beckspaced.com
Bildnachweis: Philipp Katzenberger | Lizensiert unter Unsplash