Eine tolle Möglichkeit deine Leser auf deine neusten Blog-Artikel aufmerksam zu machen, ist eine Liste der neusten Artikel in der Sidebar oder auch im Footer anzuzeigen. Und da es für die Leser noch viel ansprechender ist, wenn du nicht nur die Artikel-Überschriften, sondern auch die entsprechenden Vorschaubilder-Bilder anzeigst, zeige ich dir kurz wie das funktioniert.
1. Die neusten Artikel mit query-posts anzeigen
Um die 5 neusten Artikel deines Blogs anzuzeigen, kannst du folgenden Code verwenden.
<?php query_posts('showposts=5'); ?>
<ul class="recent-posts">
<?php while (have_posts()) : the_post(); ?>
<li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
<?php endwhile;?>
</ul>
Natürlich kannst du noch etliche weitere Einschränkungen für die Sortierung der Artikel machen. Um nur die 5 neusten Artikel einer Kategorie (z.B. der Kategorie: News) anzuzeigen, verwendest du folgenden Code.
<?php query_posts('cat=news&showposts=5'); ?>
<ul class="recent-posts">
<?php while (have_posts()) : the_post(); ?>
<li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
<?php endwhile;?>
</ul>
Im WordPress Codex findest du eine genaue Beschreibung, was du mit query_posts so alles anstellen kannst.
2. Thumbnail-Bilder hinzufügen
Seit der WordPress-Version 2.9 gibt es eine neue, praktische Möglichkeit Thumbnails für deine Artikel zu verwenden. Eine ausführliche Beschreibung, wie du die Thumbnail-Funktion verwendest findest du im Artikel »Using The New Post Thumbnail Feature In WordPress 2.9«.
Um die Thumbnail-Funktion in deinem WordPress-Theme zu aktivieren, musst du folgenden Code in die functions.php Datei deines Themes einfügen.
if ( function_exists( 'add_theme_support' ) ) add_theme_support( 'post-thumbnails' );
Anschließend findest du die neue Option »Beitrags-Miniaturbild« rechts auf der Artikel-Seite im Admin-Bereich. Über »Miniaturbild setzen«, kannst du deinem Artikel ein Thumbnail-Bild hinzufügen.
Um die Thumbnails im WordPress-Loop der index.php und single.php Datei einzufügen, verwendest du jetzt folgenden Code-Schnipsel.
<?php the_post_thumbnail(); ?>
3. Die Thumbnails in der Neusten Artikel-Liste anzeigen
Um die Thumbnails in deiner Neuste Artikel-Auflistung anzuzeigen, erweiterst du Codeaus Schritt 1 um folgende Zeile (Zeile 5 in der Code-Ansicht).
<?php query_posts('cat=news&showposts=5'); ?>
<ul class="recent-posts">
<?php while (have_posts()) : the_post(); ?>
<li>
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(array( 90,90 ), array( 'class' => 'recent-thumbs' )); ?></a>
<a href="<?php the_permalink() ?>"><?php the_title(); ?></a>
</li>
<?php endwhile;?>
</ul>
In meinem Beispiel linke ich vom Thumbnail auf den jeweiligen Artikel, verkleinere die Größe der Thumbnails auf 90×90 Pixel und gebe ihnen die CSS-Class: recent-thumbs. So kann ich meine Neusten Artikel später leichter mit CSS stylen.
Das war’s auch schon, deine neusten Artikel sollten jetzt inklusive Thumbnails angezeigt werden.
Hast du noch Fragen oder Anregungen zu meinem kleinen WordPress-Tutorial? Dann schreibe mir doch einfach einen Kommentar. Ich freue mich auf dein Feedback!
Vielen Dank für diesen tollen Tipp! Ich wusste gar nicht, dass man mit WordPress 2.9 so einfach Thumbnails hinzufügen kann. Ich freue mich schon darauf, diese Funktion auszuprobieren :)
@Barbara: Ja, ich habe das auch erst vor kurzem getestet. Wenn man vor hat, etwa Thumbnail-Bilder zu erstellen finde ich es eine klasse Möglichkeit. Der Artikel den ich im Text erwähnt habe, ist ein super Tutorial :-)
Und auch auf dem WP Engenieer Blog gibt es mehrere ausführliche Artikel zur Thumbnail-Funktion.
Viele Grüße
Ellen
Hallo Ellen,
ich bin bei meinem Problem auf dein Tutorial gestoßen und wollte noch mal kurz etwas nachfragen, bevor ich mich im einzelnen damit auseinandersetze (dauert bei mir immer alles ziemlich lang, weil ich gerade erst anfange mich damit zu beschäftigen).
Mein Problem: Über das App »networked blogs« habe ich meinen WordPress blog auf meine Facebook Fanpage geleitet. Dort erscheint immer dieses Standardvorschaubild vom wordpressblog (das mit dieser Allee). Bei WordPress kann ich das ja anpassen mit einem eigenen header und eigenem Hintergrund. Aber auf Facebook erscheint immer diese nicht zu meiner Seite passende Standardvorschau.
Kann mit dem obigen Tutorial das ändern oder ist das etwas anderes? Und wenn ja, hast du ein Tipp wie ich das sonst ändern könnte?
Liebe Grüße,
Marc
@Marc: Vielen Dank für deinen Kommentar :-) Ich finde es klasse, dass du einen WordPress-Blog hast!
In diesem Artikel geht es nur um eine Auflistung der neusten Blog-Artikel auf dem Blog (genau wie hier auf Elmastudio im Footer). Wenn du die Header-Ansicht auf deinem eigenen Blog schon geändert hast könnte es sein, dass du einfach eine Weile warten musst bis die Ansicht bei »networked blogs” ebenfalls angepasst wird (dann liegt das Problem am Cache).
Da ich den Dienst selbst aber noch nicht ausprobiert habe bin ich nicht 100% sicher, wie das Vorschaubild der Blogs erstellt wird. Ging das automatisch? Hast du schon probiert, dein Account zu löschen, und dich noch einmal neu einzutragen?
Vielleicht könntest du mir kurz Feedback geben, dann kann ich dir vielleicht etwas besser weiterhelfen :-)
Viele Grüße
Ellen
oh Super, ich habe den Ganzen Tag danach gesucht.
Vielen Dank Ellen
Guten Morgen Ellen,
ich habe mich zu früh gefreut ich benutzt WordPress3 und klappt es nicht. Ich muss sagen ich weiß noch nicht mal wo ich den 1. Code einfügen solle… hast du ein Tipp für mich
PS: Sorry wegen meine Rechtschreibung aber mein DE ist noch nicht so weit.
Gruß
@Franzose, vielen Dank für deinen Kommentar :-)
Der Code sollte eigentlich auch für die 3.0 Version funktionieren. Ich verwende den gleichen Code hier auf dem Blog für den Slider im Footer (Aktuelle Artikel).
Einsetzen kannst du den Code z.B. in der Sidebar.php Datei oder in der footer.php Datei. Die Thumbnail-Funktion müsstest du dann noch wie im Punkt 2 beschreiben, aktivieren.
Ich wünsche dir viel Erfolg, falls es immer noch nicht klappt, melde dich einfach noch einmal, ja :-)
Viele Grüße,
Ellen
Hallo Ellen,
Vielen Dank für deine Hilfe.
Ich habe punkt2 auch gemacht.
Ich sehe in Admin Bereich immer noch nichts, ich glaube ich bin zu Doof.
/wp-content/themes/twentyten/function.php, da habe ich punkt2 eingefügt oder muss ich irgendwo in der Admin Verzeichnis einfügen?
Ich bin mehr an Joomla und Typo gewohnt, WordPress ist wirklich ganz neu für mich.
Merci pour ton Aide.
@Franzose, nein, das bist du ganz bestimmt nicht!!! Ich habe es gerade eben im TwentyTen Theme ausprobiert, es ist wichtig, dass du den Code aus Punkt 2 in deiner functions.php ganz unten (als allerletztes) einfügst.
Außerdem hat sich der Text im Abmin-Bereich der Artikel (zumindest in der deutschen WP-Version) zu »Artikelbild« geändert. Ich werde das Bild im Artikel noch anpassen.
Hoffe so klappt es,
Viele Grüße
Ellen
Et voilà Ellen,
ich habe es geschafft, ohne deine Hilfe wäre nicht gegangen.
vielen Dank und schönen Tag
Hi Ellen,
wollte mich nochmal kurz bei dir zurückmelden. Du hattest Recht mit deiner Vermutung, dass ich einfach ein bisschen warten musste, bis das Bild geändert wurde. Gerade als ich meinen Blog gestartet habe, hatten die bei »networked blogs« wohl für ein paar Tage ziemliche Probleme… Aber dann hat es funktioniert:)
Nochmal vielen Dank für deine Hilfe!
Liebe Grüße,
Marc
Super, liebe Ellen. Ich habe mich schon die ganze Zeit gewundert, warum ich bei mir das Feld »Artikelbild« nicht finden konnte. Schon witzig, dass die WP-Entwickler ein neues Feature einbauen, das man dann erst umständlich aktivieren muss.
Doch dank Deiner hervorragenden Anleitung habe sogar ich das geschafft, nachdem ich kapiert hatte, dass der Code in der functions.php vor dem letzten ?> eingefügt werden muss. Vorher hat das andauernd Fehlermeldungen produziert.
Vielen Dank!
Jürgen
Hi
ich bau mir gerade meinen Blog (Theme: 2010) zusammen und versuche auf der Startseite gekürzte Artikel mit kleinem Bild hinzubekommen.
Danke für den tollen Artikel. Zumindest hab ich es jetzt schon mal geschafft, die thumbnail Funktion als solche ausfindig zu machen.
In welcher Datei muss ich denn jetzt die oben unter Punkt 3 gannten Codezeilen einbauen?
LG und Danke
Hansjörg
Danke Ellen,
ich greife das Thema mal im Bezug zum »Wordpress 3.1 - Netzwerk« wieder auf:
Folgendes:
Ein Theme unterstützt die Artikel-Bild-Einbinden«-Funktion. Somit auch die Thumbnail-Ausgabe im Frontend.
Nachdem ich eines unserer WordPress-Blogs für das Netzwerk freigeschaltet hatte, war die Thumbnail-Funktion für Artikelbilder nicht mehr aufrufbar.
Die Funktion, Artikelbilder einzufügen, ist in einem Netzwerk einfach nicht vorhanden.
Habt ihr Ideen oder Ansätze, wie man die »Artikel-Bilder-Einbinden«-Funktion, inklusive Post-Thumbnails auch für Blogs eines Netzwerks bereitstellen kann?
Hatte jemand von euch in der Vergangenheit ähnliches Problem?
Lieben Gruß,
Jonathan
Hallo Ellen,
ich kann ein Artikelbild einfügen, sehe aber im Editor das Bild nicht, auch der Website auch nicht. Welche Codeschnipsel fehlen mir noch?
Viele Grüße
Daniel
Hallo Ellen,
hast mir gerade jede Menge Arbeit mit diesen Snippets erspart. Vielen viele Dank dafür :)
lg
@das_menikin
Hi Ellen,
gibt es denn auch eine Möglichkeit die Ausgabe nur von dem den neuesten Artikel anders zu gestalten? Ich würde gern den neuesten Artikel anders darstellen als die folgenden.
Greetinx Nick
Wie kann ich den nur die artikel mit teaser anzeigen lassen einer Kategorie ?
Gruß
Alex
Danke Ellen,
genau den Beitrag habe ich gesucht! Mit WordPress 3.+ geht das ja ganz einfach, wenn man es findet… Vor lauter Bäumen habe ich den Wald nicht mehr gesehen, und dass stundenlang.…
Jetzt habe ich nur noch eine Frage/Bitte: Kannst du das Tutorial erweitern und uns sagen wie man das »thumbnail« über den Artikel positioniert???
Ich habe es mit der 500×200 Miniaturbild Einstellung probiert und habe dann das Problem dass sich der Artikeltext über die Sidebar schiebt…
Eine Idee?
Vielen Dank! Das ist echt cool! Habe damit mal ein paar Kategorien bestückt!
VG
Daniela
Pingback: andreasbehler.com » Blog Archiv » Zweite Überschrift bei Web Development