“Titleimage” – Titelbild-Plugin für WordPress

Für hauptsächlich Bild-basierte Websites und typische Fotoblogs fehlte mir in WordPress bisher die Möglichkeit, eine Art Titelbild anzuzeigen, welches neben den regelmäßigen Blog-Einträgen über einen beständigeren Zeitraum auf der Startseite erscheint. Seit dem Relaunch von pixelshifter.de kommt das Plugin “NextGEN Gallery” für Bildergalerien zum Einsatz, und somit lag es für mich nahe ein eigenes kleines Plugin zu schreiben, womit ein Bild aus einer “NextGEN” Galerie ausgewählt werden kann, um es als Startbild anzuzeigen.

UPDATE: Die aktuelle Version trägt nun die Versionsnummer 0.7.1 und wurde mit der WordPress Version 3.2.1 und der NextGen Gallery 1.8.2 getestet.

Mit Hilfe des Plugins “Titleimage” sind für diesen Anwendungsfall unter anderem folgende Einstellungen möglich:

  • Auswahl der NextGEN Quellgallerie
  • Ein bestimmtes oder ein zufälliges Bild der ausgewählten Galerie anzeigen
  • Festlegen von maximaler Bildbreite bzw. Höhe
  • Angabe einer alternativen Bildunterschrift inklusive Verlinkung zu einer weiterführenden Seite

Um das ausgewählte Bild auf der Website anzuzeigen, muss im gewünschten Template lediglich noch ein Aufruf der PHP-Funktion showTitleimage() eingebunden werden, welche durch das “Titleimage” Plugin bereitgestellt wird.

Einstellungen

Titleimage

Die Darstellung des Titelbildes lässt sich durch mehrere Parameter definieren. Sämtliche Angaben werden auf einer übersichtlichen Plugin-Seite seit WP 2.7 im Bereich “Werkzeuge (Tools)” unter dem Menupunkt “Titleimage” dargestellt. Die nebenstehende Vorschaugrafik zeigt die Benutzeroberfläche.

Die Parameter im einzelnen:

  • Status
    Schaltet die Darstellung des Titelbildes generell an oder aus.
  • Galerie
    Ermöglicht die Auswahl der Quellgalerie aus dem Plugin NextGEN Gallery.
  • Bildauswahl
    Legt das anzuzeigende Bild aus der gewählten Galerie fest. Hierbei ist es möglich, das erste Bild, ein zufälliges Bild oder ein bestimmtes Bild für die Darstellung auszuwählen.
  • Maximale Bildgrößen
    Legt die maximale Bildbreite oder Bildhöhe fest, in der das Bild ausgegeben werden soll
  • Bild-Link
    Ermöglicht die Angabe eines URL, mit dem das Bild verlinkt wird.
  • Bild-Link Attribute
    Erweiterte Attribute mit denen der Bild-Link versehen wird. Z.B. Klassenangaben für JavaScript Lightbox-Effekte etc.
  • Bilduntertitel
    Schaltet die Anzeige eines Bilduntertitels an Hand von verschiedenen Optionen an. Folgende Optionen sind möglich:

    • Galeriebeschreibung
    • Bildbeschreibung
    • Eigener Text
    • Kein Bilduntertitel
  • Titel
    Ermöglicht die Angabe eines alternativen Bilduntertitels. Sollte hier nichts angegeben werden, wird der im NextGEN Plugin eingetragene Titel angezeigt. Voraussetzung hierfür ist natürlich die Aktivierung der Option “Bildtitel”.
  • Untertitel Link
    Ermöglicht die Angabe eines URL mit dem der Bilduntertitel verlinkt wird.
  • Stil
    Durch Aktivierung dieser Option wird angegeben, ob der Default Stil verwendet werden soll, oder das Design der Elemente über Stildefinitionen aus einer eigenen Stylesheet Datei erfolgt.

 

Verwendung im Template

Zur Darstellung des ausgewählten Bildes muss im gewünschten Template die PHP-Funktion <?php showTitleimage(); ?> aufgerufen werden. Hierdurch wird an entsprechender Stelle automatisch beim Seitenaufruf folgender HTML Code generiert:

<div id="Titleimage">
  <div class="TI_Inner">
    <div class="TI_Image">
      <a href="[BILDPFAD]" [ATTRIBUTE]>
        <img src="[NGG BILDPFAD]"
             alt="[ALT TEXT]"
             title="[ALT TEXT]" />
      </a>
    </div>
    <div class="TI_Description">
      <p>[VERLINKTER BILDUNTERTITEL]</p>
    </div>
  </div>
</div>

Voraussetzungen

Grundsätzlich ist für dieses Plugin, neben der WordPress Installation natürlich, auch das Plugin NextGEN Gallery erforderlich.

