Was ich in Teil 1 schon angedeutet habe, soll nun in diesem Beitrag umfassend erklärt werden. Wie integriert man Facebook-Shares inklusive Anzahl der Likes und Shares ohne die üblichen Buttons zu nutzen? Im Prinzip ist das recht einfach – wenn man mit PHP nicht auf Kriegsfuß steht. Mal in der Developer-Abteilung bei Facebook reinschauen kann auch nicht schaden. Und wenn man noch nützliche Tipps von Andi und eine mehr als helfende Hand von Thorsten auf dem Silbertablett gereicht bekommt, dann ist der Drops gelutscht!

Facebook Shares aufhübschen – mit einer Menge PHP

Im Prinzip ist das alles kein Hexenwerk. Den folgenden Code fügt ihr in eure wahrscheinlich bereits vorhandene functions.php ein. Die Nutzer des Thesis Frameworks bemühen wie üblich die custom_functions.php.

// get Facebook shares
// call function in wordpress with default values
// echo getFBCount(get_the_ID(), 'share', 24);
// possible $counter values: share, like, comment, total, click
// $cachetime: time to cache the data in hours
function getFBCount($postid, $counter = 'share', $cachetime = 24) {
	// check if $postid and $cachetime is int
	if (!is_int($postid) || !is_int($cachetime) || $cachetime < 1) {
		return 'values are not numeric';
	}

	// get permalink with postid
	$link = get_permalink($postid);
	
	// create post_meta name
	$countername = sprintf("_fbcount%s", $counter);
	
	// get cached data, if available
	$cacheddata = get_post_meta($postid, $countername, true);
	
	// if no cached data available or data is older than 24 hours, refresh/get data from Facebook
	if(!empty($cacheddata) && $cacheddata['timestamp'] + (60 * 60 * $cachetime) > time() ) {
		$count = $cacheddata['count'];
	} else {
		$url = sprintf("http://api.facebook.com/restserver.php?method=links.getStats&urls=%s", $link);
		$request = new WP_Http;
		$result = $request->request($url);

		$xml = simplexml_load_string($result['body']);

		switch($counter) {
			case 'share':
				$count = (int)$xml->link_stat->share_count; 
				break;
			case 'like':
				$count = (int)$xml->link_stat->like_count; 
				break;
			case 'comment':
				$count = (int)$xml->link_stat->comment_count; 
				break;
			case 'total':
				$count = (int)$xml->link_stat->total_count; 
				break;
			case 'click':
				$count = (int)$xml->link_stat->click_count; 
				break;
			default:
				return 'not existing counter specified';
				break;
		}	

		if($count !== '' && is_int($count)) {
			$metadata = array();
			$metadata['timestamp'] = time();
			$metadata['count']      = $count; 
			update_post_meta($postid, $countername, $metadata);
		}
	}
		
	return $count;
}

Bevor wir jetzt weiter darauf eingehen, folgt erst ein kurzer Ausflug zurück in die Developer Abteilung bei Facebook, die uns recht weit unten auf der Seite erklärt, wie der Textlink des Shares auszusehen hat – nämlich so:

http://www.facebook.com/sharer.php?u=<url to share>&t=<title of content>

Letztendlich muss das für uns WordPress-User dann folgendermaßen aussehen, damit es mit der Sharererei klappt:

<a href="http://www.facebook.com/sharer.php?u=<?php urlencode(the_permalink()); ?>&amp;t=<?php urlencode(get_the_title()); ?>">Shares</a>

Wem der Link ohne die Anzahl der Shares reicht, muss nur die Zeile einfügen. Aber hey – wer will das schon? Wir wollen doch schließlich sehen, wie beliebt der Beitrag ist. Kommen wir also zurück zu dem obigen Code-Gewusel und dem Output, den es liefern soll.

Nachdem der Code in die functions.php integriert wurde, kann die Funktion im Theme wie folgt aufgerufen werden (hier mit Default-Values):

<?php echo getFBCount(get_the_ID(), 'share', 24); ?>

Dort, wo jetzt ‘share’ eingetragen ist, kannt man bestimmen, was bei Facebook abgerufen wird. Mögliche Werte sind share, like, comment, total, click. Also alles, was die API von Facebook hergibt (mehr dazu auch hier).

Der letzte Wert gibt die Cachetime in Stunden an. Default sind 24, kann aber auch niedriger gesetzt werden. Ich habe ihn derzeit auf 1 stehen, also werden jede Stunde die Werte mit denen auf Facebook abgeglichen. Warum das Caching? Nun, Facebook begrenzt die Abfragen pro Tag und außerdem kostet das Abrufen Zeit.

