Monday, August 20, 2012

Fixed Position Slide Open Heart Bookmarking Gadget To Blogger

Fixed Position Slide Open Heart Bookmarking Gadget To Blogger

LOVELY Gadget


Add The Split Heart Bookmarking Gadget Top Your Blog
Remember Always Back Up Your Template Before You Make Changes - How To Back Up A Blogger Template

Step 1. In Your Blogger Dashboard Click Design > Edit Html

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>


<!-- Start Heart Bookmarking Gadget Code From http://softsekar.blogspot.in/ -->
<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://softsekar.blogspot.in/ -->

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>


<!-- Start Heart Share Code From http://softsekar.blogspot.in/ -->
<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://softsekar.blogspot.in/">Blogger Wordpress Gadgets</a>
<!-- End Heart Share Code From http://softsekar.blogspot.in/ -->


Step 6. Save Your Template.

The code was copied from http://www.spiceupyourblog.com/

Sunday, August 5, 2012

Animated Social Bookmark Gadget For Blogger

Today I have avery cool social bookmarking gadget with a stylish animated effect.With the Sassy bookmarks gadget a basic share button is placed in the corner of your blog, then on hover 6 icons for the main social bookmarking websites appear in a semicircle.The buttons that appear are for Pinterest, Google+, Facebook, Twitter, Tumblr and Email.Below we have a live demo then check out the tutorial to add the  Bookmarks to Blogger.


Add The Animated Sassy Bookmarking Gadget To Your Blog
Remember Always Back Up Your Template Before You Make Changes - How To Back Up A Blogger Template


Step 1: In Your Blogger Dashboard Click The Drop Down Menu For Your Blog > Choose Template > Then Edit Html > Tick The Expand Widget Templates Box 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

Step 3: Copy and Paste the following code Directly Above / Before </body>

CODE

<!-- Start Bookmarks HTML - http://softsekar.blogspot.in/  -->
<div class='shr_ss shr_publisher'>

</div>
<!-- End Bookmarks HTML -->
<!-- Start Bookmarks settings -->
<script type='text/javascript'>
var SHRSS_Settings = {&quot;shr_ss&quot;:{&quot;src&quot;:&quot;//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark&quot;,&quot;link&quot;:&quot;&quot;,&quot;service&quot;:&quot;5,7,2,313,38,201,88,74&quot;,&quot;apikey&quot;:&quot;b87f5899d80a5edce8b5e55f58542ef0f&quot;,&quot;localize&quot;:true,&quot;shortener&quot;:&quot;bitly&quot;,&quot;shortener_key&quot;:&quot;&quot;,&quot;designer_toolTips&quot;:true,&quot;tip_bg_color&quot;:&quot;black&quot;,&quot;tip_text_color&quot;:&quot;white&quot;,&quot;viewport&quot;:true,&quot;twitter_template&quot;:&quot;${title} - ${short_link} via @Shareaholic&quot;}};
</script>

<script type='text/javascript'>
(function() {
var sb = document.createElement(&quot;script&quot;); sb.type = &quot;text/javascript&quot;;sb.async = true;
sb.src = (&quot;https:&quot; == document.location.protocol ? &quot;https://dtym7iokkjlif.cloudfront.net&quot; : &quot;http://cdn.shareaholic.com&quot;) + &quot;/media/js/jquery.shareaholic-publishers-ss.min.js&quot;;
var s = document.getElementsByTagName(&quot;script&quot;)[0]; s.parentNode.insertBefore(sb, s);
})();
</script>
<!-- End Bookmarks script -->
<!-- End Bookmarks HTML - http://softsekar.blogspot.in/  -->

Step 4: Save Your Template.

That's it the animated Sassy Bookmarks gadget is on your blog !

 
Animated Social Gadget - Blogger And Wordpress Tips