Bisher wurde “Titleimage” von mir unter der WordPress Version 2.7 und der NextGEN Gallery Version 1.0 getestet. Für andere Konfigurationen kann ich leider keinerlei Erfahrungswerte weitergeben.

Für Rückmeldungen über eigene Erfahrung mit der Installation unter anderen Voraussetzungen, insbesondere bei älteren WordPress Versionen, habe ich immer ein offenes Ohr.

Installation

Nach dem Download der weiter unten angezeigten ZIP-Datei und dem anschliessenden entpacken erhältst Du den Ordner “titleimage”. Dieser muss nun in das Verzeichnis wp-content\plugins\ kopiert oder verschoben werden.

Nun sollte “Titleimage” bereits auf der Plugin-Übersichtsseite Deiner WordPress Installation sichtbar sein. Als letzter Schritt fehlt somit lediglich noch die Aktivierung des Plugins.

Nach erfolgter Aktivierung ist im Bereich “Verwalten” der Menupunkt Titelbild hinzugekommen, der alle weiter oben beschriebenen Einstellungen ermöglicht.

Um auch wirklich etwas zu sehen, sollte natürlich noch die im Abschnitt “Verwendung im Template” erwähnte Einbindung der Funktion showTitleimage() erfolgen.

Hinweis: Das ebenfalls erforderliche Plugin NextGEN Gallery ist nicht in dem unten aufgeführten Download Paket enthalten, und muss separat von der Website des Entwicklers heruntergeladen und installiert werden.

Lokalisierung

Das Benutzerinterface ist derzeit in deutsch und englisch vorhanden, und sollte sich automatisch der in WordPress eingestellten Sprache anpassen.

Falls jemand eigene Lokalisierungen vornehmen möchte, wäre ich für eine Rückmeldung mit der entsprechenden Sprachdatei sehr dankbar. Ich würde diese dann gerne in das Downloadpaket mit Nennung der Referenz einbauen.

Nutzungshinweis / Gewährleistungsausschluss

Wenngleich ich das Plugin “Titleimage” selber natürlich ohne weitere Probleme und Bedenken einsetze, so möchte ich dennoch darauf hinweisen, dass ich keinerlei Gewährleistung für die Funktionsfähigkeit und vor allem Datensicherheit übernehmen kann. Die Installation und der Betrieb dieser Software geschieht grundsätzlich auf eigene Verantwortung und Gefahr. Danke für Dein Verständnis!

Lizenz

Das Plugin ist kostenlos und darf ohne Angabe von Gründen auf der eigenen WordPress Installation verwendet werden. Auch die Weitergabe an Dritte ist ausdrücklich erwünscht. Allerdings sollte der Autorenhinweis im Quelltext nicht verändert werden.

Download

Das Plugin kann auf der WordPress.org Seite in der aktuellen Version 0.7.1 kostenlos heruntergeladen werden:

Anregungen & Mithilfe

Für konstruktive Anregungen bin ich jederzeit dankbar. Nicht zuletzt die Kommentarfunktion steht dafür jeden offen.

Sollte es jemanden in den Fingern jucken, der selbst Hand an den Code legen möchte … nur zu. Sinnvolle Erweiterungen und Ergänzungen am Code würde ich dann gerne in das Projekt einfließen lassen, und ggf. auch hier veröffentlichen.

