Pinterest-Buttons in WordPress und Blogger installieren
4688
post-template-default,single,single-post,postid-4688,single-format-standard,ajax_fade,page_not_loaded,,select-theme-ver-3.2.1,menu-animation-underline,wpb-js-composer js-comp-ver-5.2,vc_responsive

Pinterest: Pin-it-Button und Hover-Button bei WordPress und Blogger installieren

Pinterest: Pin-it-Button und Hover-Button bei WordPress und Blogger installieren

Pinterest gewinnt immer mehr an Einfluss, wenn es darum geht, Traffic für Deine Seite zu bekommen und hat Facebook und Co schon längst abgehängt.  Die Bildersuchmaschine ist DIE Plattform, wenn es darum geht, Inspiration zu finden und zu teilen. In diesem Artikel erkläre ich Dir, wie man den Pin-it-Button für mehr Website-Traffic installiert. 

Pinterest – die Ideen-Suchmaschine

Egal ob Kochrezepte, DIY-Anleitungen oder Wohninspirationen, bei Pinterest findet man einfach alles! Und auch zum Sammeln der eigenen Ideen und Inspirationen sind die Pinboards aus meinem Leben nicht mehr wegzudenken. Wenn ich ein neues Projekt starte oder nicht weiß, was ich kochen soll, zuerst schaue ich bei Pinterest und sammle dann meine Inspirationen auf unterschiedlichen Pinnwänden.  

Und auch das Verwalten von Bookmarks ist doch um einiges einfacher geworden, seitdem es Pinterest gibt. Meist möchte man sich ja nur eine Idee der Website merken und bei klassischen Bookmarks würde man ja nichts mehr wieder finden. Die visuelle Suchmaschine ist da doch um einiges einfacher. 
Und wenn man sich dabei ein bisschen geschickt anstellt, kann Pinterest ein Booster für Deinen Website-Traffic sein. (Tipp: Rich-Pins aktivieren

So sieht ein Pin aus:

Wie funktioniert Pinterest?

Die Pinterest-Pins (= auf dem Pinterest-Profil abgelegtes, gemerktes Bild einer Website) verweisen immer auf die Seite, von der das Bild gepinnt (=gemerkt) wurde.  Pinterest-Benutzer speichern Bilder von Websites in ihren User-Profilen auf unterschiedlichen digitalen, selbst erstellten Pinnwänden ab. Die öffentlichen Profile und digitalen Pinnwände können von anderen Benutzern „abonniert“ werden. Es gibt auch Gruppen-Pinnwände zu Sammelthemen, auf die man gemeinsam Pins speichern kann. Das hilft, die Reichweite der einzelnen Pins zu erhöhen.

Die Bilder werden dann anderen Nutzern mit ähnlichen Interessen angezeigt und können damit auch auf deren Pinnwände gespeichert werden. Somit kann ein beliebter Pin für sehr viel Traffic auf Deinem Blog sorgen.

Um so wichtiger ist es, dass man es dem Leser als Website- oder Blogbetreiber ganz einfach macht, die Pins auf Pinnwände zu speichern. 

Einen älteren Artikel von 2012 (!) zu Pinterest -> hier  und einen Screencast von 2012 findet ihr hier.

 

Welche Möglichkeiten gibt es, Bilder zu pinnen?

Damit das Pinnen möglich ist, muss Pinterest in irgendeiner Form auf diese Website zugreifen können. Am Einfachsten ist es, wenn man Pinterest selbst erlaubt, die Bilder von der Seite zu speichern. Dadurch kann man nämlich auch beeinflussen, welche Bilder gespeichert werden können und damit die Qualität der gepinnten Bilder steuern. Und damit sorgst Du dafür, dass die Pins auch gern weiter gepinnt werden.

Die einfachste Möglichkeit, den Nutzer zum Pinnen der Bilder zu verleiten ist der „Hover-Button.“ Das ist ein kleines Pinterest-Zeichen direkt auf dem Bild. Das kleine Bild erscheint auf vielen Blogs nur, wenn man mit der Maus über das Bild fährt.

Dafür gibt es für WordPress ein Plugin, bei Blogger ist es ein bisschen komplizierter einzubauen, das schaffen wir aber auch gemeinsam :-) 

