Fotos elegant in den Blog einbinden und anzeigen

Mit ImageManager v2.3.7 und Lightbox 2 Wordpress Plugin v1.5 binde ich hier im Wordpress-Blog meine Bilder einfach, schnell, bequem und elegant ein. Durch ein Klick auf das Bild wird eine grosse Version angezeigt, sofern hinterlegt. Als Bespiel siehe den Eintrag «Starbucks WI-FI von Swisscom in…», einfach auf das Foto klicken.

ImageManager v2.3.7: Anstelle der eingebauten Upload-Funktion, kann ich mit ImageMaker die Bilder einfach in von mir individuell angelegte Ordner ablegen. Gleichzeitig kann auch durch die Bilder geblättert werden. Die hochgeladenen Bilder können anschliessend noch etwas bearbeitet werden (Zuschneiden, Rotieren, Spiegeln, Skalieren). Ich erachte das Handling als grosse Erleichterung.

Lightbox 2 Wordpress Plugin v.5: Wer kennt Lightbox nicht? Diese weit verbreitete Lösung zum anzeigen und blättern von Bildern finde ich super. Zwar ist sie von JavaScript abhängig, aber die Darstellung ist super. Die Bedienung zeigt sich leider nur beim überfahren der Grafik, dafür wird die Steuerung per Tastatur unterstützt.

Modifikationen: Damit die vom ImageManager eingefügten Bilder inkl. Titel in der Lightbox Darstellung erscheinen, braucht es eine kleine Modifikation am ImageManager
Datei: imagemanager-plugin.php
Nach der Zeile 211 und 234 muss dieser Code eingefügt werden:

str += ' title="' + params.f_alt + '" ';

Ergebnis:

211: str += ' rel="lightbox" ';
212: str += ' title="' + params.f_alt + '" ';
213: str += ' >';

235: str += ' rel="lightbox" ';
236: str += ' title="' + params.f_alt + '" ';
237: str += ' >';

Weiter gab es ein Problem, wenn ein Eintrag im Blog aufgerufen wird, dann stimmten die Pfade zu 2 Grafiken nicht mehr.
Datei: lightbox.js
Die Zeile 62 und 63 wurden wie folgt angepasst:

62: var fileLoadingImage = "/wp-content/plugins/lightbox/images/loading.gif";
63: var fileBottomNavCloseImage = "/wp-content/plugins/lightbox/images/closelabel.gif";

Fertig. Viel Spass.

Die modifizierten Files als ZIP-File.

Hinterlasse einen Kommentar

Name: (erforderlich)

eMail: (erforderlich)

Webseite:

Kommentar: