Ein Herz für Blogger - Bookmark Gadget

In diesem Beitrag möchte ich Ihnen eine coole neue Art zeigen den Besuchern das teilen interessanter zu machen. Bookmark-Tools sind wichtig und sollten auf jedem Blog zu finden sein und vor kurzem ist dieses tolle interaktive Bookmarking Gadget erstellt worden.

Dieses Gadget ist als Herz getarnt bzw. eben das Logo, welches links unten in ihrem Blog herumschwebt, sobald man mit der Maus darüber fährt spaltet sich das Herz und die Social Bookmark Buttons werden sichtbar. Die Enthüllung sieht genial aus und der Slide-Effekt ist sehr cool. Zu finden sind nun Icons für Facebook, Twitter, Pinterest, LinkedIn, Stumble, E-Mail und hundert weitere. Das Gadget wird auf der linken Ecke ihres Blog fixiert um die Aufmerksamkeit der Besucher zu packen und mehrere Bookmarks zu generieren. So unten habe ich ein Tutorial erstellt das ihnen zeigt wie Sie dieses Gadget auf ihrem Blog anwenden, zuerst sollten Sie sich jedoch die Live-Demo ansehen.

Ein Herz für Blogger - Bookmark Gadget Tutorial

Denken Sie daran, immer ein Backup Ihres Designs zu machen bevor Sie Änderungen vornehmen.

1.Schritt
In Ihrem Blogger-Dashboard Klicken Sie auf Design > Html Bearbeiten

2.Schritt
Suchen und finden Sie den folgenden Code in Ihrem Blog-Html: (Klicken Sie auf Strg und F für die Suchleiste)

</head>

3.Schritt
Kopieren Sie den folgenden Code direkt vor /head.

<!-- Start Heart Bookmarking Gadget Code From http://www.blogspot-ratgeber.com/ -->
<script src='http://w.sharethis.com/gallery/shareegg/shareegg.js' type='text/javascript'/>
<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>
<script type='text/javascript'>stLight.options({publisher: &quot;ur-98d377f-bdd3-9ad1-fbe5-2a678f0a60ee&quot;, onhover:false}); </script>
<link href='http://w.sharethis.com/gallery/shareegg/shareegg.css' media='screen' rel='stylesheet' type='text/css'/>
<!-- End Heart Bookmarking Gadget Code From http://www.blogspot-ratgeber.com/ -->

4.Schritt
Suchen und finden Sie den folgenden Code in Ihrem Blog-Html: (Klicken Sie auf Strg und F für die Suchleiste)

</body>

5.Schritt

Kopieren Sie den folgenden Code direkt vor /body.

<!-- Start Heart Share Code From http://www.blogspot-ratgeber.com/ -->
<div style='position: fixed; bottom: 2%; left: 2%;'>
<div class='shareEgg' id='shareThisShareHeart'/>
</div>
<script type='text/javascript'>stlib.shareEgg.createEgg(&#39;shareThisShareHeart&#39;, [&#39;facebook&#39;,&#39;twitter&#39;,&#39;pinterest&#39;,&#39;linkedin&#39;,&#39;stumbleupon&#39;,&#39;email&#39;,&#39;sharethis&#39;], {title:&#39; <data:blog.pageTitle/>&#39;,url:&#39;<data:blog.url/>&#39;,theme:&#39;shareheart&#39;});</script><a href="http://www.blogspot-ratgeber.com/">Blogspot Ratgeber</a>
<!-- End Heart Share Code From http://www.blogspot-ratgeber.com/ -->

Der in gelb markierte Text bestimmt die Position des Gadgets, diese könen sie also ganz einfach ändern. Nun speichern Sie das Template ab und fertig.