Zusätzlich würde ich auch noch den „Merken-Button“ am Ende des Blogbeitrages einbauen. Zum Einen ist das die Stelle, an der die meisten Leser aus Gewohnheit erwarten und zum Anderen haben einige den „Hover-Button“ vielleicht nicht wahrgenommen.

 

Unterschiede der einzelnen Buttons

Der „Merken-Button“ pinnt im Besten Fall  das zum Blogartikel eingestellte „Beitragsbild“. Dieses ist auch das Bild, das z.B. bei WordPress in der Übersicht der Blogartikel steht oder in der Vorschau bei Facebook. Unerfahrene Blogbenutzer wissen oft nicht, wie das Beitragsbild richtig eingestellt wird. So kann es passieren, dass das Blog nur irgendein Bild der Artikelseite anbietet, wie z.B. ein Bild aus den Kommentaren, aber kein Bild das in Beziehung zum Blogartikel steht. ( Wie das mit dem Yoast-Plugin geht,erkläre ich hier).

Der Vorteil des „Hover-Buttons“ liegt also auf der Hand: Der Leser kann genau das Bild pinnen, das ihn anspricht und findet es zum Einen besser wieder und zum Anderen werden auch wirklich nur die Bilder gepinnt, die Du auch gern auf Pinterest mit dem Artikel in Verbindung bringen möchtest.

Installation für Blogger weiter unten

Installation bei WordPress

WordPress-Benutzer haben es einfach

Der Vorteil bei WordPress ist eindeutig, dass man mit wenigen Kenntnissen viele Funktionen einbauen kann. So ist es auch mit den Pinterest-Buttons.

Manche WordPress-Benutzer haben es denkbar einfach, denn der Merken-Button ( oder Pin-It-Button wie er früher hieß ) ist bereits im Theme integriert. Er befindet sich dann meist in einer Reihe Social-Media-Buttons unterhalb des Themes.

 

Einbau des „Merken-Buttons“ und des „Hover-Buttons“

Alle anderen können diesen aber auch ganz simpel installieren.

Dafür wechselst Du in das Plugin-Verzeichnis und gibst das Suchwort „Pin-it“ in die Suchmaske ein. Enter drücken.

Dann das entsprechende Plugin auswählen und auf „Installieren“ klicken.

Dann nur noch AKTIVIEREN

Dann in die Plugin-Einstellungen wechseln und folgende Schritte ausführen um die „Merken-Buttons“ auf den richtigen Seiten un Beiträgen zu aktivieren und auch direkt den „Hover-Button“ zu integrieren.

 

Und Fertig. Sowohl der „Merken-Button“ als auch der „Hover-Button“ sind bei WordPress mit wenigen Klicks integriert. Wenn Du nur den „Hover-Button“ installieren möchtest, weil Dein Theme bereits Social-Media Buttons verwendet oder Du ein anderes Plugin verwendest, lässt Du die Häkchen an Punkt 1. einfach weg.

„Merken-Button“

Fertig installierter Button unter dem Artikel.

„Hover-Button“

Fertig installierter „Hover-Button“ , der bei Mouseover auf dem Bild erscheint.

 

Installation bei Blogger

„Merken“-Button

Um die Funktion bei Blogspot einzurichten sind ein paar Schritte mehr erforderlich. Zuerst gehst Du auf die Seite

https://developers.pinterest.com/

gehtst auf Tools und klickst auf den „Widget-Builder“

 

Dann gehst Du in einem neuen Tab in Dein Blogger-Dashboard und rufst den Layout Editor auf. Dann klicke rechts auf  „Gadget hinzufügen“

Ein Popup öffnet sich. Dort scrollst Du nach unten und klickst auf „HTML/ Javascript“

Dann geht ein Feld auf in dem ein Code hineinkopiert werden  kann.

Wechsel nun zurück zum Widget Builder und konfiguriere den Button:
Zuerst den linken Button auswählen und im Dropdown darunter „Jedes Bild“ auswählen.

