Quellenangabe für Titelbild Plug-in Featured Image Caption

… Fotografie braucht Ambition! – und Kraft. Bild von MichaelGaida

Der Classic-Editor: Vertraut und zuverlässig –
Ihr bewährter Begleiter.

Erleben Sie den Classic Editor neu!
(Bilder von pixelcreatures)

Viele Nutzer schätzen die vertraute Umgebung des Classic-Editors, die eine einfache und schnelle Bearbeitung ermöglicht.

Mit dem Advanced Editor Tools auf das nächste Level –
Mehr Funktionen, mehr Möglichkeiten.

Classic Editor + Advanced Editor Tools
= Ihr Erfolgsrezept

Der Advanced Editor erweitert den Funktionsumfang des Classic-Editors und ermöglicht es, Inhalte noch effektiver zu bearbeiten.

Einfach und intuitiv –
Der Classic-Editor für alle.

Classic Editor & Advanced Editor Tools
Erleben Sie es.

Der Classic-Editor zeichnet sich durch Stabilität und Zuverlässigkeit aus, was für professionellen Anwender von Bedeutung ist.

Mehr schaffen in weniger Zeit –
Der Advanced Editor für kreative Köpfe.

Optimieren Sie Ihre Bearbeitung:
Advanced Editor Tools

Mit dem Advanced Editor können Designer und
Content Creatoren kreative Ideen umsetzten.

Die Möglichkeit zur Hinzufügung einer Bildbeschriftung (bspw. zur Quellenangabe) für das Titelbild (Beitragsbild) kann von Theme zu Theme unterschiedlich sein. Nicht jedes Theme bietet diese Funktion nativ an. In solchen Fällen kann die Verwendung eines Plug-ins wie 'Featured Image Caption' eine Lösung sein. Dabei möchten wir gerne den Hinweis auf die Website 'Theme Coder' empfehlen.

Plug-in Featured Image Caption und Hinweis zur Website Theme Coder eine Empfehlung unter Freunden.

Inhaltsverzeichnis

Zur Quellenangabe des Titelbildes

… einige Bemerkungen.

Wenn die Beschriftung des Titelbildes direkt unter dem Titelbild im Content des Beitrags eingegeben ist, wird dies in die Meta-Beschreibung der Suchergebnisse einfließen. Dies ist normalerweise unerwünscht. Das Plug-in Featured Image Caption ermöglicht es, diese Beschriftung separat zu verwalten und sicherzustellen, dass nur das Exzerpt für die Meta-Beschreibung verwendet wird. Dadurch wird eine klare Trennung zwischen der Beschriftung des Titelbildes und dem Inhalt, der in den Suchergebnissen angezeigt wird, erreicht.
Zunächst scheint das Plug-in für bestimmte Themes wie 'Twenty Fourteen' ungeeignet zu sein, da der Bildausschnitt des Titelbildes dies bedingt (für die Mobilansicht ist aber der Bildausschnitt nicht sichtbar).
An der Schraffierung ist der Fehler erkennbar.
Eine alternative Möglichkeit zur Bildbeschriftung besteht jedoch darin, Shortcodes zu verwenden. Dies ermöglicht es, neben der Beschriftung auch erweiterte Beschreibungen oder andere Designelemente einzufügen, je nach den Anforderungen und dem Design der Website.

Der Shortcode

Das Plug-in stellt den Shortcode [ccfic] zur Verfügung, der im Editor verwendet werden kann, um die Bildunterschrift einzufügen. Die Bildunterschrift wird somit nicht direkt am Bild des Beitrags angezeigt, sondern im Inhalt des Beitrags über den Shortcode.

Beispiel Shortcode:

[ccfic caption-text source-link]

Der Auszeichnung wie dieses Beitrags unter dem Titelbild ist allein der Shortcode [ccfic] okay.
Es ist wichtig, in den Plug-in-Einstellungen die Option Automatically add the caption to the featured image zu deaktivieren. Andernfalls würde die Bildunterschrift automatisch am Bild angezeigt werden, was in diesem Fall nicht gewünscht ist. Denn wie schon oben gezeigt, sonst ist derlei visuell:
An der Schraffierung ist der Fehler erkennbar.
Wenn das Häkchen entfernt wurde, muss also der Shortcode manuell eingefügt werden. Dies kann direkt im Editor erfolgen. Weitere Informationen sind in der nächsten Überschrift. Dort wird erklärt, wie der Shortcode automatisch über die functions.php hinzugefügt werden kann.
Das dritte Häkchen für 'Add a container <div> to the caption HTML' ist aktiviert zu lassen. Dies stellt sicher, dass der Shortcode ordnungsgemäß in ein Container-Div eingebettet wird.

Statt dem Häkchen bei Automatically add the caption to the featured image

Anstelle des Häkchens bei 'Automatically add the caption to the featured image' wird nun der Shortcode … automatisch im Content des Beitrags verwendet.

Durch den Code in der functions.php wird die Bildbeschriftung automatisch im Content angezeigt, wenn sie definiert ist. Der Shortcode muss nicht manuell eingegeben werden. Hier ist der entsprechende Code für die functions.php:

/* Titelbild Beschriftung per Shortcode autom. */
$reihenfolge = 1;

add_filter('the_content', 'ccfic_before_content', $reihenfolge, 1);
function ccfic_before_content($content)
{
if (is_singular('post')) {
$content = do_shortcode('[ccfic]') . $content;
}

    return $content;
}

^{Pr. WP-Freund}

Durch Hinzufügen dieses Codes zur functions.php wird die Bildbeschriftung automatisch im Content des Beitrags angezeigt, wenn eine Beschriftung für das Titelbild vorhanden ist.

Beispiel von CSS und das mit dem Selektor '.ccfic:empty'

Das Beispiel von CSS ist hier dem Beitrag unter dem Titelbild zu sehen ist "… Denn Fotografie braucht Ambition! – und Kraft. MichaelGaida".

/* --- Design Quellenangabe für Titelbild --- */
.ccfic {
    margin-bottom: 23px;
    padding-bottom: 13px;
    font-size: 14px;
    color: #777;
    border-bottom: 1px solid #e6e6e6;
}
.ccfic:empty {
    display: none;
}
/* - Ende Design Quellenangabe für Titelbild - */

Wichtig ist der Selektor .ccfic:empty im Zusammenhang des automatischen Shortcodes, wenn das Element ccfic keinen Inhalt enthält, also im Editor-Widget 'Featured Image Caption' kein Eintrag vorhanden ist.