Pages

Monday 24 December 2012

Christmas Decoration Social Bookmarking Gadget For Blogger Blogs

In the past I have written a few tutorials on different styles of the share this social bookmark egg.Today just in time for Christmas I have a Christmas version.A cool Christmas ornament sits on the corner of your blog with social bookmarking options for readers.On hover the ornament slides open with share buttons for Facebook, Twitter, Pinterest, StumbleUpon, Google Plus, LinkedIn, Email and the ShareThis button that offers even more options.Check out the demo below :
View Demo Button
OK if that's something you want to greet your visitors this Christmas heres the tutorial.


Add The Christmas Bookmark Gadget To Your Blog


Remember Always Back Up Your Template Before You Make Changes - How To Back Up A Blogger Template

Step 1. In The New Blogger Dashboard Click The Drop Down Menu For Your blog And Choose > Template > Under your blogs screenshot choose "Edit Html" > Then Proceed, as shown in the video below.



Step 2. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code - How To Find Code In Blogger Template Template)

</head>

Step 3. Copy and Paste the following code Directly Above / Before </head>

<script type="text/javascript" src="http://w.sharethis.com/gallery/shareegg/shareegg.js"></script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">stLight.options({publisher: "bea50586-2b9f-448d-947a-01385f28e305", onhover:false});</script>
<link media="screen" type="text/css" rel="stylesheet" href="http://w.sharethis.com/gallery/shareegg/shareegg.css"></link>

Step 4. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code - How To Find Code In Blogger Template Template)

</body>

Step 5. Now Copy And Paste This Code Directly Above / Before </body>

<div style='position: fixed; bottom: 2%; left: 2%;'><div id='shareThisOrnament' class='shareEgg'></div>
<script type='text/javascript'>stlib.shareEgg.createEgg('shareThisOrnament', ['facebook','twitter','googleplus','pinterest','stumbleupon','linkedin','email','sharethis'], {title:&#39; <data:blog.pageTitle/>&#39;,url:&#39;<data:blog.url/>&#39;,theme:'holiday'});</script>
</div><a href="http://www.spiceupyourblog.com/">Blogger Wordpress Tips</a><!-- End Christmas Share Code From http://www.spiceupyourblog.com/ -->

No comments:

Post a Comment