How t0 Add Sharing Buttons Enclosed In An Eggshell

Everyday we want to see beautiful things as we perform of our individual responsibilities. New things, if we glance to, would pull us closer to them. Like this kind of artistic display of media sharing buttons.

In my previous post, the different styles of putting sharing buttons in our blog i.e. below post titles and sidebar. But this time, I'm so glad to make it more unique because we will put that inside an eggshell so that the viewers will be amazed and at the same time they will share our posts to the different social medias. So let's do it.

---

Adding Sharing Buttons Enclosed In An Eggshell

---

Step 1. Go to Blogger Dashboard >> Template >> Edit HTML button (Always back-up your template before editing)

Step 2. Look (Control F) for the code </head> and just above it paste the code below,

 

<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;bea50586-2b9f-448d-947a-01385f28e305&quot;, onhover:false}); </script><link href='http://w.sharethis.com/gallery/shareegg/shareegg.css' media='screen' rel='stylesheet' type='text/css'/>

Step 3. Find the tag </body> and paste the code below just above it, 

<div style='position: fixed; bottom: 2%; left: 2%;'><div class='shareEgg' id='shareThisShareEgg'/></div><script type='text/javascript'>stlib.shareEgg.createEgg(&#39;shareThisShareEgg&#39;, [&#39;facebook&#39;,&#39;twitter&#39;,&#39;googleplus&#39;,&#39;linkedin&#39;,&#39;blogger&#39;,&#39;stumbleupon&#39;,&#39;sharethis&#39;],{title:&#39;<data:blog.pageTitle/>&#39;,url:&#39;<data:blog.url/>&#39;,theme:&#39;shareegg&#39;});</script>

Step 4. Click Preview first  to see the initial effect then hit the Save button. :- )

Short Customization (Optional):

1. To change the position of the "egg", replace fixed into static to make appear only at the bottom of your page.

2. Replace left to right to make visible at the right side of your blog
3. Adjust 2%  in order to adjust the vertical marginal position of the "egg". Increase value will also move the egg to the top and decrease the value will also move it to the bottom.
4.  Adjust 2% in order to  adjust the  horizontal marginal position of the "egg".  Increase value will also move the egg to the right and decrease the value will also move it to the left.

 Enjoy Friends!