[WordPress] Automatisch erstes Bild im Artikel für Like-Button wählen

Veröffentlicht am: 16.07.11 | Web  | 8 Kommentare

Facebook Like-Button und WordPress

Heute möchte ich euch einen kurzen, aber vor allem für Blogger bestimmt interessanten Artikel zum Thema Facebook Like-Button und WordPress mit euch teilen.

Via Google kam ich zum Blog Prometeo, welcher die Problemlösung für meine Frage bot. Wie ihr bestimmt schon bemerkt habt, habe ich unter meinen Beiträgen einen Like-Button von Facebook eingebunden. Wenn man diesen bisher anklickte, erschien auf dem Profil oder im Homestream von Facebook ein entsprechender Vermerk mit einem Bild, das gar nichts mit dem Artikel zu tun hatte, sondern nur ein Button auf dieser Seite war.

Ich wollte jedoch, dass jeweils automatisch das Bild ausgewählt wird und auf Facebook angezeigt wird. Ich wollte dazu nicht immer ein Bild definieren, das dann dort erscheint, sondern ebend as erste Bild des Beitrages und sonst das Logo meines Blogs.

Wenig Code, viel Spass

Im besagten Artikel von Prometeo habe ich also zwei Codeschnipsel gefunden, die genau dies erledigen:

In die functions.php eures aktuellen Themes diesen Code einfügen:

function catch_that_image() {
	global $post, $posts;
	$first_img = '';
	ob_start();
	ob_end_clean();
	$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
	$first_img = $matches [1] [0];

	if(empty($first_img)){
		$first_img = "/images/default.jpg"; // default image
	}
	return $first_img;
}

Dort, wo als Kommentar «default image» hinten Steht, kann man zwischen die Anführungs- und Schlusszeichen noch den Pfad für ein Standardbild angeben, das verwendet wird, falls sich kein Bild im Artikel befindet.

Die folgende Zeile gehört dann noch in die header.php eures aktuellen Themes in den <header>-Bereich:

<meta property="og:image" content="<?php echo catch_that_image(); ?>" />

Das wars dann schon, man darf glücklich sein und in Zukunft erscheint auf Facebook das erste Bild des Artikels. Ihr dürft es gerne anhand diese Beitrages gleich mal testen und unten auf den Button klicken, denn ich habe den genau gleichen Code hier in meinem Blog-Theme verwendet.

[Update] Für die Bequemen: Als Plugin

Klaeui hat mich in den Kommentaren darauf hingewiesen, dass man die ganze Sache auch mit einem Plugin lösen kann (hier der Link direkt zum Plugin auf WordPress.com). Der Wermutstropfen dabei: Man kann kein ein Standard-Bild definieren, sollte es einmal kein Bild im Artikel haben (EDIT: Ist nun möglich, danke JCFrick).

Tags:          

Sharing is caring!