Pin it - Pinterest Button für Blogger

Heute gibt es etwas aus dem Code-Topf.

Erst vor kurzer Zeit habe ich mich dazu entschieden bei mir einen zu Pinterest verknüpfenden Button hinzuzufügen. Ich hab gesucht und auch gefunden, leider nur nicht das, was ich wollte. Also hab ich beschlossen passend zum Kreide-Trend mir selbst einen Button zu basteln.

Der Vollständigkeit halber gibts ihn noch in mehreren Farben.

 

Ja ich hab mich ausgetobt! :D

Um den Button euren Bildern hinzuzufügen, während die Maus auf dem Bild ist (Mouseover-Effekt) wird dieses Stückchen Code verwendet.

Anleitung

Dann diesen Code kopieren und wie im nächsten Biild gezeigt einfügen.

<script>//<![CDATA[var bs_pinButtonURL = "Bild-Url";
var bs_pinButtonPos = "bottomright";
var bs_pinPrefix = "";
var bs_pinSuffix = "";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script id='bs_pinOnHover' src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'>
// This Pinterest Hover Button is brought to you by bloggersentral.com.
// Visit http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html for details.
// Feel free to use and share, but please keep this notice intact.</script>

Die Rote Schrift durch die Bild-Url ersetzen (dazu auf das Bild gehen, rechtsklick, "Bild url kopieren"

Die Blaue Schrift duch den Befehl ersetzen, den ihr haben wollt:

topleft 

topright 

bottomleft

bottomright

center

Vorlage speichern, fertig! :)