-

11 September 2012

Add Inside Floating Social Bookmark Widget For Blogger

VM | 3:43 pm |
This is a another cool floating bookmark menu your blog. I include with attractive inside icons for this widget.This  floating menu will appear every post in your blog.So, visitors will always get this gadget.because of it floating bookmark is the helps to increase your facebook fan, Twitter followers, and Rss subscribers. you can do with easy steps. Follow these steps to add it your blog. if you want to use this gadget in specific page, use this post.

How To Show Blogger Gadget/ Widget In Specific Pages

DEMO

 
1. Log in to blogger account and Go to Design >> Edit HTML
    (make sure backup your template first)

2. Find this tag by using Ctrl+F    ]]></b:skin>

3. Paste below code Before ]]></b:skin> tag

.bt-wdt{
 position: fixed;
 right: 10px;
 top: 43%;
}

.bt2-wdt{
 position: fixed;
 right: 30px;
 bottom: 22%;
}

.bt-wdt img{
 float: right;
 clear: right;
 margin: 5px;
 -webkit-transition: all .2s ease-in-out;
 -moz-transition: all .2s ease-in-out;
 -o-transition: all .2s ease-in-out;
 transition: all .2s ease-in-out;
}
.bt-wdt img:hover{
 -moz-transform: scale(1.2) rotate(6deg);
 -webkit-transform: scale(1.2) rotate(6deg);
 -o-transform: scale(1.2) rotate(6deg);
 -ms-transform: scale(1.2) rotate(6deg);
 transform: scale(1.2) rotate(6deg);
}

4. Now Go to Design >> Page Element

5. Click Add Gadget and select 'HTML/Javascript'

6. Paste  below code.

<!-- www.bloggertrix.com -->
<div class="bt-wdt">
 <!-- Facebook -->
 <a href="http://www.facebook.com/Page-Name" title="Join me on Facebook" target="_blank"><img alt="Join me on Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihopxgSLzP05G3bqEhxS5RUT-IcYlg89hcN8BPXydZGUY1Xr3QlOYrs6dpgKyO_U19i3xRBhCGoI6xNBoCc5Ypw6NCJs3miEfQt6_NcCRfLHdkd2iUX0lNZa0BrKM-JFt-xg8Kz3PvKxA4/s1600/inside-facebook-icon.png" /></a>
 <!-- Twitter -->
 <a href="http://twitter.com/USERNAME" title="Follow me on Twitter" target="_blank"><img alt="Follow me on Twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzvgmn43f8xRwOOHAEd1tv8DQ6j-6CdKch91rQzZQy_3TepDGLkFlkP9Bh8udAt1pjvYAm-J4doGOO3z6yO7amOra4rS11NaFNCIeFs2Ytk46J2Bc4mpagTO9kLUppqp5SmWCn1A5uhNuj/s320/inside-twitter-icon.png" /></a>
 <!-- RSS -->
 <a href="http://feeds.feedburner.com/feed-address" title="Subscribe to RSS" target="_blank"><img alt="Subscribe to RSS" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgd83K6CB32KLyvdATJtl1BxeJD7SvvxOTveWHGXY_rTmS0fQa1eH4QoFS_9ttd2oUNyukDomANzHKtRJqhSZ2VJI87_nUZcOe_kUdpSKaPy8FNm0qoYNftK6nDXcxQH-OLKIpw86jNZ8YY/s1600/inside-rss-icon.png" /></a>
</div><div class="bt2-wdt"><a style=" font-size:9px; color:#3B78CD; text-decoration:none;"href="http://www.bloggertrix.com/2012/05/how-to-add-smooth-jquery-facebook-like.html"> Get This</a>
</div>
<!-- End -->

*Replace Page-Name With your facebook page name
*Replace USERNAME with your twitter username
*Replace  feed-address with your feedburner address.

7. Now save your template
 you are done. 

No comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...

Subscribe Updates, Its FREE!