Wie Du Related Posts ohne Plugin einfügst – die ultimative Anleitung

Die Einbindung von Related Posts am Ende eines Blogposts kann nicht nur das Interesse der Leser wecken, sondern auch dazu beitragen, Deine Website für Suchmaschinen zu optimieren. Viele Blogger verwenden dafür Plugins, aber wusstest Du, dass es auch eine Möglichkeit gibt, Related Posts ohne Plugin einzufügen?

In diesem Artikel zeige ich Dir eine Schritt-für-Schritt-Anleitung, wie Du die Relevanz Deiner Inhalte steigern, die Leserbindung verbessern und Deine SEO-Optimierung durch die Einbindung von Related Posts verbessern kannst. Erfahre, wie Du diese Funktion ohne Plugin einfach in Deinen Blog integrierst und die Verbesserungen in Deinem Traffic und Deiner Sichtbarkeit erzielst. Also, lass uns loslegen und Deinen Blogpost auf das nächste Level bringen!

In dieser Anleitung zeige ich Dir verschiedene Möglichkeiten auf, Related Posts ohne weiteres Plugin in Deinen Blogpost einzufügen. Ich verwende hierzu GeneratePress-Premium. GeneratePress-Premium beinhaltet GenerateBlocks, welches für alle Beispiele benötigt wird.

In allen Beispielen verwende ich zusätzlich das Plugin Code-Snippets, welches auch von GeneratePress empfohlen wird. Code-Snippets benutze ich immer wieder. Schau Dir ruhig an, wofür dieses Plugin alles gut ist.

Was sind Related Posts

Related Posts sind Artikel, die auf thematisch verwandte Inhalte auf Deiner Website verweisen und die den Lesern helfen können, mehr über das Thema zu erfahren oder weitere Informationen zu erhalten. Durch die Einbindung von Related Posts kannst Du die Relevanz Deiner Inhalte verbessern, indem Du den Lesern zusätzliche Informationen und Mehrwert bietest.

Wenn ein Leser etwa einen Artikel über „Tipps für das Laufen im Winter“ liest und am Ende des Artikels Links zu verwandten Artikeln, wie „Die beste Winterlaufausrüstung“ oder „Die Vorteile des Laufens bei kaltem Wetter“ findet, kann er sich weiter in das Thema vertiefen und mehr über das Laufen im Winter erfahren. Auf diese Weise erhält der Leser nicht nur mehr Informationen, sondern verbringt auch mehr Zeit auf Deiner Website und erhöht damit die Chance, dass er wiederkommt oder Deine Website weiterempfiehlt.

Die Einbindung von Related Posts kann auch dazu beitragen, dass Deine Inhalte besser gefunden werden. Wenn Du etwa einen neuen Artikel veröffentlichst und Links zu verwandten Artikeln einfügst, kannst Du den Lesern ermöglichen, mehr über das Thema zu erfahren und auf Deine Website zurückzukehren. Dies kann dazu beitragen, dass der neue Artikel mehr Aufmerksamkeit erhält und höher in den Suchmaschinenergebnissen erscheint.

Zusammenfassend kann gesagt werden, dass die Einbindung von Related Posts dazu beitragen kann, die Relevanz Deiner Inhalte zu erhöhen, indem sie den Lesern zusätzliche Informationen und Mehrwert bieten. Ferner kann dies dazu beitragen, dass Deine Inhalte besser gefunden werden und die Leserbindung erhöht wird, indem sie den Lesern ermöglichen, tiefer in das Thema einzutauchen und mehr Zeit auf Deiner Website zu verbringen.

Warum ohne Plugin?

Related Posts nach Kategorien einfügen

Falls Du das Plugin Code Snippets bisher nicht installiert hast, dann hole das bitte nach. Du findest es im WordPress-Verzeichnis.

Nach der Aktivierung erscheint in der linken Navigationsleiste der Link „Snippets“. Wenn Du die Maus darüber hältst, dann erscheint ein Auswahlmenü. Dort klickst Du dann auf „Neu hinzufügen“. Dort gibst Du dann einen beliebigen Titel, z. B. „Related Posts per Kategorie“ an.

