Social media networks always great resource to get traffic.Every bloggers love to get huge traffic for their blog.Therefore we have to be active in social medias site.Because we need get lot of followers and friends.In this tutorial im gonna explain How to add Dynamic Floating Social Bookmark Widget for Blogger.It helps to increase your followers and friends.This Floating Social Bookmark Widget shows on every pages in bloggers. You can link your social media profile Facebook, Twitter Pinterest and Google plus. It will help to get new followers and friends to your profile.Check below link for demo.
You may like these articles
How to Add Fixed Social Media Sidebar for Blogger
Awesome 8 tips to Increase Google Plus Followers
Smooth Sliding Social Media Widget For Blogger
Extracting Hover Style Social Media Widget for Blogger
1. Log in to blogger account and Click drop down.
2. Now select "Template"
3. Find this tag by using Ctrl+F </head>
Note: First click on template code (anywhere of code), After that press Ctrl+F
4. Paste below code before </head> tag
5. Now again Find this tag by using Ctrl+F </body>
Note: First click on template code (anywhere of code), After that press Ctrl+F
6. Paste below code before </body> tag
Replace bloggertrix with your Facebook username
Replace bloggertrix with your Twitter Username
Replace bloggertrix with your Pinterest Username
Replace 107955298793879607964 with your Google plus id Username
7. Now click Save Template You are done...
If you need any help for Dynamic Floating Social Bookmark Widget, Just leave a comment.
You may like these articles
How to Add Fixed Social Media Sidebar for Blogger
Awesome 8 tips to Increase Google Plus Followers
Smooth Sliding Social Media Widget For Blogger
Extracting Hover Style Social Media Widget for Blogger
How to Add Unique Rss Subscribe Widget For blogger
1. Log in to blogger account and Click drop down.
2. Now select "Template"
3. Find this tag by using Ctrl+F </head>
Note: First click on template code (anywhere of code), After that press Ctrl+F
4. Paste below code before </head> tag
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <script language='javascript'> var name = "#floatMenu"; var menuYloc = null; $(document).ready(function(){menuYloc = parseInt($(name).css("top").substring(0,$(name).css ("top").indexOf("px"))) $(window).scroll(function () { offset = menuYloc+$(document).scrollTop()+"px";$(name).animate({top:offset},{duration:1000,queue:false});});}); #floatMenu { position:absolute;top:150px;float:left;width:45px;} #floatMenu ul {list-style: none;} #floatMenu ul li a {-webkit-transform:scale(0.6);-moz-transform:scale(0.6);-o-transform:scale(0.6);-webkit-transition-duration: 0.5s;-moz-transition-duration: 0.5s;-o-transition-duration: 0.5s;opacity: 0.8;} #floatMenu ul li a:hover {-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);opacity: 1;} </style>
5. Now again Find this tag by using Ctrl+F </body>
Note: First click on template code (anywhere of code), After that press Ctrl+F
6. Paste below code before </body> tag
<div id='floatMenu'> <ul> <li><a href='http://facebook.com/bloggertrix' target='_blank'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqwR17TGn5Yl6scrKBKQQcdKREZwtewY9RKxiBY7_jbX6jAh5DAp38UAhXWgqKdP7JOaggc_CMMKbzHfsha8X7DJnmsRRmNRNgFFGjyJw39DwfGliSBz1TRTHTGoWrxWjXFIFdA_tqTqs/s1600/btrix-facebook.png' style='margin-bottom: 3px;' title='Follow Me On Facebook'/></a></li> <li><a href='http://twitter.com/bloggertrix' target='_blank'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8K2psjJGZB4ATwBfJYAyR6MyN3W2sD_phBXDcx4poLp3jrwJLa0yjr5Qv1Pys6MiEURy7sCVGwPx09AyUIcBgVupqivenpgbnz4UkFn33u6N03WeQVS2V9PFUStyj45xVhaOgFt4g_zE/s1600/btrix-twitter.png' style='margin-bottom: 3px;' title='Follow Me On Twitter'/></a></li> <li><a href='http://pinterest.com/bloggertrix/' target='_blank'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK-RfZdj-qITGC2OAKBuEeZKPzx2XftqghzDxaWqBE_jKUzDwdNGnonEy9CcCQ23ctRQ_L2tyXLTiVoyxUvz19M9toNBhyphenhyphenholFzeSp824HX4ij5FrzSC4mDlaKemzBTwxs98nW27YKZWs/s1600/btrix-pinterest.png' style='margin-bottom: 3px;' title='Follow Me On Pinterest'/></a></li> <li><a href='https://plus.google.com/107955298793879607964' target='_blank'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0uZjN_lXeXOKkle3Q8m7tCVze4FMX03NUm_H6WQdM2ADoVbvPjDu2DXYgExzOAJ2VU38NPFmaTvGkBPevcw4ESDW19dtGQ8Q01xcWhWOx028n9eBaHfElfTNhYgS_MPGZGtdgfnHYjA8/s1600/btrix-googleplus.png' style='margin-bottom: 3px;' title='Add Me your Circle'/></a></li> </ul></div>
Replace bloggertrix with your Facebook username
Replace bloggertrix with your Twitter Username
Replace bloggertrix with your Pinterest Username
Replace 107955298793879607964 with your Google plus id Username
7. Now click Save Template You are done...
If you need any help for Dynamic Floating Social Bookmark Widget, Just leave a comment.
This kind of widget really help us in gaining more traffic. Great article Bro! I really like your blog design....
ReplyDeleteRegards
Bloggingtipsandtrix.blogspot.com
Hi Cerwenlloyd,
DeleteSocial networks always helps to get traffic for our blogs.
Thanks for your comment.
Thanks for this kinds of nice widget. I didn't huge widget like your site serve to visitors.
ReplyDeleteHi Fazle,
DeleteThere have lot of widgets in bloggertrix for bloggers.
Thanks for your comment.
Nice Widget thanks for Sharing
ReplyDeleteThis will really help us to make more likes on Fb faster
Hi Rizwan,
DeleteIt helps to get like for your fan page.
Thanks for your comment.
You even did better this time my friend,but i am waiting a blog about SEO strategy now a days how you know the exactly, what your customer wants and why we can sale our product.I would be very happy if you do this ,strategy in work with SEO.Thanks
ReplyDeleteHi, great widget...however, I foolwed the procedure and edited the html tags, saved and no error but the widget still doesnt show on my blog. What should I do?
ReplyDeleteLet me know your blog URL please.Then i can have a look at.
DeleteHello, very nice site for the blogger to add the widget for the blog. I would love to thanks the author.
ReplyDeletewelcome bro
DeleteHey i need your help i have done all this but widget can't show.
ReplyDeleteit works without problem bro
Deletethe code which should be saved in head part is wrong blogger does not let me save
ReplyDeleteit works fine
Deletewrite script instead of style (in number 4)
Deletetried and replaces style with script too. I does save but doesnt show up on the blog
Deletehello You Have Made a mistake
ReplyDeleteit will be *script* instead of *style* (in number 4)
Thank You.
hey its not floating pls help http://masterhaircare.blogspot.in/ see this pls rply asap
ReplyDeleteCheck it again..
DeleteThanks Bro, really a vry nice blog i really appreciate all your efforts ,thank you so mch for sharing this valuable information with all of us.
ReplyDeleteBro its not working i tried many tym any suggestion
ReplyDelete