Geld verdienen mit Social Media
Geld verdienen mit TextenFacebook versucht natürlich von sich aus, die verlinkte Seite so gut wie möglich darzustellen. Dazu „besucht“ Facebook die Seite und sammelt sich die relevanten Daten. Dazu gehören der Titel der Seite, das Bild und natürlich auch ein Auszug des Textes.
So intelligent Facebook auch sein mag, manchmal geht das in die Hose. Deshalb hat Facebook mit speziellen OpenGraph MetaTags eine Möglichkeit geschaffen den besuchenden Bot zu steuern. Die MetaTags selber sind recht einfach und leicht zu integrieren.
Es gibt zwei Möglichkeiten, die Facebook OpenGraph Metatags in WordPress einzufügen. Zum Einen kann man selber in das Theme eingreifen und zum Anderen einfach ein Plugin installieren. Ich beginne mal mit dem Plugin.
Facebook MetaTags via Plugin einfügen
Das Plugin für Facebook MetaTags ist von Shailan geschrieben worden und befindet sich auch im WordPress Plugin Verzeichnis. Da es dort schon recht gut erklärt ist, spare ich mir hier auf die einzelnen Funktionen einzugehen und verweise einfach auf die beiden Seiten.
Facebook Metatags Plugin bei WordPress
Facebook Metatags Plugin Autorenseite
Ich denke damit kommt jeder klar, und ich muss nicht mehr erklären, wie man ein Plugin installiert. Gehen wir also zum nächsten Schritt: Den Eingriff ins Template.
Facebook MetaTags via Template einfügen
Grundsätzlich ist es ja kein Problem mit Hilfe der WordPress Filter und Actions eine Funktion zu schreiben, mit der die Facebook MetaTags in das Template eingefügt werden können. Folgende Funktion verwende ich in meinem Thesis Theme:
$blogverdiener_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large');
?>
<meta property="og:title" content="<?php the_title(); ?>" />
<meta property="og:url" content="<?php the_permalink(); ?>" />
<meta property="og:site_name" content="<?php bloginfo('name'); ?>" />
<meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />
<meta property="fb:app_id" content="APP ID HIER">
<meta property="fb:admins" content="DEINE FB USER ID (ODER USERNAME) HIER"/>
<meta property="og:image" content="<?php echo $blogverdiener_image_url[0] ?>"/>
<?php }
add_action('wp_head', 'blogverdiener_opengraph');
Diese Funktion schreibt man einfach in die functions.php des WordPress Blogs. Wer das Thesis Theme nutzt schreibt die Funktion natürlich in die custom_functions.php hinein.
Eine kleine Erweiterung für alle, die nicht immer ein Bild in ihre Posts einbauen. Es ist möglich auch ein „Default“ Image einzubinden. Dazu ändert man einfach den Bild Link und übergibt eine Variable:
$default_image="http://example.com/image.jpg"; //Hier das Default Bild einbauen – Logo oder Bild aus der Media-Bibleothek
echo '<meta property="og:image" content="' . $default_image . '"/>';
}
else{
$thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );
echo '<meta property="og:image" content="' . esc_attr( $thumbnail_src[0] ) . '"/>';
}
echo "\n";
Mit dieser einfachen Schleife wird abgefragt ob ein Post Bild vorhanden ist. Falls nicht, soll ein Default Bild ausgegeben werden. Das wird dann automatisch in die OpenGraph MetaTags geschrieben.
Warum die Ausgabe via OpenGraph MetaTags steuern?
Wie schon gesagt, findet Facebook nicht immer die richtigen Zusammenhänge. Wenn man sich aber viel Mühe mit den Beiträgen gibt und dann feststellt, dass die Bilder nicht stimmen, oder schlimmstenfalls der Excerpt etwas völlig anderes ausgibt als er soll, dann kann das durchaus ärgerlich sein, und erfordert wieder Arbeitszeit für die Korrektur.
Facebook zu sagen, was es darstellen soll, ist also eine Arbeitserleichterung für beide Seiten. Ich weiß sicher, dass immer alles richtig ausgelesen wird, und Facebook bekommt die Ausgabe auf dem Silbertablett serviert. Besser geht’s nicht.
Code oder Plugin?
Ein Plugin macht die Arbeit leichter, aber direkt im Template zu coden ist schneller und spart Ressourcen. Es werden sicherlich noch viele nützliche Erweiterungen kommen. Und mehr Services, die in den Blog integriert werden möchten.
Ich persönlich ziehe daher immer vor, solche Dinge im Template zu erledigen, denn dann kann ich nötigenfalls auch Korrekturen daran vornehmen ohne erst im Plugin arbeiten zu müssen, was beim nächsten Update wieder hinfällig wäre. Und die Facebook OpenGraph Metatags werden sicherlich auch noch erweitert. So könnte ich mir vorstellen, dass Facebook demnächst Videos besser einbindet und Bilder Galerien zulässt. Dann sind das bei mir ein paar Zeilen Code, alle anderen müssen auf ein Ugrade des Plugins warten.
Facebook OpenGraph MetaTags – Fazit
Die richtige Darstellung der eigenen Blogartikel auf Facebook kann man mit Hilfe der Facebook OpenGraph MetaTags steuern. Diese Möglichkeit spart Arbeit und Ärger, wenn mal etwas falsch dargestellt wird.
Ich hoffe das ich euch mit dem Artikel ein wenig weiterhelfen konnte. Viel Spaß beim einbauen! Übrigens – wem diese Facebook Open Graph Metatags noch nicht ausreichen, der kann sich hier die volle Breite der Möglichkeiten anschauen!
9 einfache Vorlagen für DIE „Hammer“ Überschrift
Google Algorithmus endlich entschlüsselt – 120 Faktoren aufgedeckt
Facebook Geld verdienen 30 Tage Test – Tag 25
Tipps für bessere Blogkommentare
Wie plane ich eine Fallstudie? Aufbau von Case Studys
Ich schreibe hier mit Leib und Seele über das Geld verdienen im Internet, das Thesis Theme für Wordpress und alles was mich weiter interessiert.
Sascha hat bisher 522 Artikel geschrieben.
{ 8 comments… read them below or add one }
Hallo!
Sehr gut erklärt. Werde ich bei mir versuchen – ohne Plugin versteht sich. Gibt es so etwas auch für Google+ ?
Ha, wo bekomme ich denn die App ID her?
@Luigi, entschuldige hab ich glatt vergessen. Reiche ich morgen in einem anderen Artikel nach. Wers nicht erwarten kann: Facebook Developer Center, da bekommt man die APP ID
Also ich hatte auch schon oft Probleme mit Facebook, dass einfach das Bild nicht richtig angezeigt wurde. Ich werde auf jeden Fall mal deine Methode gleich mal testen.
Hallo Sascha,
danke für den informativen Artikel. Da ich mich derzeit selbst ein wenig mit Wordpress beschäftige ist diese Information sehr wichtig.
Mit freundlichen Grüßen
Freut mich, wenn es Dir hilft.
LG
Erst einmal vielen Dank für das Tutorial.
Leider funktioniert es bei mir aber nicht denn ich bekomme einfach keine Beschreibung des Posts zustande. Titel und Titelbild sowie url des Artikels werden angezeigt aber anstatt dem Text im Artikel bekomme ich folgendes:
Du kannst folgende HTML-Tags benutzen:
Was mache ich falsch?
Hallo Karsten,
ohne Einblick in Deine Einstellungen lässt sich das schwer sagen, aber ich vermute einfach mal, dass Du keinen Excerpt nutzt. Dieser Auszug aus dem Artikel ist Bestandteil der Funktion. Vielleicht schickst Du mir einen Link? Gerne auch per Email. Ein Angabe des Themes wäre auch nicht verkehrt. Vorher einfach mal versuchen den “Auszug” des Artikel mit ein paar Sätzen zu füllen, vielleicht liegt es daran.
LG
Sascha