Cool Fixed Position Slide Open Egg Social Bookmarking Gadget For Blogger
A few weeks ago i published "Add An
Awesome Fixed Position Slide Open Heart Bookmarking Gadget To
Blogger"In this post we have the same social bookmarking gadget but
this time it will not be shaped as a heart but instead an oval egg
shape.The share egg sits in the bottom corner of your blog and remains
fixed as the reader scrolls the page.On hover the egg slides open to
reveal bookmarking buttons for your readers to share posts on Facebook,
Twitter, Google +, Blogger, LinkedIn, Stumble Upon, Email and the
Share This Icon Offers hundreds more bookmarking choices.
Add The Share This Egg 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>
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>
<!-- Start Heart Bookmarking Gadget Code From http://www.spiceupyourblog.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: "bea50586-2b9f-448d-947a-01385f28e305", 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.spiceupyourblog.com/ -->
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>
</body>
Step 5. Now Copy And Paste This Code Directly Above / Before </body>
<!-- Start Heart Share Code From http://www.spiceupyourblog.com/ --><div style='position: fixed; bottom: 2%; left: 2%;'><div class='shareEgg' id='shareThisShareEgg'/></div><script type='text/javascript'>stlib.shareEgg.createEgg('shareThisShareEgg', ['facebook','twitter','googleplus','linkedin','blogger','stumbleupon','sharethis'], {title:' <data:blog.pageTitle/>',url:'<data:blog.url/>',theme:'shareegg'});</script><a href="http://www.spiceupyourblog.com/">Blogger Wordpress Gadgets</a><!-- End Heart Share Code From http://www.spiceupyourblog.com/ -->
Important, Move The Position Of The Gadget :
The Gadget is currently set to be in the bottom right corner of your blog but you can easily change this.In yellow above you can see bottom: 2%; left: 2%;.You can change Bottom to top for it to be at the top of the page and left to right for it to be on the right of the page.You can also change the percentages to have it further from the bottom/top and left/right.
Step 6. Save Your Template.
Step 3. Copy and Paste the following code Directly Above / Before </head>
The Gadget is currently set to be in the bottom right corner of your blog but you can easily change this.In yellow above you can see bottom: 2%; left: 2%;.You can change Bottom to top for it to be at the top of the page and left to right for it to be on the right of the page.You can also change the percentages to have it further from the bottom/top and left/right.
Step 6. Save Your Template.
Step 3. Copy and Paste the following code Directly Above / Before </head>
<!-- Start Heart Bookmarking Gadget Code From http://www.spiceupyourblog.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: "bea50586-2b9f-448d-947a-01385f28e305", 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.spiceupyourblog.com/ -->
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://www.spiceupyourblog.com/ --><div style='position: fixed; bottom: 2%; left: 2%;'><div class='shareEgg' id='shareThisShareEgg'/></div><script type='text/javascript'>stlib.shareEgg.createEgg('shareThisShareEgg', ['facebook','twitter','googleplus','linkedin','blogger','stumbleupon','sharethis'], {title:' <data:blog.pageTitle/>',url:'<data:blog.url/>',theme:'shareegg'});</script><a href="http://www.spiceupyourblog.com/">Blogger Wordpress Gadgets</a><!-- End Heart Share Code From http://www.spiceupyourblog.com/ -->Important, Move The Position Of The Gadget :
The
Gadget is currently set to be in the bottom right corner of your blog
but you can easily change this.In yellow above you can see bottom: 2%; left: 2%;.You
can change Bottom to top for it to be at the top of the page and left
to right for it to be on the right of the page.You can also change the
percentages to have it further from the bottom/top and left/right.
Step 6. Save Your Template.