In das Feld Code gibst Du folgenden PHP-Code ein:

<?php

function related_posts( $atts ) {
    $atts = shortcode_atts( array(
        'count' => 3,
    ), $atts, 'related_posts' );

    global $post;
    $categories = get_the_category( $post->ID );

    if ( ! empty( $categories ) ) {
        $category_ids = array();
        foreach ( $categories as $category ) {
            $category_ids[] = $category->term_id;
        }

        $args = array(
            'category__in' => $category_ids,
            'post__not_in' => array( $post->ID ),
            'posts_per_page' => $atts['count'],
            'orderby' => 'rand',
        );

        $query = new WP_Query( $args );

        if ( $query->have_posts() ) {
            $output = '<div class="related-posts">';
            $output .= '<h2>Related Posts</h2>';
            $output .= '<ul>';

            while ( $query->have_posts() ) {
                $query->the_post();

                // Beitragsbild
                $thumbnail = get_the_post_thumbnail( $post->ID, 'thumbnail' );
                if ( ! $thumbnail ) {
                    $thumbnail = '<img src="' . get_stylesheet_directory_uri() . '/images/no-thumbnail.jpg" alt="No thumbnail">';
                }

                // Textauszug
                $excerpt = wp_kses_post(get_the_excerpt());
                if ( ! $excerpt ) {
                    $excerpt = wp_trim_words( get_the_content(), 20 );
                }

                $output .= '<li>';
                $output .= '<a href="' . get_permalink() . '">' . $thumbnail . '</a>';
                $output .= '<div class="related-posts-content">';
                $output .= '<h3><a href="' . get_permalink() . '">' . get_the_title() . '</a></h3>';
                $output .= '<p>' . $excerpt . '</p>';
                $output .= '</div>';
                $output .= '</li>';
            }

            $output .= '</ul>';
            $output .= '</div>';

            wp_reset_postdata();

            return $output;
        }
    }
}
add_shortcode( 'related_posts', 'related_posts' );

Anschließend musst Du noch „Nur im Frontend der Website ausführen“ anklicken und das Ganze speichern und aktivieren.

Dieser Code produziert den shortcode „related_posts“. Dieser Shortcode wird nun per GenerateBlocks am Ende Deines Artikels eingefügt.

Wie das genau geht, erkläre ich am Ende des Artikels unter der Überschrift „Shortcode einfügen“.

Related Posts nach Schlagwörtern einfügen

Auch hier gilt, falls Du das Plugin Code Snippets bislang nicht installiert hast, dann hole das bitte nach. Du findest es im WordPress-Verzeichnis.

Nach der Aktivierung erscheint in der linken Navigationsleiste der Link „Snippets“. Wenn Du die Maus darüber halst, dann erscheint ein Auswahlmenü. Dort klickst Du dann auf „Neu hinzufügen“. Dort gibst Du dann einen beliebigen Titel, z. B. „Related Posts per Schlagwort“ an.

In das Feld Code gibst Du folgenden PHP-Code ein:

<?php