Dann noch im Feld darunter das Aussehen des Buttons bestimmen und den Code aus dem großen Feld kopieren.

Diesen Code fügst Du nun in dem PopUp bei Blogger ein und speicherst ab. Das Popup schließt sich.

 

Das Gadget befindet sich nun in der rechten Sidebar.

Du kannst es nun mit der Maus anfassen und unter den Artikelbereich ziehen. Abspeichern.

DANN wechselst du in den Bereich „Design“. Jetzt musst Du in den Quellcode des Templates gehen.

Dafür zuerst eine Sicherungskopie oben Rechts machen (2.). Als nächstes auf den HTML-Button klicken (3.)

Wieder zum Widget-Builder wechseln und den zweiten Code aus dem Feld herauskopieren.

Zurück zum HTML-Editor wechseln. Der Code muss am Seitenende VOR dem Wort </BODY> eingefügt werden.

Bei manchen Themes muss man sehr weit scrollen. Kleiner Tipp: Vorsichtig in den Quellcode klicken und am Mac gleichzeitig CMD und F ( am PC STRG und F) drücken. Das öffnet das Suchfeld. Dort </body> eingeben und suchen, dann landet man automatisch am Ende der Seite.

Dort dann den kopierten Code einfügen. Und Speichern.

Dieses war der erste Teil. Wenn ihr nun das Blog aufruft, seht ihr am Ende des Artikels den Pinterest „Merken“-Button. Der erste Teil ist geschafft.

Der „Hover“-Button in Blogspot

Nun wieder zum Widget-Builder wechseln. Erneut auf das Feld „Merken“-Button (1.) wählen.
Bei (2.) „Image-Hover“ auswählen und die Seite wechselt automatisch auf die richtigen Einstellungen.
Das Design auswählen (3.) und dann den Quellcode aus dem Feld kopieren (4.)

Bei Blogger wieder in den Layout-Bereich wecheseln und ein neues HTML-Gadget auswählen (1.)
(wie Du es bereits oben gemacht hast).
Im Popup-Fenster (2.) dann den kopierten Code einfügen und abspeichern (3.)

Dieses Gadget ist unsichtbar und kann in der Sidebar stehen bleiben. Wenn Du nun zurück in Dein Blog wechselst und die Seite neulädst, erscheint  der „Hover“-Button über den Bildern.

Wie Du siehst, ist es eigentlich ganz einfach die Buttons einzubauen.

Viel Spaß beim Pinnen!

Ich freue mich, wenn Dir der Beitrag gefällt. Du darfst ihn sehr gern liken, teilen und pinnen :-)

Eure Daniela

 

Klicke hier, um diesen Artikel direkt auf Pinterest zu pinnen:

 

 

 

Sharing is caring. Als langjährige Lifestyle-Bloggerin habe ich viel Praxiswissen auch über den Blogrand hinaus zusammengetragen, selber entwickelt und vermittelt. Unternehmen wie Ikea und ebay, aber auch Tchibo, wo ich die Abteilung Corporate Communications unterstütze, nutzen bereits meine Expertise im Bereich Marketing und Social Media. Damit auch Du davon profitierst, biete ich Seminare und Coaching zum Thema Blogging, WordPress, Social Media und Blogkooperationen mit Unternehmen an.
Lost in blogging? Du hast Dein Blog gerade abgeschossen und nichts geht mehr? Unser blog-raketen-Dienst hilft Dir im Notfall mit einem schnellen Rettungsplan, Dein blog wieder in die richtige Umlaufbahn zu bringen. Du möchtest Deinen blog-Auftritt updaten, optimieren und das Beste herausholen? Starthilfe von der Blogbase, Kurskorrekturen und das Umschiffen von Wurmlöchern bekommst Du ebenfalls von der Seiten-Wechsel Blogwerkstatt. Als Ground Control zeigen wir Dir, wie Du mit wordpress sicher und lässig durch die Mediasphäre surfst.

KONTAKT >>

 

No Comments

Post a Comment

Abonniere unseren Newsletter!