31 Meinungen zu ““Titleimage” – Titelbild-Plugin für WordPress

  1. Pingback: Pixelshifter - Fotogalerie, Fotoblog, Spielwiese ... | Blog Archiv | WordPress Plugin “Titelbild”

  2. Hallo..

    Tolle Sache…

    Meine Phantasie geht weiter..
    ^^

    Im Moment kann man zwar viele Bilder (aus 1 Galerie) einbinden, aber nur einen Text / Link dazu..

    OK..

    Phase 1:
    zu mehreren Bildern diverse TExte / Slogans..

    Phase2:
    Das ganze alternativ als eine Art featured Artikel-Dingens nehmen..
    Also: Verschiedenen Bildern / Galerien verschiedene Texte / Links zuordnen..
    ZB:
    Neue Galerie / Link neue gallery..
    Neuer artikel / neuer artikel-link..

    usw..

    Gruss..

    Helmi

  3. Thank you for this plugin. I’d love to use it in my blog header, but I’m getting the following error:

    Rendering of template singlepic-titleimage.php failed

    The relevant code generated in the source is:

    Rendering of template singlepic-titleimage.php failed

    I’ve placed the function call in my header.php. I’ve experimented with placing the relevant code in index.php, but with the same results.

    Any ideas?

  4. @ ElShaddai:
    Thanks for your hint. As i already wrote to you via email the older display.php had had an individual NGG template call that wasn’t part of version 0.5. The recent update to 0.5.1 of “titleimage” contains a fixed version and should now be ok.

    I’ll think about the use of individual NGG-Templates in a later version.

    @Helmi:
    Es ist derzeit schon möglich, die an den einzelnen Bildern in der NextGEN Gallery gepflegte Beschreibung anzeigen zu lassen. Dazu muss, neben der Aktivierung der Option “Bildtitel” natürlich, das Feld “Titel” einfach frei gelassen werden.
    Eine Überarbeitung des Plugins ist gerade auf dem Weg, in der die Einstellungen etwas klarer werden sollten.
    Ein Ausbau Richtung “Featured Artikel Dingens” wird es vermutlich nicht geben. Ich denke für diese Zwecke gibt es bereits ähnlich Plugin/Bordfunktion, die Posts an prominenter Stelle platzieren.

    Danke für euer Interesse an dem Plugin.
    Thanks for your interest in this plugin.

    Marc

  5. Ein starkes PlugIn das ich auch gerne einsetzen würde. Bei mir haperts nur an der eigenen Stildefinition um den weißen Rahmen wegzubekommen. Gibt’s da noch mehr Infos oder Tipps :-)

  6. Hey,

    dass Plugin hört sich interessant an.
    Wäre das ein Plugin, mit dem neben jedem Artikel ein anderes Bild angezeigt wird ?

    LG

  7. @ Uwe Mayer:

    Der weisse Rahmen kommt wahrscheinlich durch die default Stildefinitionen im NGG Gallery Plugin, CSS-Klasse .ngg-singlepic am img-Tag.

    Um Stilproblemen auf die Schliche zu kommen, empfiehlt sich Firefox mit der Erweiterung firebug zu verwenden. Dort kann man über die Funktion “inspect”/”untersuchen” die CSS Definitionen einzelner Elemente sozusagen mit der Maus erforschen.

    Ansonsten ist CSS natürlich ein zu umfangreiches Thema für den Kommentarbereich ;-)

    @Ben:

    Überall dort, wo die Funktion showTitleimage() im Template eingebunden wird, werden auch die Bilder aus der ausgewählten Gallery angezeigt. Also theoretisch sogar auch in der sidebar.php. Allerdings nicht inhaltsabhängig, sondern ausschliesslich aus der im Plugin eingestellten Galerie.

    Einen ähnlichen Gedanken hatte ich allerdings auch bereits. Mal sehen, ob ich das irgendwann mal weiterdenke …

    Danke für euer Interesse am Plugin.
    Marc

  8. Hey,

    ich habe das Plugin nun installiert, jedoch sehe ich keinen neuen Menüpunkt zum einstellen.

    Wie muss der Code denn zum einbinden lauten ?

    LG

  9. @Ben:

    Unter WP 2.7 ist der Menupunkt mit den titleimage Einstellungen unter “Werkzeuge” zu finden.
    Die eigentliche Darstellung musst Du in einer Template-Datei Deines Themes (z.B. in der index.php) mit Hilfe eines PHP Funktionsaufrufes einbinden:

    < ?php showTitleimage(); ?>

    Gruß
    Marc

  10. Hey Marc,

    habe ich nun gefunden , danke.

    Aber wenn ich “” einfüge, erscheint kein Bild, sondern nur der Code.

    Irgendwas ist das nicht korrekt.

    LG

  11. Alles klar, nun klappt es ohne Probleme.

    Vielen Dank für das Plugin.
    Gut wäre nun noch, wenn ein Bild aus allen Galerien angezeigt werden wird. ;)

    LG

  12. Hallo Marc

    wirklich ein geniales Plugin und es läuft bei mir wie gewünscht,
    bis auf eine Sache, wenn es möglich ist, würde ich gerne anstatt des Bildpfades href=”[BILDPFAD] hier würde ich gerne meine Blog URL verwenden, so dass wenn jemand im Blog ist, auf den Header klickt wieder am Anfang ist.

    Ich habe es mit den Einstellungen probiert, leider habe ich in PHP keine Ahnung, dort könnte man es doch auch einstellen ?

    Wenn Du evtl einmal Zeit hättest würde ich mich über eine Antwort freuen.

    Ich wünsch Dir auch noch ein gutes neue Jahr

    Gruss
    Marco

  13. @Marco:

    Danke für Deine Anregung. Ich arbeite gerade an einem Update, in dem wohl auch eine Anpassung des Bildlinks möglich sein wird. Vielleicht gibt es schon ein Update im Laufe der nächsten Woche.

    Gruß
    Marc

  14. hallo marc

    plugin sehr gut . macht meine seite direckt “bildlicher” :)
    ich hätte da noch einen vorschlag , und zwar das bilder nicht nur aus einem album zufällig angezeigt werden sondern aus allen alben . und ( ja sorry 2 vorschläge :D ) vielleicht sowas wie “” … so das mann in verschiedenen posts die macht hat zu bestimmen welche bilder angezeigt werden .

    danke

    christian

  15. @ Christian:
    Danke für Dein Interesse an dem Plugin. Deine Vorschläge nehme ich gerne auf.

    By the way: Die Porträts auf Deiner Website haben es mir echt angetan. Irgendwie hab ich da immer noch eine Hemmschwelle gerade bei Menschen einfach mal genauer mit der Kamera hinzuschauen.

    Marc

  16. oh danke … viel geht mit immer freundlich sein und lächeln während mann sich nähert . die asiaten sind alle mit kleinen knippsen ( canon a95 , a640) geschossen sodas die leute nicht mit so ner riesen dslr konfrontiert werden sondern man auch mal einfach aus der hüffte schiessen kann . allerdings muss man manchmal trotzdem sehr nah rangehn aber die sind da sehr easy mit . die westler sind alles termine gewesen . …. hab mal deine bilder durchgeschaut da sind sehr coole dabei … feldgeometrie is doch super . brutalismus cool mit den warmen farben und wir teilen anscheinend ne gewisse art geometrien zu fotografieren :) . noch was zum plugin wie ich seh is der code in den anführiungszeichen nicht mit gepostet worden beim letzten mal . ich denke das eine möglichkeit zu bestimmen welches album abgespielt wird auch gut ist . sodas mann in verschiedenen posts verschiedene alben bilder hat . das könnte dann ungefähr so aussehn ” showTitleimage(*albumname*) ” …

    grüsse

    christian

  17. hello

    i use this plugin and i do this in display.php
    line 90 :
    if ($titleimage[‘imageurl_additions’] != ”) {
    $image_link_additions = htmlspecialchars_decode($titleimage[‘imageurl_additions’]);
    } else {
    $image_link_additions = ‘class=”thickbox”‘;
    }

    I replace lightview by thickbox
    Thanks a lot

    Stef

  18. @ stef:
    If you fill the field “Image Link Attributes” (German Version: “Bild-Link Attribute”) with class=”thickbox” you will have the same effect without changing the PHP code. Using this way, a future update of the plugin will not overwrite your code changes.
    However, thanks for using the plugin and your comment.

    Marc

  19. Hi and thanks for this nice plugin!!
    i’m testing it for a site, but i can’t show the image. The script prints ok all descriptions and the link on the tag, but the output ofthe image path is /wp-content/plugins/nextgen-gallery/nggshow.php?pid=5&width=320&height=249 that is not displayng any image. I tested versions 7 and 7.1.
    help plaese!!!thanks!!

  20. I also requested help on the wp support forums. I tried the default wp theme, and plugin is working. I tried to insert showtitleimage() after the get_header and inside the loop, and it’s working.
    but in the theme i’m making images won’t display. after getheader or before loop i can only read the img link and images description, but no image was displayed. Any idea?

  21. Das hatte ich die ganze Zeit gesucht, die Gallery läuft ja soweit prima, aber wie dann das Bild verlinkt werden kann hatte ich in NextGen nicht finden können.. Werde gerne berichten wenn ich fertig bin. Danke

  22. Hi! I love your plugin and I’m using it on my blog for some time now. I had a suggestion: if you could include the ALT property in IMG tag in the display.php (when displaying the image), it would be great. I have added it manually, but I fear that it will be lost during automatic plugin upgrade. Thanks!

  23. Hallo, ich würde titleimage gerne einsetzen, jedoch nur auf einer einzigen Seite, welche dann als statische Startseite definiert sein soll. Wenn ich jedoch ein Template ändere dann wird ja auf jeder Seite ein Bild angezeigt? Gibt’s da eine Möglichkeit dass ich das ganze nur in einer Seite über HTML aufrufen kann oder so?

    Gruß
    Hendrik

  24. Hallo Hendrik,

    wenn Du in Deinem WordPress Theme nur die index.php änderst, wird in der Regel auch nur die Startseite betroffen sein. Alternativ kannst Du auch ein neues Seiten-Template erstellen (z.B. durch eine Kopie von index.php) und in dieser als PHP-Kommentar am Anfang des Templates folgendes einfügen: “Template Name: TEMPLATE_NAME”. Dieses ist dann als Vorlage für WordPress Seiten unter dem vergebenen Namen auswählbar, und kann natürlich ebenso individuell angepasst werden.

    Gruß
    Marc

  25. Hi,

    After hours of searching, your plugin was exactly what i needed.

    However the image is now somehow a link and goes to the url of the image which i do not want it to do. How do i stop this from happening?

Was meinst Du dazu?

Du kannst folgende HTML Tags und Attribute verwenden: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Deine E-Mail Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.