Hinzufügen von mit WordPress verknüpften Posts ohne Plugins

Einer der großen Vorteile der Verwendung von WordPress sind die Plugins. WordPress-Plugins decken fast alles ab, was Sie sich vorstellen können, von der Erweiterung Ihres Blogs in ein CMS über das Hinzufügen nützlicher Funktionen bis hin zur Optimierung Ihres Blogs für Suchmaschinen. Die Möglichkeiten sind endlos (und lassen Sie uns nicht die verschiedenen Themen vergessen)..

Wenn Sie jedoch zu viele Plug-Ins verwenden, besteht die Gefahr, dass Sie Ihren WordPress-Blog verstopfen, und im schlimmsten Fall "brechen" Sie ihn möglicherweise. Es gibt viele Instanzen von Plugins, die nicht miteinander kompatibel sind, sowie Plugins, die Ihr Blog verlangsamen.

Einige der beliebtesten WordPress-Plugin-Kategorien basieren auf dem Hinzufügen “zusammenhängende Posts” zu einem Blog. Da WordPress dafür keinen Standard hat, muss jeder eine Art Plugin verwenden, um verwandte Beiträge auf ihrer Website anzuzeigen.

In diesem Artikel erfahren Sie, wie Sie verwandte Beiträge mit Thumbnails zu Ihrem Blog hinzufügen, ohne dass Plugins verwendet werden müssen. So bleibt alles einfach, leicht und zugänglich. Lass uns anfangen!

Aber zuerst, Warum Plugins vermeiden?

Es gibt eine Reihe von Gründen, warum Sie immer versuchen sollten, den integrierten Code und die Dienste von WordPress anstelle eines Plugins zu verwenden. Der Hauptvorteil ist, dass Sie sich nicht auf einen Dritten (den Plugin-Entwickler) verlassen müssen, damit Ihr Blog funktioniert. Es gibt viele Fälle, in denen beliebte Plugins von ihren Entwicklern aufgegeben werden, sodass unzählige Websitebesitzer mit veralteter und möglicherweise anfälliger Software zurückbleiben.

Ein weiterer Grund ist, dass Sie nicht das Risiko eingehen, ein aufgeblähtes Plugin zu verwenden, das Ihre Site verlangsamen kann oder, was noch schlimmer ist, bösartigen Code enthält, obwohl dies selten ist, vorausgesetzt, Sie erhalten Ihre Plugins aus dem offiziellen WordPress-Verzeichnis.

Erste Schritte: Verwandte Beiträge mit Miniaturansichten

Diese "verwandte Beiträge" -Funktion ist wie die meisten anderen darauf ausgelegt, auf Ihrer Hauptartikelseite (single.php) platziert zu werden. Sie können sie jedoch fast überall verwenden, sofern Sie sie innerhalb der WordPress-Schleife behalten. Um die zugehörigen Posts zu erhalten, verwenden wir die Post-Tags, die den einzelnen Artikeln zugewiesen werden.

Thumbnails

WordPress verfügt jetzt über ein integriertes Thumbnail-System, das wir hier benötigen. Um es zu aktivieren, fügen Sie diesen Code zu Ihrer Datei "functions.php" in Ihrem Designordner hinzu (in den meisten Fällen ist er bereits vorhanden)..

 add_theme_support ('post-thumbnails');

Sie können auch die Breite und Höhe der Miniaturen festlegen, indem Sie dem Code eine weitere Zeile hinzufügen:

 add_theme_support ('post-thumbnails'); set_post_thumbnail_size (100, 50, wahr);

Wichtig: Um Bilder zu Beiträgen hinzuzufügen, müssen Sie zum Erstellen einer Miniaturansicht im Bildupload-Fenster auswählen “Als gekennzeichnetes Bild verwenden”. Dadurch wird die Miniaturansicht für den Beitrag erstellt.

Der Code

  Zusammenhängende Posts
 ICH WÜRDE); if ($ tags) $ tag_ids = array (); foreach ($ tags as $ individual_tag) $ tag_ids [] = $ individual_tag-> term_id; $ args = array ('tag__in' => $ tag_ids, 'post__not_in' => array ($ post-> ID), 'posts_per_page' => 4, // Anzahl der zugehörigen Posts, die angezeigt werden sollen. 'caller_get_posts' => 1) ; $ my_query = new wp_query ($ args); while ($ my_query-> have_posts ()) $ my_query-> the_post (); ?>

Das Stück Code the_post_thumbnail (Array (150, 100)) Legt die Größe der Miniaturansicht fest, die angezeigt wird, in diesem Fall 150px Breite, 100px Höhe.

Das CSS

Wir haben hier zwei Divs-Klassen, “.zusammenhängende Posts”, Welches ist der gesamte div-Container, und “.verwandtethumb” Dies ist das individuelle Miniaturbild und der Link innerhalb der .relatedposts. Wir gehen davon aus, dass die Breite des Pfostens der Standard 640px ist. Das CSS:

 .Relatedposts width: 640px; Marge: 0 0 20px 0; Schwimmer: links; Schriftgröße: 12px; .relatedposts h3 Schriftgröße: 20px; Marge: 0 0 5px 0;  .relatedthumb margin: 0 1px 0 1px; Schwimmer: links;  .relatedthumb img margin: 0 0 3px 0; Auffüllen: 0; .relatedthumb a color: # 333; Textdekoration: keine; Bildschirmsperre; Polsterung: 4px; width: 150px; .relatedthumb a: hover Hintergrundfarbe: #ddd; Farbe: # 000;

Das obige CSS rendert die Miniaturbilder des Postens mit einer Breite von 150px, was bedeutet, dass wir 4 Miniaturbilder benötigen, um die Breite des Posts von 640 Pixeln zu füllen (einschließlich des Randes dazwischen). Sie können dies nach Ihren Wünschen einstellen. Wenn Sie 5 Miniaturbilder wünschen, benötigen Sie eine Breite von ca. 125px.

Wichtig: Stellen Sie sicher, dass Sie die Breite der in Ihren WordPress-Medieneinstellungen generierten Miniaturen so einstellen, dass sie den in CSS eingestellten entsprechen. Außerdem muss es der im PHP-Code angegebenen Größe entsprechen: the_post_thumbnail (Array (150, 100)).

Beispiel

Die zugehörigen Beiträge sollten in etwa so aussehen, wie sie vom Spiele-Blog DigitalBattle verwendet werden (das die in diesem Artikel beschriebene genaue Technik verwendet):

Schlussfolgerungen

Wir können mit den integrierten Funktionen von WordPress viel tun, und in vielen Fällen müssen wir nicht auf Plugins von Drittanbietern zurückgreifen, um die Arbeit zu erledigen. Wenn Sie das nächste Mal ein Plugin für Ihren WordPress-Blog benötigen, prüfen Sie, ob Sie dieselbe Funktion ohne das Plugin erreichen können. Suchen Sie im Web nach einer Alternative. Sie werden überrascht sein, wie viel mit WordPress aus der Box möglich ist.