You may come across many blogs where a vertical floating bar with share button is present at the left side or right of the blog posts.This Floating Vertical Bar is actually a blogger widget which helps the blogger to get more Facebook page likes,twitter tweets,and stumbles etc.This widget is very useful for visitors to easily share your blog/website contents.This widget is already posted by many bloggers but actually that is static or something else,but the widget we are going to share is Floating Vertical Bar with The Beautiful Share Buttons.
 |
| image Source Making Different |
How To Add Floating Vertical Bar With Share Buttons To Blogger
Adding Vertical Floating Bar with Social Buttons To Blogger is very easy.You have to Copy a snippet of Code,and then you should have to add it into the HTML/JavaScript Box.However let's take a look on these steps.
- Visit Blogger.com and sign in there.
- Now Visit Blogger Dashboard.
- Click On Layout
- Now Click On Add a Widget/Gadget
- Now a Box will popup
- Select HTML/JavaScript
- Now Copy the Below Script and paste it into HTML/JavaScript Box.
<a href='http://www.filehippolatest.com'><img alt='Floating Vertical Bar With Share Buttons widget by FileHippo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuHu69c9h-Pi_1CmLI7ECbkHXvu9Uwu6Qz2f0Rhb5Q-tErplV3m_0KaG_csrkD_vcRuAHnZ6Pjp9Jky9Qq7BKAUYNu8lDYloaxDYwUdsMtIV_ly70kALTI1P0GQLNqZbUV-cT8PSiRydsL/s1600/best+blogger+tips.png'/></a><div class="addthis_bar addthis_bar_vertical addthis_bar_large" style="background:#98A2A7; border: 1px solid #000000; top:120px;left:50px;"> <div class="addthis_toolbox addthis_default_style"> <span><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a></span> <span><a class="addthis_button_tweet" tw:count="vertical"></a></span> <span><a class="addthis_button_google_plusone" g:plusone:size="tall"></a></span> <span><a class="addthis_counter"></a></span> </div> </div> <script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js"></script>
- Now hit save and that's it !
Live Demo Of Vertical Bar with Social Share Buttons
Tip For Bloggers:- Adding To many JavaScript Widgets will surely make your website/blog speed slow,so be careful,don,t add extra and useless JavaScript widgets To You Blog.Some Blogger just want to decorate his/her blog like bride.But actually its a great foolishness,because simplicity its self is beauty :)
What's Up:- You Add This To your Blog?You Already added this?You don,t want to add this to Your Blog?Any Question Related this Post?Ask Freely ,stay blessed,Happy Blogging.
Add Floating Vertical Bar With Share Buttons To Blogger
Last Reviewed by Iftikhar uddinon June 24 2013
Rating:
Last Reviewed by Iftikhar uddinon June 24 2013
Rating:
I am a Web Developer,Graphic Designer,Blogger Wizard,WordPress Samurai,Code Engineer,SEO Guru,Software Engineer and food hunter.
Thanks for sharing this! I added it to my blog and found out data I didn't even know was stored anywhere.
ReplyDeleteI do have one question. My main URL has 39 Facebook likes on it, and that's what appears in the floating box when you go to the main page (thebigsocialpicture.blogspot.com). However, one of my posts has 29,000 Facebook likes, but the floating bar only shows that when you're viewing that specific post (http://thebigsocialpicture.blogspot.com/2013/02/the-oscar-protest-that-you-didnt-know.html). Is there any way for the main blog page to tally all the individual likes from individual posts? Lemme know if that doesn't make sense. Either way, thanks again for your help!!
You Welcome,and thanks for adding this widget to your blog.Actually this Floating widget show the likes of the specific Post i.e how many Users like a Post , it will fetch the data from Facebook .And The Widget you have added to your Blog right sidebar is static Facebook widget which only show the total likes of your Facebook Page Not posts.However it is not possible to Transfer all the likes from individual posts :D ,Hope You got the answer,Your Blog is nice :) Keep visiting Our Blog :)
DeleteAh thanks that's what I figured. I thanked you in my newest blog post, check it out here :)
ReplyDeletehttp://thebigsocialpicture.blogspot.com/2013/03/preparing-your-blog-for-increased.html?utm_source=thatsblogging&utm_medium=post&utm_campaign=thankyou
you welcome @The Big Social Picture,your new post is really awesome,i liked your hardwork,Keep posting such awesome articles.
DeleteRegards,
IfTikHAr!
I love that the Twitter count is clickable to view the results. Wondering though, is there any way to disable the "http://" part when it does the search? It messes up the results. Thanks!
Delete@The Big Social Sorry i haven't got your Question , but if someone is already logged in to twitter he/she can directly tweet your Blog article/Contents.And if he/she is not logged in then a popup windows appear with "Http://" he/she has to sign in there then tweet :)
DeleteRegards,
IfTIKHAr!
I mean when you click on the number and it shows a Twitter window with the URL in the search. Mine doesn't work because it includes an http. No matter, that's a really minor thing.
DeleteI do have a bigger question...I just bought a domain and am now redirecting my blog to it. But this counter is showing all likes/shares as 0. This makes sense since no one has actually liked/shared that exact URL. But is there any way to fix that? Show results for both domains maybe?
Thanks!
Well ,You asked a very Good Question,Actually what you have to do is,just add this Widget again to your New Blog i.e Your Domain , Hope you will get the solution.
DeleteRegards,
IfTiKHAr
Extra :- Actually your Domain is new,and no one has still liked it,its not a big deal,because your blog was old and was liked by many people on facebook that's why the widgets was showing likes,And Remember this widget just Fetch the Latest data from Facebook , Twitter etc i.e it will show the latest likes and tweets etc :)
Hope you got the Answer :)
thank u so much,
ReplyDeleteIt was so easy...
Hey John Salem we always provide well explained and clear articles,thanks for appreciating our work.Have a nice stay :)
DeleteRegards,
IfTIkHAr!
I want to see it in my blog on right side,but it only show the left side.Now what can i do?
ReplyDeleteHey Istiaque Bro All you have to do is just to change the "Left" in the script to right and thats it :)
DeleteRegards,
IfTikHAR!
Thankyou soo much i searched a lot for this working flaoting widget i found many links but all those were not working finally i got a working one from your blog
ReplyDeleteand i feel glad if it is transperent please give me suggestion to make it as transperent currently background is yash color awaiting for your reply ....
Hey Engg Computers,thanks for stopping by :) For making this Widget Transparent Change the style in the above script to this Code
Delete.addthis_floating_style {
background: transparent !important;
}
Try it,hope it works :)
regards,
ifti!
If that trick is not working please follow this Link :)
Deletehttp://thatsblogginglab2.blogspot.com/2013/04/transparent-floating-vertical-bar-with.html
Hope you got the solution :)
Regards,
ifTI!
I think it's mischief! If we copy the following script, then share options for your blog will be in my blog! Please be serious and make best posts!
ReplyDeleteHey Ankith Prabhas,Are You Kidding Bro?Are you new in Blogging Field?Bro the Code is posted by me not by you.SO all credit goes to me,if i add my blog link in the script why you start too much bullshit?Isn't Fair to give me a lil bit credit?Any Way thanks for Stopping by
DeleteRegards,
IfTI!
hello. look at my test blog: http://weqwdqwqe.blogspot.ro/
ReplyDeletewhy tweet boton is out of sidebar?
Excellent article..Thanks for sharing..
ReplyDeleteassignment writing services
I don't want this widget on my home page. Please help.
ReplyDeleteHurray works on my blog >> Techbuzindia :-)
ReplyDeleteTrick and code is good for beginners unless u put your link'
ReplyDeletehey nice widget i have applied it in my blog........u can check it here.....www.androidx.in
ReplyDeletethanx for sharing it
Thank you for the wonderful article on Add share button. Blogging is now a skillful way to make money by several methods. These are forever tips to add share button from blog.
ReplyDeleteDidn't work for me but i had to copy the one i saw after the live demo and it was exactly what i wnted. The only changes i made was remove left from the code and replace with rigaht. THanks a million
ReplyDeleteUche Francis
Techdavids.com
Nice Post thank's for sharing i will found your post is very useful for new blogger.
ReplyDeletewww.computerhelp8.blogspot.com
2015 hot jerseys, nike nfl jerseys,mlb jerseys,nba jerseys,nhl jerseys, Christian Louboutin shoes, sale new jerseys,cheap wholesale new jerseys,2015 new nike nfl jerseys, Christian Louboutin uk, nfl hoodies jerseys,nhl hoodies jerseys,nba hoodies jerseys, Christian Louboutin Outlet
ReplyDeleteVery informative and well written post! I like the way you make your points.
ReplyDeleteCustom Logo design
This is very interesting, but it is necessary to click on this link: plancha vapor
ReplyDelete