You can
simply integrate this widget with your blog by adopting following
procedure. So lets see how to add this widget on the blog ?
are always open for that. If you like the above article then don't
forget to subscribe it for latest updates.
simply integrate this widget with your blog by adopting following
procedure. So lets see how to add this widget on the blog ?
How to Add Sharing Widget To Blog:-
- Login to Blogger Dashboard.
- Go to Design / Edit HTML.
- Click "Expand Widget Templates".
- Take Backup of your blog template, it is very necessary (More info).
- Find following piece of code in blogger template.
<data:post.body/>
- Add
the following code just below it. If you find <data:post.body/>
code in more than one position then add the following code just below
the <data:post.body/> on everywhere you find.
<!Widget on www.internetricks4u.blogspot.in -->
<b:if cond='data:blog.pageType == "item"'>
<div style='border-top:1px solid #E0E0E0;width:100%;position:relative;margin-top:13px;'> </div>
<div style='margin-left:auto;margin-right:auto; width:600px;position:relative;'><div style='color:#FF3030;position:relative;top:12px;'><center>If you enjoyed this article then kindly take 5 seconds to share it!!</center></div>
<table align='center' cellpadding='8' cellspacing='1' id='myshare'>
<tr>
<td>
<a target="_blank" class='external' expr:href='"http://www.facebook.com/share.php?u="+ data:post.url + "&title=" + data:post.title' rel='nofollow' title='Share this on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPtJ4hLjLMFf1qexEJ14OYRmSm-cWOzKPtdGpNnQKje6Hjngbve8L_H6WxROBXPAHOaTxQqyAdbNcD_Jb2-YR3QQXqyiULVvYqKn9tbfAwESa3Z94kf1Ue906T9cHAeUU6XnfDFkChoV0/h120/1.PNG'/></a></td>
<td>
<a target="_blank" class='external' expr:href='"http://twitter.com/home?status=Reading: " + data:blog.title + " - " + data:post.url + " (@NAME)"' rel='nofollow' title='Tweet This!'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZ9GHAdObg1M32rU1bkujkx8BPzPFW0gCYRQsDd6b9ZWN_VXjevt8gaY-kGhNPwBWOqZP0DERhL8yucEA2afH-b2ORhXPIFbJS9h6wOx9XULEpNiriNLC6OkWMbtQWPq-argoIdT4uS2U/h120/6.PNG'/></a></td>
<td>
<a target="_blank" class='external' expr:href='"http://technorati.com/faves?add="+ data:post.url + "&title=" + data:post.title' rel='nofollow' title='Share this on Technorati'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPlyWhbhPW3eQWME4JqdQOLDw3K2yMfiZdinqjY5aDTLje0PDuzEsXXxXMGm_0qDiSRQaIWvi7JXmtwphYQttsRmLiiPr-kw7FrdFfJuojJ40dgyZJuauO7UINHXwrW_cZ1MnociSbCJk/h120/5.PNG'/></a></td>
<td>
<a target="_blank" class='external' expr:href='"http://del.icio.us/post?url="+ data:post.url + "&title=" + data:post.title' rel='nofollow' title='Share this on del.icio.us'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiib7_KGK2LITPNHaEGcuDFwnhzHGiBRGk-ZSrkDGEAuyRrPss4kUOTXuhd32lfutMpvICQKSKNb1yXunj0W6KLHs7HOFrgkHMcfFTbZnl8S65easB0WpHFfRULIiaRjMi5vJS2Qrnfctk/h120/3.PNG'/></a></td>
<td>
<a target="_blank" class='external' expr:href='"http://digg.com/submit?phase=2&url="+ data:post.url + "&title=" + data:post.title' rel='nofollow' title='Digg this!'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMKBng6g2wbMPL8C6QIIdlQcB8jQDW_1ojzroviNNM9TG2RyhLBtnd1F01zWyWF8NhUWB79UZrh5JgqMvhEeATWCEZD0jITdWx3D7gDeCFp7j5fmkaM6bhMMRZa5kRyLis0i2Kynoi2bc/h120/2.PNG'/></a></td>
<td>
<a target="_blank" class='external' expr:href='"http://www.linkedin.com/shareArticle?mini=true&url="+ data:post.url + "&title=" + data:post.title' rel='nofollow' title='Share this on Linkedin'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhypvZHZRVmNQlpczTRDg0HfQmYGWII58j5aot1XI9Zd6UyDVZjHu8hCSlOxLwYzjlafEozZgjeM0OAok_RVbuJnShZJsa_eFTVsQtyWIC2oiAI449u-JOHDXHWHDqedggU6a4xX-6COuQ/h120/4.PNG'/></a></td>
<td><a target="_blank" class='external' expr:href='"http://www.stumbleupon.com/submit?url="+ data:post.url + "&title=" + data:post.title' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOkW9zR7CzAnP_S4-7n3w_KPvmvRuCcsmsVMxqdJNYM4m-rLd9TTlZ045Pmy9kQaLqSVuqSqMdpeYHtAZao-7TH9oOYIY0RW7z5PjFpVwgMw9I-gqBsonIZRSDARVXYfSpOGPARiSspyE/h120/7.PNG'/></a></td>
</tr>
</table>
</div></b:if>
- Now search the following section in the template.
]]></b:skin>
- Add the following CSS code just above it.
#myshare
{width:100%px;
height:50px;
border:0px solid red;
position:relative;
}
#myshare tr td img
{width:50px;
height:50px;
position:relative;
}
- Finally save your template and see the result.
are always open for that. If you like the above article then don't
forget to subscribe it for latest updates.