function related_posts_by_tags( $atts ) {
    $atts = shortcode_atts( array(
        'count' => 3,
    ), $atts, 'related_posts_by_tags' );

    global $post;
    $tags = wp_get_post_tags( $post->ID );

    if ( ! empty( $tags ) ) {
        $tag_ids = array();
        foreach ( $tags as $tag ) {
            $tag_ids[] = $tag->term_id;
        }

        $args = array(
            'tag__in' => $tag_ids,
            'post__not_in' => array( $post->ID ),
            'posts_per_page' => $atts['count'],
            'orderby' => 'rand',
        );

        $query = new WP_Query( $args );

        if ( $query->have_posts() ) {
            $output = '<div class="related-posts">';
            $output .= '<h2>Related Posts</h2>';
            $output .= '<ul>';

            while ( $query->have_posts() ) {
                $query->the_post();

                // Beitragsbild
                $thumbnail = get_the_post_thumbnail( $post->ID, 'thumbnail' );
                if ( ! $thumbnail ) {
                    $thumbnail = '<img src="' . get_stylesheet_directory_uri() . '/images/no-thumbnail.jpg" alt="No thumbnail">';
                }

                // Textauszug
                $excerpt = wp_kses_post( get_the_excerpt() );
                if ( ! $excerpt ) {
                    $excerpt = wp_trim_words( wp_kses_post( get_the_content() ), 20 );
                }

                $output .= '<li>';
                $output .= '<a href="' . get_permalink() . '">' . $thumbnail . '</a>';
                $output .= '<div class="related-posts-content">';
                $output .= '<h3><a href="' . get_permalink() . '">' . get_the_title() . '</a></h3>';
                $output .= '<p>' . $excerpt . '</p>';
                $output .= '</div>';
                $output .= '</li>';
            }

            $output .= '</ul>';
            $output .= '</div>';

            wp_reset_postdata();

            return $output;
        }
    }
}
add_shortcode( 'related_posts_by_tags', 'related_posts_by_tags' );

Anschließend musst Du noch „Nur im Frontend der Website ausführen“ anklicken und das Ganze speichern und aktivieren.

Dieser Code produziert den shortcode „related_posts“. Dieser Shortcode wird jetzt per GenerateBlocks am Ende Deines Artikels eingefügt.

Wie das genau geht, erkläre ich am Ende des Artikels unter der Überschrift „Shortcode einfügen“.

Related Posts nach Schlagwörtern und Kategorien einfügen

Bitte installiere das Plugin Code Snippets, falls Du es bis jetzt nicht installiert hast. Du findest es im WordPress-Verzeichnis.

Nach der Aktivierung erscheint in der linken Navigationsleiste der Link „Snippets“. Wenn Du die Maus darüber hältst, dann erscheint ein Auswahlmenü. Dort klickst Du dann auf „Neu hinzufügen“. Dort gibst Du dann einen beliebigen Titel, z. B. „Related Posts per Schlagwort und Kategorie“ an.

In das Feld Code gibst Du folgenden PHP-Code ein:

<?php

function related_posts_func($atts, $post) {
    // Get post tags and categories
    $tags = wp_get_post_terms($post->ID, 'post_tag', array('fields' => 'ids'));
    $categories = wp_get_post_categories($post->ID, array('fields' => 'ids'));

    // Get related posts
    $related_posts = array();
    $related_posts_query = new WP_Query(array(
        'post_type' => 'post',
        'post__not_in' => array($post->ID),
        'posts_per_page' => -1,
        'tax_query' => array(
            'relation' => 'OR',
            array(
                'taxonomy' => 'post_tag',
                'field' => 'term_id',
                'terms' => $tags,
            ),
            array(
                'taxonomy' => 'category',
                'field' => 'term_id',
                'terms' => $categories,
            ),
        ),
    ));
    while($related_posts_query->have_posts()) {
        $related_posts_query->the_post();
        $similarity = similar_text(strtolower($post->post_content), strtolower(get_the_content()), $percent);
        $post_id = get_the_ID();
        if (isset($related_posts[$post_id])) {
            // Update existing post's similarity
            $related_posts[$post_id]['similarity'] = max($related_posts[$post_id]['similarity'], $percent);
        } else {
            // Add new related post to array
            $related_posts[$post_id] = array(
                'id' => $post_id,
                'similarity' => $percent,
            );
        }
    }
    wp_reset_postdata();

    // Sort related posts by similarity
    usort($related_posts, function($a, $b) {
        return $b['similarity'] <=> $a['similarity'];
    });

    // Limit related posts to three
    $related_posts = array_slice($related_posts, 0, 3);

    // Generate output
    $output = '<table style="border: none; width: 100%;" class="related-posts-table"><tr>';
    foreach($related_posts as $related_post) {
        $output .= '<td style="border: none; width: 33%; vertical-align: top;">';
        $output .= '<h3><a href="' . get_permalink($related_post['id']) . '">' . get_the_title($related_post['id']) . '</a></h3>';
        if(has_post_thumbnail($related_post['id'])) {
            $output .= '<a href="' . get_permalink($related_post['id']) . '">' . get_the_post_thumbnail($related_post['id'], ) . '</a>';
        }
        $output .= '<p>' . get_the_time(get_option('date_format'), $related_post['id']) . '</p>';
        $output .= '<p>' . wp_kses_post(get_the_excerpt($related_post['id'])) . '</p>';
        $output .= '</td>';
    }
    $output .= '</tr></table>';
    return $output;
}