Jetzt müsst ihr nur noch die Ausgabe des Wertes und den Share-Link zusammenfügen und anschließend das Ganze mittels CSS entsprechend stylen. Dann war es das schon. Fragen?

  • http://mynicki.net Nicki

    Ganz ein alter Hut – aber du lutscht ja bestimmt einen richtig große Drops ;). Spaß beiseite – schön, dass du die Thematik hier so ausführlich ansprichst und Lösungen anbietest. Das hättest du schon vor einigen Monaten tun können, oder war ich da etwa viel schneller? *hehe*

    • http://www.admartinator.de ad

      Irgendwann ist immer einer schneller. In seltenen Fällen auch du. :twisted:

      Spaß beiseite. Haste gut gemacht. Hättest ja mal vorher was sagen können. Lurch!

      • http://mynicki.net Nicki

        Mein tiefstes Mitleid – erst musst du dich mit dem Thesis-Kram rumschlagen und dann auch noch viel zu spät. Hauptsache du kommst damit klar … alter S*** :)

  • http://www.tekshrek.de/ Frank

    Vielen Dank für den Lösungsansatz.
    Nur als Laien wie ich einer bin – bleiben einige Antworten offen, deren Suche nach einer Löung in aussichtslosen Versuchen enden werden:
    1.) Zitat: “Wem der Link ohne die Anzahl der Shares reicht, muss nur die Zeile einfügen.” – Wo einfügen?
    2.) Zitat: “… kann die Funktion im Theme wie folgt aufgerufen werden” – Wie genau soll das gehen? Wo muss ich das einfügen, dass etwas aufgerufen wird? Oder doch die Theme-Dateien ändern? Gestern sagtest du noch: “nur custom_functions.php und custom.css”.
    3.) Zitat: “Jetzt müsst ihr nur noch die Ausgabe des Wertes und den Share-Link zusammenfügen” – auch eine tolle Idee – nur eben wie?

    Ich will nix kritisieren – ist ja dein Blog hier – aber nur so als Anregung: Etwas konkreter und ausführlicher – wäre äußerst hilfreich, denn es erspart den Nachahmern eine Menge Zeit und womöglich sogar einen Misserfolg.

    • http://www.admartinator.de ad

      Frank, ich will hier keine Thesis spezifische Anleitung posten. Wie du das dort einbaust, hängt zudem davon ab, wo genau du es hinhaben möchtest. Woher soll ich das wissen?

      Ich empfehle dir, dass du dir das Thesis Open Hook Plugin installierst, sofern nicht schon längst geschehen. Dort kannst du dann den Code an die gewünschte Stelle einfügen.

      Für einen Überblick über die Hooks schau hier vorbei.

  • http://www.trickbrettfahrer.de André Schörnig

    Hei Ho! Vielen Dank. Jetzt hab ich’s endlich hinbekommen. Bin aber auch manchmal a bisserl blöd. Keine Ahnung vom programmieren…!

  • http://www.pulverpara.de toellby

    Interessant. Das Thesis scheint wirklich umfangreich zu sein. Ich habs ja auch drauf aber komme leider nicht dazu, mich in der Form drum zu kümmern wie ich möchte, zumal mir auch teilweise einfach die Kenntnisse fehlen…
    Ich werd am Wochenende mal versuchen mich einzulesen…

    btw, sag mal, wie heisst das Plugin, dass ich auf Kommentare direkt antworten kann?

    • http://www.admartinator.de ad

      Das ist kein Plugin, sondern eine Funktion von WordPress! ;)

      Einstellungen > Diskussion > Weitere Kommentareinstellungen

      “Verschachtelte Kommentare in (x) Ebenen organisieren”

      • http://www.pulverpara.de toellby

        Guck. Und schon wieder was gelernt.

        Willst Du nochmal bauen? Wenn ja, frag mich wenn Du was wissen willst… ;)

  • http://www.tekshrek.de/ Frank

    Seit WP 3.1 und jetzt auch WP 3.1.1 erscheint beim Blättern der Hauptseite Rückwärts (klar was ich meine?) hin und wieder ein Fatal-Error für diese Zeile (bei dir 29): ‘ $xml = simplexml_load_string($result['body']);’

    Falls du da einen Plan dazu hast – wäre toll. Ansonsten beobachte ich das mal weiter.
    Der Fehler erscheint auch nicht immer. Äußerst seltsam.

  • David Lampe

    Kurze Frage, kann ich auch einen Text Link für “Gefällt mir” haben? Finde da keinen passenden Link, dass ist alles iframe Quatsch bei der Facebook Seite…

    • http://www.admartinator.de ad

      Meines Wissens gibt es dafür leider keinen Textlink.

      Falls du doch einen findest – sag Bescheid. ;)

  • http://redparkz.de redparkz

    Muss mal kurz ein Danke hier reinwerfen. Habe die Vorlage hier verwendet, um die Stats über die WordPress Stats-API auszulesen und im Index für jeden Artikel auszugeben. Musste zwar ein wenig rumspielen, da wordpress csv ausgibt (xml ist zwar im Angebot, scheint aber fehlerbelastet zu sein) aber nun geht es. Besten Dank für die beiden Social Dingens Beiträge :)

  • Mike

    das gleiche bitte für Twitter ;)

  • http://www.bentech.de Ben

    Gut erklärt, aber empfehlen kann ich es nicht, da es recht lastig ist.
    Ich hatte es eingebaut und die Seite hatte beim Laden mindestens 3 Sekunden Verzögerung und zudem auch einen Abstieg im Speed Rank von Google.

    Danke

    • http://www.admartinator.de ad

      Kann eigentlich nicht sein, da Caching verwendet wird…

  • http://www.stellavie.com Steffen

    Aus vielen Gründen eine schöne Sache, die Buttons manuell einzubinden! Habe mich nach oben beschriebener Variante mal an eine leicht andere Einbindung ohne die ‘alte’ fb-API gemacht und graph.facebook.com genutzt, in etwas wie hier beschrieben http://t.co/vLcdB9tu

    Leider läuft es bei uns nur lokal auf localhost (via mamp) richtig erfolgreich. Erst einmal online, geben Facebook + Twitter immer “0” zurück, Google liefert die richtigen Ergebnisse…

    Eventuell irgendeine Idee, woran das liegen könnte?

    Dankschön + LG!

    • http://www.stellavie.com Steffen

      Hat sich erledigt – unser Hosting-Service untersagt fopen() und file_get_contents(). Stattdessen hat es aber nach Umschreiben der Funktion + mittels cURL gut hingehauen.