{"id":157,"date":"2014-08-29T13:57:05","date_gmt":"2014-08-29T11:57:05","guid":{"rendered":"http:\/\/staratnight.de\/blog\/?p=157"},"modified":"2018-12-02T23:50:38","modified_gmt":"2018-12-02T21:50:38","slug":"google-beitraege-in-wordpress-einbinden","status":"publish","type":"post","link":"https:\/\/staratnight.de\/blog\/google-beitraege-in-wordpress-einbinden\/","title":{"rendered":"Google+-Beitr\u00e4ge in WordPress einbinden"},"content":{"rendered":"<p>In diesem Blog m\u00f6chte ich ja meine eigenen Erfahrungen niederschreiben, in erster Linie f\u00fcr mich selbst, da ich so vergesslich bin.<\/p>\n<p>Dabei ist mir aufgefallen, dass es manchmal Dinge gibt, die einfach zu kurz f\u00fcr einen Blog-Artikel sind. Da m\u00f6chte ich z.B. auf einen Artikel hinweisen oder auf ein spannendes Projekt, mehr als ein kurzer Satz ist das aber nicht.<\/p>\n<p>Ich habe mich dann sehr schnell dazu entschieden, diese Short-Messages \u00fcber meinen Google+-Account zu ver\u00f6ffentlichen.<\/p>\n<p>Ich habe nun schon seit fast 5 Tagen nach einer L\u00f6sung daf\u00fcr gesucht, wie ich meine Google+ Beitr\u00e4ge hier im Blog anzeigen lassen kann. Leider bislang ohne Erfolg. Das vielversprechendste, was ich gefunden habe war <strong>http:\/\/widgetsplus.com\/<\/strong><\/p>\n<p>Hier kann man in einer sch\u00f6nen, leicht zu bedienenden Oberfl\u00e4che ein Widget konfigurieren und als iFrame einbinden. Hierbei hatte ich aber zwei Probleme:<\/p>\n<ol>\n<li>auch nach mehrfachen Versuchen habe ich es nicht geschafft, dass das Widget meine Beitr\u00e4ge anzeigt. Es l\u00e4sst sich zwar entsprechend konfigurieren, die Liste in meinem eingebundenen iFrame war aber immer leer<\/li>\n<li>Ich habe im eingebundenen Code einen Verweis auf Google Analytics gefunden. Da ich nicht vor habe, mir f\u00fcr diesen Blog einen Anwalt zu nehmen, m\u00f6chte ich das gerne nicht verwenden.<\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<p>Also blieb mir nur noch die M\u00f6glichkeit, es selbst zu machen. Es war leichter, als ich gedacht habe. Das Ergebnis ist rechts in der Widget-Leiste zu sehen.<\/p>\n<h2><\/h2>\n<h2>Was braucht man?<\/h2>\n<p>Die Liste der Dinge die man ben\u00f6tigt ist recht \u00fcberschaubar, wenn man seinen Blog selbst hostet:<\/p>\n<ul>\n<li>PHP mit aktiviertem JSON<\/li>\n<li>einen Google Developer Account<\/li>\n<li>Einen public key<\/li>\n<li>Ein wenig PHP-Code<\/li>\n<li>Ein bisschen HTML und CSS<\/li>\n<\/ul>\n<p><!--more--><\/p>\n<p>Zun\u00e4chst muss man bei Google ein<strong> Developer Projekt<\/strong> erstellen. Jeder, der Google+-Beitr\u00e4ge anzeigen lassen will, hat ja mindestens einen Google-Account. Unter https:\/\/console.developers.google.com\/project kann ein solches Projekt erstellt werden.<\/p>\n<p>Anschlie\u00dfend muss unter &#8222;APIs &amp; auth&#8220; -&gt; APIs die <strong>Google+-API aktiviert<\/strong> werden (ich habe bei der Gelegenheit alle anderen APIs, die ausgew\u00e4hlt sind, gleich deaktiviert.<\/p>\n<p>Nun braucht man noch einen <strong>Public API access Schl\u00fcssel<\/strong>. Den erh\u00e4lt man unter &#8222;APIs &amp; auth&#8220; -&gt; Credentials. Dort im Bereich &#8222;Public Access API&#8220; einfach auf &#8222;Create new Key&#8220; klicken und ggf. noch die IP-Adresse eintragen, von der der Zugriff erfolgt (ist aber nicht erforderlich).<\/p>\n<p>Als n\u00e4chstes holt man sich die <strong><a href=\"https:\/\/developers.google.com\/api-client-library\/php\/start\/installation\" target=\"_blank\" rel=\"noopener\">Google APIs Client Library for PHP<\/a><\/strong>. Ich habe dazu Git verwendet, auf GitHub gibt es aber auch ein <a href=\"https:\/\/github.com\/google\/google-api-php-client\" target=\"_blank\" rel=\"noopener\">passendes ZIP<\/a> zum Download.<\/p>\n<p>&nbsp;<\/p>\n<h2>Wie wird es eingebunden?<\/h2>\n<p>Nun muss man nur noch die API im eigenen PHP-Code verwenden.<\/p>\n<p>Zun\u00e4chst binden wir die notwendigen API-Klassen von Google ein. Wir brauchen den Client f\u00fcr die Verbindung und die Plus-API selbst:<\/p>\n<pre class=\"lang:php decode:true\">include_once \"Google\/Client.php\";\r\ninclude_once \"Google\/Service\/Plus.php\";<\/pre>\n<p>Haben wir beides, k\u00f6nnen wir die den Client initialisieren und die Plus-API erstellen. Dabei verwenden wir f\u00fcr den Client den oben erstellten Public API access Schl\u00fcssel.<\/p>\n<pre class=\"lang:php decode:true\">$client = new Google_Client();\r\n$client-&gt;setApplicationName(\"Google Plus Widget\");\r\n$client-&gt;setDeveloperKey(\"[Public_API_access_key]\");\r\n\r\n$plusService = new Google_Service_Plus($client);\r\n<\/pre>\n<p>Soweit so gut, nun k\u00f6nnen wir auf die API zugreifen und die Beitr\u00e4ge von unserem Google+ Account auslesen. Hierzu wird die eigene Google+-ID ben\u00f6tigt. Die ist in der URL zu finden, wenn wir uns auf unserem eigenen Google+-Account die Beitr\u00e4ge anzeigen lassen:<\/p>\n<p>https:\/\/plus.google.com\/<em>[Google_plus_ID]<\/em>\/posts<\/p>\n<p>Beitr\u00e4ge sind in der API unter der Bezeichnung &#8222;Activities&#8220; versteckt:<\/p>\n<pre class=\"lang:php decode:true\">$activityResource = $plusService-&gt;activities-&gt;listActivities(\"[Google_plus_ID]\", \"public\");\r\n<\/pre>\n<p>Haben wir nun also die Liste mit den Activity-Objekten, k\u00f6nnen wir unsere Beitr\u00e4ge daraus auslesen:<\/p>\n<pre class=\"lang:php decode:true\">if($item-&gt;object-&gt;objectType == \"note\") {\r\n    $lastUpdated = new DateTime($item-&gt;updated);\r\n    $postContent = $item-&gt;object-&gt;content;\r\n    $postPlusOners = $item-&gt;object-&gt;plusoners-&gt;totalItems;\r\n    $postReplies = $item-&gt;object-&gt;replies-&gt;totalItems;\r\n    $postShares = $item-&gt;object-&gt;resharers-&gt;totalItems;\r\n    $postURL = $item-&gt;object-&gt;url;\r\n}<\/pre>\n<p>Nun muss man das alles nur noch sch\u00f6n in HTML und CSS einbetten und per iFrame in das WordPress Widget packen.<\/p>\n<p>&nbsp;<\/p>\n<h2>Weitere Infos<\/h2>\n<p>Mit der API kann man noch mehr machen. Details dazu sind hier zu finden: https:\/\/developers.google.com\/+\/api\/<\/p>\n<p>Noch ein Tipp: Wenn man im Console Project bei den APIs auf den Namen der API klickt, kommt man zu einer Liste der API-Funktionen. Klickt man diese wiederum an, kommt man zu einem Formular, mit dem man die Funktionen ausf\u00fchren kann. Hier kann man sich dann sch\u00f6n das Ergebnis des Funktionsaufrufs anschauen.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In diesem Blog m\u00f6chte ich ja meine eigenen Erfahrungen niederschreiben, in erster Linie f\u00fcr mich selbst, da ich so vergesslich bin. Dabei ist&hellip;<\/p>\n","protected":false},"author":2,"featured_media":475,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[14,7],"tags":[],"class_list":["post-157","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-php","category-wordpress"],"_links":{"self":[{"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/posts\/157","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/comments?post=157"}],"version-history":[{"count":5,"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/posts\/157\/revisions"}],"predecessor-version":[{"id":476,"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/posts\/157\/revisions\/476"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/media\/475"}],"wp:attachment":[{"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/media?parent=157"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/categories?post=157"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/staratnight.de\/blog\/wp-json\/wp\/v2\/tags?post=157"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}