add_shortcode('related_posts', function($atts) {
    return related_posts_func($atts, get_post());
});

Anschließend musst Du noch „Nur im Frontend der Website ausführen“ anklicken und das Ganze speichern und aktivieren.

Dieser Code produziert den shortcode „related_posts“. Dieser Shortcode wird nun per GenerateBlocks am Ende Deines Artikels eingefügt.

Wie das genau geht, erkläre ich als Nächstes.

Shortcode einfügen

Natürlich kannst Du den oben produzierten Shortcode per Widget einfügen. Das geht natürlich auch, finde ich aber nicht so elegant wie mit GeneratePress und GenerateBlocks.

Insbesondere die Möglichkeit, die Related Posts dort einzufügen, wo man will, macht die Alternative per GenerateBlocks zur besten Alternative. Per Widget ist man da doch ziemlich eingeschränkt. Zusätzlich kommt noch Designmöglichkeit unter GenerateBlocks.

Zuerst gehst Du in den Backend-Bereich, klickst dort auf Design → Elements und anschließend auf „Neues Element hinzufügen“. In dem sich öffnenden Dialog wählst Du Block aus.

Es öffnet sich der Block-Editor mit der Generateblocks-Erweiterung. Das sollte dann so aussehen:

Das Ganze ist in 3 Bereiche aufgeteilt. Ganz links befindet sich die Listenansicht. Dort werden die einzelnen Blöcke und deren Inhalt aufgelistet.

In der Mitte befindet sich im oberen Teil der Block-Editor. Unterhalb befindet sich GenerateBlocks, wo später Einstellungen vorgenommen werden.

Ganz rechts befinden sich die Einstellungen zum jeweiligen Block und zum jeweiligen Element.

Nun klickst Du auf das schwarze Plus-Zeichen, welches sich im oberen Teil des Block-Editors ziemlich rechts befindet.

Dort findest Du schon den Container und klickst ihn an. Sollte der Container nicht direkt auftauchen, dann gib ihn einfach in das Suchfeld ein.

Nachdem Du den Container angeklickt hast, kannst Du ihn direkt an die richtige Stelle setzen. Ich habe hier „after_content“ gewählt.

Als Nächstes kommt die Überschrift. Also klickst Du innerhalb des Containers wieder auf das Plus-Zeichen, sucht Überschrift und klickst diese an.

Ich würde Dir empfehlen, die zweite Überschrift auszuwählen, also die mit dem großen H. Ich habe als Überschrift „Das könnte Dich auch interessieren“ gewählt.

Jetzt klickst Du wieder auf das Plus-Zeichen und suchst nach shortcode und klickst diesen an. Jetzt noch den oben produzierten shortcode einfügen und dann sollte das Ganze ungefähr so aussehen:

Hier habe ich den Container-Block entsprechend mit den auf der rechten Seite zur Verfügung stehenden Möglichkeiten auf das von mir gewünschte Design abgeändert. Wie Du siehst, hast Du hier sehr viele Designelemente. Spiele ruhig ein wenig herum und suche das für Dich passende Design aus. Beachte aber, dass es auch in das Design Deines Themes passt.

Abschließend müssen noch die Anzeigeregeln eingegeben werden.

Wenn Du das ganze nun noch sicherst, dann sollte unter Deinen Beiträgen die entsprechenden Related Posts erscheinen.