WordPress Yoast SEO Meta Beschreibung auf dem Blog nutzen

Wenn Sie mit Yoast SEO arbeiten, kennen Sie bereits das Feld Meta Beschreibung (Meta Description). Das Plugin sorgt dafür, dass Sie für jeden Beitrag (und jede Seite, jedes Bild etc.) einen SEO Titel und eben diese Meta Beschreibung hinterlegen können. Beide Angaben werden dann zusammen mit dem Link von den Suchmaschinen auf ihren Ergebnisseiten ausgeben. Dabei ist der Titel sicherlich die auffälligere Komponente. Die Kurzbeschreibung hingegen bietet etwas mehr Raum für die passenden Argumente, die Nutzer davon zu überzeugen sollen, dass der Klick sich lohnt. Diese Kurzbeschreibung sollte also wohlüberlegt und schlicht gut sein. Und wenn sie denn schon gut ist, kann man auf die Idee kommen, diese WordPress Yoast SEO Meta Beschreibung auch auf dem Blog beziehungsweise der Website selbst zu nutzen. Sei es auf Archivseiten anstelle des Auszugs oder sogar auf Beitragsseiten.

WordPress Yoast SEO Titel und Meta Beschreibung

Wenn Sie einen neuen Beitrag verfassen, erstellt Yoast SEO den SEO Titel standardgemäß auf Basis des Beitragstitels. Im Allgemeinen können Sie das so belassen. Sie können aber auch eine von dem Beitragstitel abweichende Formulierung wählen. Diese hinterlegen Sie dann in dem entsprechenden Feld, das Yoast SEO in der Beitragsbearbeitung unterhalb des großen Textfeldes bereitstellt. Anders bei der Meta Beschreibung: Wenn Sie nicht selbst Hand anlegen und eine passende Kurzbeschreibung Ihres Beitrags eingeben, benutzen die Suchmaschinen schlicht den Textanfang. Das mag im Einzelfall gut genug sein. Meist jedoch stellt der erste Satz eines längeren Textes keine Beschreibung des Gesamten dar. Und genau darum geht es bei der Meta Beschreibung, die neben dem SEO Titel die einzige Vorabinformation ist: Eine Vorstellung davon zu liefern, warum sich der Klick lohnen sollte.

Die WordPress Yoast SEO Meta Beschreibung auf der Website nutzen

Wenn man sich nun also die Mühe macht und entsprechend für jeden Beitrag eine Meta Beschreibung hinterlegt, stellt sich die Frage, ob man diese nicht auch direkt auf der Website nutzen kann. Normalerweise ist dort gar nicht zu sehen. In meinem Beitrag zum Thema WordPress Auszug habe ich schon mal kurz angedeutet, dass es sich hierbei ja auch um die Meta Beschreibung handeln könnte: Statt für den manuellen Auszug denselben Text wie für die Meta Beschreibung einzugeben, könnte man auch direkt die WordPress Yoast SEO Meta Beschreibung an der entsprechenden Stelle abfragen. Ebenso könnte jeder Blogbeitrag mit dieser Meta Beschreibung beginnen. Für beide Zwecke funktioniert folgender Code:

echo get_post_meta(get_the_ID(), '_yoast_wpseo_metadesc', true);

Die Meta Beschreibung anstelle des WordPress Auszugs ausgeben – am Beispiel Twenty Seventeen

Im Beitrag zum Thema WordPress Auszug hatte ich schon gezeigt, wie man Twenty Seventeen dazu bringt, auf Archivseiten anstelle des Volltextes den Auszug auszugeben. Nun geht es also darum, in der Datei content-excerpt.php dafür zu sorgen, dass nicht länger der Auszug (the_excerpt) abgerufen wird, sondern die Meta Beschreibung. Die content-excerpt.php finden Sie im Verzeichnis template-parts/post/. Und die passende Stelle in der Datei, die es zu ändern gilt, befindet sich innerhalb des DIVs mit der Klasse .entry-summary. Im Urzustand steht dort Folgendes:

<div class="entry-summary">
<?php the_excerpt(); ?>
</div><!-- .entry-summary -->

Dies gilt es nun wie folgt zu ersetzen:

<div class="entry-summary">
<div class="metadesc"><?php echo get_post_meta(get_the_ID(), '_yoast_wpseo_metadesc', true); ?></div> 
<a href="<?php echo get_permalink(); ?>"> Weiterlesen</a>
</div><!-- .entry-summary -->

Über die Auszeichnung mit einem DIV und eigener Klasse .metadesc lässt sich die Meta Beschreibung gut formatieren. Mehr dazu – siehe unten.

Die Meta Beschreibung zu Beginn jedes Blogsbeitrages ausgeben

Wenn Sie die Meta Beschreibung nun auch noch zu Beginn jedes Blogbeitrages ausgeben wollen, fügen Sie folgenden Code in der Datei content.php (ebenfalls im template-parts/post/-Verzeichnis zu finden) direkt nach dem öffnenden DIV mit der Klasse .entry-content ein. Dabei sorgt die Abfrage, ob es sich um einen Beitrag der Kategorie blog handelt, dafür, dass die Meta Beschreibung nur für eben solche Beiträge ausgegeben wird.

<?php if (in_category('blog')) {
echo '<div class="metadesc">';
echo get_post_meta(get_the_ID(), '_yoast_wpseo_metadesc', true);
echo '</div>';
} 
?>

Soll das Vorgehen für alle Beiträge gelten, lautet der Code einfach:

<?php 
echo '<div class="metadesc">';
echo get_post_meta(get_the_ID(), '_yoast_wpseo_metadesc', true);
echo '</div>';
?>

CSS für die Meta Beschreibung

Nun können Sie die Meta Beschreibung auch noch formatieren. Zumindest braucht sie einen Außenabstand nach unten (margin-bottom). Sie könnte aber natürlich auch einen kleinen Rahmen haben, kursive Schrift oder was auch immer Ihnen gefällt. Für etwas mehr Abstand zwischen den einzelnen Beiträgen sorgt der Außenabstand nach unten für die Klasse .entry-summary.

.metadesc {margin-bottom: 50px; border-left: 3px solid orange; padding-left: 10px;}
.entry-summary {margin-bottom: 75px;}

Die passenden CSS-Angaben, die aus dem an sich schlichten Weiterlesen-Link des Themes einen Weiterlesen-Button machen, finden Sie im Beitrag von letzter Woche.

Beitragsbild: Britta Kretschmer