Blogger has been rolling out new features to improve the looks and usability of the blogs. Blogger is now testing out a new Social Sharing icon set consisting of Email, Blogger,Twitter(with goo.gl shortener),Facebook and Google buzz buttons. The set looks simple and elegant with some cool mouse over effects. These Sharing buttons are now available in your regular dashboard.If you need to take a peek at these new sharing icons, then take a look at my post page(and try sharing it :P ).
You are still reading. So i guess that you are really interested in implementing these Sharing buttons on your Blogger Blog.
Then don’t wait. Just follow these simple steps
- Login to Your Blogger Dashboard
- Go to Design > Page Elements and Click on the Edit Button near the Blog Posts Gadget and check the “Show Share Buttons” Option
- You can Drag and Drop the Share buttons and place it where you want.
- Now if everything went right, then you should be able to see the Share buttons on your Blog. If not then read on. :)
- If it didn’t appear then don’t worry, That is because you are having a modded template. Just Go to the Edit HTML page under the Design Tab , Check the “Expand Widget Templates” Option and locate
<p class='post-footer-line post-footer-line-3'>
Or if that is not there then find
<div class='post-footer-line post-footer-line-3'>
Or if that is not there then find
<data:post.body/>
and place the following code just below any of these lines[whichever is present in your template].
<div class='post-share-buttons'> <b:include data='post' name='shareButtons'/> </div>
and Save your template.
Google + 1 Button Doesn’t show up
1. If it doesn’t show up, then replace the share button code first.To do that, look for
<b:includable id='shareButtons' var='post'>
in your template. Now delete everything including this line, till the very next occurrence of
</b:includable>(including this line)
Now we can add a new b:includable block there. So paste the following code there instead of the old b:includable block
<b:includable id='shareButtons' var='post'> <b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + "&target=email"' expr:title='data:top.emailThisMsg' target='_blank'> <span class='share-button-link-text'><data:top.emailThisMsg/></span> </a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + "&target=blog"' expr:onclick='"window.open(this.href, \"_blank\", \"height=270,width=475\"); return false;"' expr:title='data:top.blogThisMsg' target='_blank'> <span class='share-button-link-text'><data:top.blogThisMsg/></span> </a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + "&target=twitter"' expr:title='data:top.shareToTwitterMsg' target='_blank'> <span class='share-button-link-text'><data:top.shareToTwitterMsg/></span> </a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + "&target=facebook"' expr:onclick='"window.open(this.href, \"_blank\", \"height=430,width=640\"); return false;"' expr:title='data:top.shareToFacebookMsg' target='_blank'> <span class='share-button-link-text'><data:top.shareToFacebookMsg/></span> </a></b:if><b:if cond='data:top.showOrkutButton'><a class='goog-inline-block share-button sb-orkut' expr:href='data:post.sharePostUrl + "&target=orkut"' expr:title='data:top.shareToOrkutMsg' target='_blank'> <span class='share-button-link-text'><data:top.shareToOrkutMsg/></span> </a></b:if><b:if cond='data:top.showBuzzButton'><a class='goog-inline-block share-button sb-buzz' expr:href='data:post.sharePostUrl + "&target=buzz"' expr:onclick='"window.open(this.href, \"_blank\", \"height=415,width=690\"); return false;"' expr:title='data:top.shareToBuzzMsg' target='_blank'> <span class='share-button-link-text'><data:top.shareToBuzzMsg/></span> </a></b:if> <b:if cond='data:top.showDummy'> <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div> </b:if> </b:includable>
2.Save the template, and see if the Plus One button is showing up.If it is then you are done. Otherwise proceed to step 3.
3. Locate
</head>
and just above that paste the following code
<script src='https://apis.google.com/js/plusone.js'/>
and Save the template.Now you should see the +1 buttons on your blog.
Optional Tweaks
- Show the Sharing Buttons on Post pages only - Find the Following Code in your template
<div class='post-share-buttons'> <b:include data='post' name='shareButtons'/> </div>
and wrap it within conditional tags as<b:if cond='data:blog.pageType == "item"'> <div class='post-share-buttons'> <b:include data='post' name='shareButtons'/> </div> </b:if>
- Hide Some of the Sharing Buttons – If you want you can hide some of these buttons using CSS. For example to hide the Blogger sharing button, add the following code above ]]></b:skin> in your template
.sb-blog{display:none}
sb-email , sb-twitter, sb-facebook, sb-buzz and sb-blog are the different Button Classes. If you hide the mail or buzz buttons, then it might look a little bad as these have rounded edges,
-
How to add the text “Share this:” before the Share Buttons? – This was one of the questions asked in the comments.So here is how to do it.Go to Design > Edit HTML and “Expand Widget Templates”.Look for
<b:includable id='shareButtons' var='post'>
Just below that add<table border='0'><tr><td><b>Share this : </b></td><td>
Now Look for the first occurrence of</b:includable>
that comes after that. Just above that add</td></tr></table>
Got into Trouble with implementing the sharing buttons? Ok leave a comment here and i will try to help you out. :)
No need yo go to draft.blogger.com because even if we activate the sharing buttons there, they won't show up !
ReplyDeleteOnce we add the second code, we can activate or deactivate theme from Page Element witout going to Draft.Blogger.com
@Soufiane - the sharing buttons will show up(once you check that option) if you are using an un-modded template. Wont show up if its a modded one.i had tested it.
ReplyDeleteit dosnt show on options.. :(
ReplyDeleteNeither of the codes you mention appear in my html code so I'm not sure where to insert it. When I check the box it doesn't show up :( http://ediblecville.blogspot.com Thanks for any help!
ReplyDeleteNever mind, just figured out the problem (click "expand widgets" button!) :) :)
ReplyDelete@Libby - updated the post as well :)
ReplyDeleteI've use this new feature before. But its not work on my blog. The buttons doesn't appears. I dont know why, so I deciding to put the button manually :(
ReplyDeleteGood job.
ReplyDeleteSorry, I hadn't refreshed the page and thus hadn't seen Libby's comment - once I expanded my widget templates it worked fine! Thanks for the tips! I love this site by the way!
ReplyDeletewhat do you mean by modded ???
ReplyDeleteJust add the second code, then they will show up in "Page Element" in Blogger standard version ...
thanks for this update :)
ReplyDeleteits awesome bro, thanks for share.
ReplyDeletethanks for sharing this post! I finally have sharing buttons for my blogs!
ReplyDelete@Soufiane - if you are using a standard blogger template(without much tweaks to the widgets), then there is no need to add any code to your template.
ReplyDeletethanks for that .
ReplyDeletecool apps would definitely try this one. keep on sharing
ReplyDeleteThanks! It worked :)
ReplyDeleteAs I work on wordpress and i prefer put social buttons manually, by the way this is really god news for blogger platform user now they can also attract users. Thanks for updates.
ReplyDeleteThanks for this update
ReplyDeleteHey, i can't find these codes on my expanded widget html.
ReplyDeleteplease hep! thanks!
Hey there!
ReplyDeleteThe buttons are showing up but they're not active. I must've taken a left turn somewhere...
thank you so much for this :)
ReplyDeleteThanks this worked great (I had to search for the second piece of code).
ReplyDeleteit doesn't appear on my site.. please check http://astercollection.blogspot.com thankyou
ReplyDeleteHi there!
ReplyDeleteIf you want to change the appearance to 'flat' style (no border and hover effect), add this to your CSS section:
.sb-email {
background-position:0 -66px !important;
}
a.sb-email:hover {
background-position:0 -66px !important;
}
a.sb-email:active {
background-position:0 -66px !important;
}
.sb-blog {
background-position:-21px -66px !important;
}
a.sb-blog:hover {
background-position:-21px -66px !important;
}
a.sb-blog:active {
background-position:-21px -66px !important;
}
.sb-twitter {
background-position:-42px -66px !important;
}
a.sb-twitter:hover {
background-position:-42px -66px !important;
}
a.sb-twitter:active {
background-position:-42px -66px !important;
}
.sb-facebook {
background-position:-63px -66px !important;
}
a.sb-facebook:hover {
background-position:-63px -66px !important;
}
a.sb-facebook:active {
background-position:-63px -66px !important;
}
.sb-buzz {
background-position:-84px -66px !important;
width:22px;
}
a.sb-buzz:hover {
background-position:-84px -66px !important;
}
a.sb-buzz:active {
background-position:-84px -66px !important;
}
sample see on my blog: www.Leechermods.com
oooo... i love this
ReplyDeleteIt worked but I cannot move around the buttons. Even if they seem to move in the Blog Posts Gadget preview, when I save it and see my Blog, they are stuck at the bottom of the posts. Any ideas? Thank you.
ReplyDeletehttp://girizo.blogspot.com/
Thank you for the post. A very good tutorial. It works fine.
ReplyDeleteGreat help, thanks. I would also mention that I typed SHARE just before adding the new code. Makes the purpose of the buttons more obvious.
ReplyDeleteHi and thanks, what about the rating stars - do you have a code for these too? I got the sharing buttons to work by applying your code tag, but it seems that the rating stars also do not appear, when you add them on the dialogue. It would be great if you could help with the code for these too, please :)
ReplyDeleteThanks again.
/Irene
@Εκείνος - the moving around can be done on standard templates. If you are having a template with highly modified widget codes, then it wont work. Btw there is a slolution(but it may make your blog go worse so take a backup of the template before trying it out.)Click on the "Revert widget templates to default" on the Edit HTML page. and the widget code will be standardized.
ReplyDelete@Anonymous - For reactions read - http://www.bloggerplugins.org/2008/08/reactions-on-blogger.html
ReplyDeleteFor rating stars read - http://www.bloggerplugins.org/2008/07/star-ratings-on-blogger.html
It worked just fine. Thank you so much!
ReplyDeletethanks alot 4 dis but i want tweat button like u hav on top of ur post
ReplyDeletethanks
ReplyDeleteFor those having problems with the widgets not showing up, if you click on "Revert widget templates to default" just below the HTML section, they will show up.
ReplyDeleteThe problem I'm having is that when a post is shared via Facebook or Buzz, it only shares the picture from the post, but not the title or the brief synopsis like yours. I'm guessing this is because I have a heavily customized site.
Any suggestions for getting these to work?
Great, and thanks for the style advice IlLusioN!
ReplyDeletethanks for posting this
ReplyDelete""Go to Design > Page Elements and Click on the Edit Button near the Blog Posts Gadget and check the “Show Share Buttons” Option""
ReplyDeletei dont see Design or page element etc in my dash board???
thanks for posting this
ReplyDeletethe prob like that thank you
ReplyDeletei am new in blogger. i've apprehensions about adsense program.
ReplyDeletedoes it really pay? Has anybody here been paid?
I am a regular visitor to your blog, like all your post this post is also very good. I will give 10 out of 10 marks.
ReplyDeleteI used the above on 2 of my blogs and it worked BUT I had to disable because right under the share buttons was a piece of text "ZZ"
ReplyDeleteIt happened on both blogs...I disabled and tried again with the same result. HELP. I want to use this feature.
Perfect, it worked! now let's spread the news
ReplyDeleteIs there code you can put in the 'add CSS' option on template designer ie without having to go to the raw template code? The html provided above doesn't work there (probably not surprising to you).
ReplyDeletehttp://rocketdungeon.blogspot.com/
Thnx for the share. it works with my template!!!
ReplyDeleteThanks for the fix. Very helpful.
ReplyDeleteIs there a way to move the sharing buttons out of the blog text and into the area with "posted by" and "labels"?
http://maidstoneinvicta.blogspot.com/
thanks for your information..
ReplyDeleteThis is a nice feature, but it would be broad-minded of Google to include a share button for WordPress and other blogs as well as Blogger!
ReplyDeleteI'm using a old templet called "thisaway_rose". I clicked on the "Expand Widget Templates" and then saved... I didn't see any changes. Now I know a little about HTML since i've been tweeking my blog for 3yrs and nowhere in my HTML code could I find the three codes listed above.
ReplyDeleteNow i'm wondering if your codes only apply to the newly designed templets? I absolutely do not want to change templets because of all the problems everyone's experiencing and I like my blog as is but would love to have all the new features added to my post.
It worked perfectly for me! Yay!
ReplyDeletegreat!!! but... when I share to facebook, instead of showing the text of my post in the preview, it appears the comments left for that post! any idea as to why this happens? thank you so much!
ReplyDeleteIt is not in option.
ReplyDeleteIt is nice option to have but blogger could improve them. They are too small in my opinion to have any impact.
ReplyDeleteThanks for giving all the options, it worked for me.
ReplyDeleteThank you! It worked great!
ReplyDeleteDone great, solved the bug, thanks
ReplyDeleteu give me a lot of options to choose..
ReplyDeletethey're all great..
keep moving forward..
my problem is that since I applied this the 'old' singular facebook 'like' button disappeared even though I haven't removed its code. Anyone an idea? Cheers
ReplyDeleteAwesome little bit of code. Thank you! How do you edit the code to add the word "Share" like yours?
ReplyDeletegreat!!!!!!!!!!!
ReplyDeletevisit
www.himkannu.blogspot.com
senks
ReplyDeletethanks... usefull mate :)
ReplyDeleteThe buttons are in black and white until you roll the mouse over them. Can something be done to make them appear in colour at all times?
ReplyDelete@ Petrichor
ReplyDeleteadd this to your blogger template css section, shows the color on mouse over always. see demo blog: http://leecher-news.blogspot.com
edit template, select Expand Widget Templates, add just before ]]></b:skin>
.sb-email {
background-position:0 -22px!important;
}
.sb-blog {
background-position:-21px -22px!important;
}
.sb-twitter {
background-position:-42px -22px!important;
}
.sb-facebook {
background-position:-63px -22px!important;
}
.sb-buzz {
background-position:-84px -22px!important;
width:22px;
}
Great stuff!
ReplyDeleteI have a modded template so not sure if this is the issue, but when I am on the Edit Blog Post section and try to move around where the Share buttons appear it doesn't work. They always appear at the bottom of the post. I would like them to appear on top.
ReplyDeleteWow, I wrote code. And it worked! Thanks.
ReplyDeleteMany thanks, although it was a bit of a challenge to find the line to change in my blog, the fix worked perfectly.
ReplyDeleteI very much appreciate your efforts and advice.
Any chance of getting more share buttons, like Reddit, Delicious, Stumble Upon, etc.?
ReplyDeleteThank you so much !!!
ReplyDeleteu r genius :)
@RadicallyDreaming
ReplyDeletemore share buttons with more services such as Digg, Google Bookmarks, Reddit, Delicious, StumbleUpon:
sample: http://emulemods.blogspot.com/ - see instructions on http://p2pclients.blogspot.com/2010/06/blogger-share-button-extended.html
Thanks for the examples, worked great to add the buttons. However, when I try to restrict to post pages only, the buttons don't show up at all.
ReplyDeleteAny other suggestions?
thanks for helping ...very nice......
ReplyDeletehow do i put "SHARE:" before the buttons?
ReplyDeleteVery much appreciate the help. For others trying the fix, please note that you may have to scroll pretty far down to find the right line of code that you need to append to. In the case of my blog, it was the second string you mentioned that appeared, i.e.
ReplyDeletediv class='post-footer-line post-footer-line-3'
Nice to have the share links at the bottom of each post. As others have requested, I hope Blogger eventually adds other buttons " i.e. Digg, Reddit, Delicious, StumbleUpon.
I already put both buttons. One problem is that when I put tweeter and Facebook button and between them the code , but it shows me an error message “The element type “div” must be terminated by the matching end-tag”. I try lot and lot.
ReplyDeletethanks for this update :)
ReplyDeleteOkayy...! I got it...
ReplyDeleteThanks so much for your sharing :)
I posted the first time on July 1st and I still haven't been able to make mine work.
ReplyDeleteMy blog - http://lilyseymour.blogspot.com/
I activated these buttons but couldn't see them, and your instructions worked great, although I must add that if you have the "link within" widget at the bottom of each post, this will post the share buttons above it and it looks weird. Try inserting that code one line further below than instructed here. Worked for me!
ReplyDeleteThanks for the instructions!
ReplyDeleteBest Reply you get from this site!
ReplyDeleteThis site just rocks :))
Hello
ReplyDeleteI implemented the code and the buttons show up, but they show up after my text and not after the complete message...
Maybe you can see what i mean: www.rubevdb.blogspot.com
Can someone help me?
I tried to do this from your post,
ReplyDeleteand everything from your comments as well
I still cant get this to work, any advice for me?
Thank you so much! It worked so perfect and it was easy to understand. Following this blog. Jessica
ReplyDeleteThis was an excellent piece of information, without any qualms, at all! I did have the same problem of the share buttons not showing up. This method has worked good. Thanks again! I'm hooked to your site. Cheers! :-)
ReplyDeleteThis worked, thank you so much!
ReplyDeleteAnd for those who say the code shows up after the text and you would prefer it to be in the post footer, look for < p class='post-footer-line post-footer-line-1' > or something similar and put the code right after that. Aneesh mentions this in the original post, but like my template, you may not have line-3 in your code.
Great help!! Thanks so much!!
ReplyDeleteworks great, thank you. How would I get it all black background vs the default white?
ReplyDeleteTHANKS!
ReplyDeleteYou are my hero--- Thank you!!
ReplyDeleteThis is NOT working for me. I followed your instructions but the buttons still will not show up on my Blog! HELP PLEASE!!!! I want to use this feature.
ReplyDelete@aneesh, brilliant tip on the standardize widget advice, worked like a charm...
ReplyDeleteWhoo thank for this!! Been trying to get them to show for ages!
ReplyDelete@Frank Brill, the Digg etc buttons can be added already - see http://p2pclients.blogspot.com/2010/06/blogger-share-button-extended.html for examples
Thanks for the tip! One question. If I wanted to preface the buttons with the word "Share:" (or whatever), what would code would you suggest? I've tried several things to add a title to that line and can't seem to find the right code/placement.
ReplyDeletenice. when i click share to twitter, it only shares blog name and link. why have a share button under each post of if i cannot post to twitter with blog TITLE as well. anyone know how to configure this?
ReplyDeleteCan I modify the placement of and add color to the Share buttons?
ReplyDeleteI have a StumbleUpon badge right beneath my blog post, but the share buttons show up in B&W further down, beneath "Labels."
The SU badge code is placed right under
<..+ div class='post-body entry-content'> (..+ and spaces added to avoid scripting error so I could post this code), so that section looks like:
<..+ div class='post-body entry-content'>
<..+p ..+ >< ..+ data:post.body/>< ..+ script src='ht..+tp://w ww. stumbleupon. com/hostedbadge.php?s=1'/>
<..+ div style='clear: both;'/> <..+!-- clear for photos floats -->
< ..+ /div>
1. Could the share button code you provided be inserted after the SU code? Where exactly?
2. Can the share buttons show up in color? How?
3. Is this code < ..+ ! -- notes -- > OK to insert anywhere in the template or extended template if I want to add notes to myself?
It works great for me and my blog is: www.samhaiti.blogspot.com
ReplyDeleteDoesn't work on my very modified blog:-( Tried but no dice
ReplyDeleteHi!
ReplyDeleteI was wondering why I can't move the share buttons. I modify their position from "edit blog posts" in blogger layout edit, but nothing happens. I would like to place the buttons under the labels (so at the end, just before the comment form) and i would like to have a small title above (like you have) with "Share" or something that i can modify.
Any ideas?
Insanely clever.
ReplyDelete@Richard Huggins
ReplyDelete@Bogdan
The buttons appear below the labels if you post the code after
<..+div class='post-footer-line post-footer-line-3'>
..+ added here to avoid error "Your HTML cannot be accepted: Tag is not allowed:DIV" so I can post this message.
I placed the code after my StumbleUpon code, but the buttons don't appear on the same row, but beneath the SU button. How can I move them in line with SU?
Great post! I followed your instructions in step 5, the third option and it still didn't show up. Any other suggestions? Thanks!
ReplyDeleteThanks Friend..
ReplyDeletethe Printerfriendly button would be a great improvement
ReplyDeleteThank you! Worked perfectly.
ReplyDeleteThanks a lot. The workaround worked for me.
ReplyDeleteI have fudged my own template around a bit. I appreciate this info on how to get the sharing buttons to show up. I cannot get my labels to disappear, even when I unclick them. Do you have any advice on that?
ReplyDeleteThanks, Lisa
Thanks for the line 3 fix for modded templates!
ReplyDeleteGot it to work at last thanks to this couple of lines of code but i wouls like to add "Share" if possible. thanks again.
ReplyDeleteworks like a charm, many thanks folks!
ReplyDeleteThanks for the fix - it was driving me crazy that I could get the share buttons on one of my blogs but not the other. Now all is well. :-)
ReplyDeleteThanks the widget wasn't showing up! Your tutorial really helped!!
ReplyDeletei have tried adding the code, can see it in the preview, but when I try to save the changes, they disappear. Please advise.
ReplyDeleteThanks. Your fix worked!
ReplyDeleteWorked well for me, thank you!
ReplyDeleteThanks gentleman..... kirtanchauhan.blogspot.com
ReplyDelete@IlLusioN Thanks for the code for making the buttons colored. The gray buttons just look inactive.
ReplyDeleteHow to move the buttons to the top of the post.
ReplyDeleteIf you already have the "quick edit pencil" displayed on your blog (Design, Page Elements, Edit blog posts, show quick editing)...
then use Design and Edit HTML, and add the same 3 lines of code that are described earlier in this blog, but put them just above the comment "".
You can see this at: Seek-Lord.blogspot.com
Best blog ever ! I love this blog ! I Love U !
ReplyDeleteif you want these icons to be in a different area on your posts then you need to put the code he has above in the correct place in your HTML coding. see my blog for an example: http://www.freek12edu.com/
ReplyDeleteit could be under the post header, post body or post footer. to center it, use the proper HTML for centering.
I'm using a custom template for my blog and it works fine, but my only problem with it is that the share buttons show up at the bottom of my blog and not next to my blog time stamp information.
ReplyDeletemikedot.blogspot.com
Can someone help me with this? Thanks.
@Mikedot
ReplyDeleteTry adding the Share button code above or below
<div class='post-footer-line post-footer-line-3'>
Doesn't work for me.. Using the Jellyfish Blogger template
ReplyDeleteThanks! The coding help in step 5 worked perfectly for my blog. Appreciate the help! :)
ReplyDeleteCan you help? Mine is still not working.
ReplyDeleteGreat tip. Thanks.
ReplyDeletehow do i make the buttons flush left, aligning with all teh other left hand things above it? there is a bit of a space..it's making me crazy...help?
ReplyDeletethanks!! :))
ReplyDeletethe share buttons are showing up, but they won't line up in one straight line. view here to see what I mean: http://bloomingonbainbridge.blogspot.com/
ReplyDeleteHow can I fix this? I need them in one line, not two. Any help is appreciated.
Now that I added the code my share buttons are shown but no one can leave comments anymore. I click on the comment button & nothing happens
ReplyDeleteThanks - worked perfectly, even making the buttons show up in color. As a few others have asked, "How do you get the word SHARE to appear?"
ReplyDelete@Anonymous and others - i have added the solution to the post :)
ReplyDeleteThank you to help me. Great
ReplyDeleteWhen I click on 'Like', do others see my name or do only I see it?
ReplyDeleteI'm hoping for the latter since you're tutorial worked perfectly and I'd like to add 'like' to my blog.
Thanks for your post I was able to get my buttons working because of it.
ReplyDeleteshare buttons are shown in same line just after my text.
ReplyDeleteAlso in my blog i pasted given code after
as my blog did not contain rest of two..
plz solve this problem out.
Also quick editing tool is not shown up even it is checked in blog posts options.
Perfect solution, I had it working within seconds: thanks for sharing!
ReplyDeleteThank you very very very very much.... I am glad to see the official sharing buttons... First they were not appearing, but as I did what you said, It worked. ..Thanks .. Good Site. But how do you know so many small things???
ReplyDeleteThanks for sharing the buttons and code :)
ReplyDeletethanks for sharing the tutorial
ReplyDeleteworked for me! thanks!!!
ReplyDeleteHow we can position it to right,
ReplyDeleteThis is My blogONE EYED CLICKS
Please Help.
Perfect man! Thanks a lot!
ReplyDeleteI used your code but now I can't place it where I want it to go. It's way there in the bottom and I want to raise it higher above comments. I tried just dragging it in elements but it wouldn't work. Any suggestions?
ReplyDeleteoh, and before you reply to my comment I should say THANK YOU THANK YOU for this tutorial. So useful. I really appreciate the time.
ReplyDeleteit's exactly what i need.
ReplyDeletethanks for your sharing.
Having a problem getting this to show on my modified classic template. not sure if im missing a certain DIV CLASS.
ReplyDeleteWhen editing the html I have no option to turn on widgets as its an old template.
Any suggestions where to put the code? all the locations mentioned dont appear on my template.
my blog is http://electriczoo.blogspot.com
thanks
Thanks a million!
ReplyDeleteThis was really helpful and well-explained.
Thanks dude .. its worked for me ...
ReplyDeleteWorked great! I love all these tutorials!
ReplyDeleteI am using customized lay-out, my question would be how to remove them on my CSS? I will cut them (whole set widget sharebutton) then save template but they remain.
ReplyDeleteOk. After following 1 - 3 it didn't work, so I followed steps 4,5, found , placed the code. It worked..
ReplyDelete...but, the Buttons are located close flush under the last line of the post body, above "read more>>" It's a little distracting fo my visitors
In Edit I have dragged and dropped the buttons to the very bottom of post under comments etc. However, after Saving, the buttons are back where they were at the start. I have done the usual ie; cleared cache etc Nothing seems to work.
Is there some way of tweaking the placement of the code in my template/widget?
How do I make the buttons stay where I put them?
My blog is: http://magnetic-island-weddings-help.blogspot.com/
finally the share button appeared!!! So happy thanks!
ReplyDeletexoxo
MrsM
Aneesh, thank you for your answer from June 26, 2010 2:52 AM!
ReplyDeleteIt works great :-)
Thanks.
ReplyDeleteMany thanks, it appeared after interting the code
ReplyDeleteThank, got it working. How do to move the sharing button to the right side instead of the left?
ReplyDeleteWhen I share on facebook it shows a snippet of a comment instead of the post...how do I fix this? Thanks for your code and help.
ReplyDeleteI fixed with point 5. Now they dissappear. But not on the right place. Same as some persons above! What to do?
ReplyDeletetraktatie.blogspot
Sorry I meant APPEAR!!
ReplyDeleteMy share buttons were working just fine until yesterday. The Facebook share button is picking up the text of the first comment of each post instead of the text/photo from the post itself.
ReplyDeletelike it =)
ReplyDeletethanx ^^
Hi,
ReplyDeleteI am trying to change the standard share buttons of blogger to the Twitter horizontal counter button. I have tried to put the code below the share codes on the footer But twitter counter button is not working right on the footer. It doesn't take the link of the post to tweet. It shows the main page as a tweet link. Can you help me to modify the code please?
The code I am trying to modify is:
http://twitter.com/goodies/tweetbutton
Thank you so much! working fine now!
ReplyDeleteDo you have any instructions for the 'facebook like' counter button too? to be placed on the post footer?
@Gilda - do a search for "facebook like" in the search box at the top :) you will find what you need :)
ReplyDeleteThanks a million! :)
ReplyDeleteI think I'm almost there! I got the Facebook share count right although the facebook like button goes in the post. I couldn't make it lining up with the twitter count on the post footer beside of the author!
And couldn't get the addthis bookmarking to work as twitter button. It doesn't line up and doesn't pick the post data. Takes only the main page address to share/bookmark!
I am also trying to put 'Love it' counter button as the link below!
What I am trying to do is this: Please check the post footer.
http://carolinesmode.com/stockholmstreetstyle/
I would appreciate it a lot if it's easy for you to tell me how can I do that!
Thanks again for your time!
Just added my share buttons...THANKS A MILL!!! was going crazy .....
ReplyDeleteHey! I've tried it, but got a problem. When I hit one of those bottoms, I don't get the data:post.sharePostUrl but the real link of my post, and Blogger says the page doesn't exits.
ReplyDeleteI mean, where I need something like:
http://www.blogger.com/share-post.g?blogID=707079334502450236&postID=8477696338422191833&target=blog
I get:
http://www.bloggerplugins.org/2010/06/official-sharing-buttons-on-blogger.html&target=blog.
I hope you can help me =(
Thank you!
@Marie - seems like you have got some corrupt b:includable code there. Replace it using the code from some other blog of yours.
ReplyDelete<b:includable id='shareButtons' var='post'>
.....
....
.....
</b:includable>
This is how the b:includable looks like.
Hi, Aneesh! Thanks! I've already tried that... I didn't mention that my template has two "Blog" widgets. The ShareButton works perfectly in the main one (summaries), but not in the other (full post) :(
ReplyDelete(= I'd appreciate you help.
thanks a lot! worked fine!
ReplyDeleteFirst of all thank u for your useful tutorial!
ReplyDeletei have a modded template. i followed your instructions and it worked! the only problem i have is that i can't move around as i wish the share button and also it appears not in one line.
http://paroledicioccolato.blogspot.com/
hope u can help me with this
Thanks for the post. It helped me figure out what was wrong in the code in my blog. Now its working fine.
ReplyDeletehttp://tryst-with-the-shutter-bug.blogspot.com/
gr8 buddy
ReplyDeleteI have a customized template and your code worked so fine
Hello,http://teesmommyclub.blogspot.com/
ReplyDeleteI need help. They are there but aren't visible.
Please help. I have my share button but every time I share a post on FB it brings up info under the link of a different post. It's always the same one. It use to bring up the right one now and then and then it seems like it gets stuck. I have noticed that some peoples blogs only brings up a title link and picture. Is there a way to do that because I would rather have no description of the post then to have the wrong one. People have stopped sharing my post as much because of this because it's confusing to their readers.
ReplyDeleteI have tried everything...thanks so much! -Mem
Thanks a lot... I have been searching for this for a long time..
ReplyDeletepls check my site.. www.banktestcoaching.com
Thanks so much this was very helpful...I now have share buttons under each post..BUT..they are in black and white, not color!!!
ReplyDeleteIs there a workaround so that I can have the pretty color ones too? I'm on a modified Minima..chicprovence.blogspot.com
thanks for your help!!
Kit
it works. thanks.
ReplyDeleteyou can check my blog.
Hi there,
ReplyDeleteEverything has worked except my share icons are appearing on TWO lines, not one. (3 icons on first line, 2 icons on 2nd line!)Please help!! Thank you!
Hi..I've managed to add the buttons. But now I can't find the following line to add the "share this" text. I'm using a custom template.
ReplyDeleteIs there another set of codes to look for?
Thanks this helped alot :D
ReplyDeletemozartskull
Thank you very helpful!
ReplyDeleteWhen I share my blogger post on facebook, it only shows the photo in that post, the title of my blog (instead of the title of post) and the description of my blog (instead of the snipet of the post). What can I do to change this? I tried using the fb share button on my post page and also the URL for that particular post, but no difference.
ReplyDeleteTHANK YOU!!! I spent 1 hour trying to figure it out - until i found this post! thanks!
ReplyDelete@ IlLusioN THANK YOU VERY MUCH! Finally I was able to add Digg, StrumbleUpon and Delicious thanks your instruction.
ReplyDeleteJust wanted to show my appreciation and say thank you for the information to help get my share buttons to show as I was not able to get them to do so. This post helped me get them up! THANK YOU!
ReplyDeleteI am having a problem like others before me...when I share the post it is bringing in the first comment, not the blog entry. Any idea how to fix? THANKS!
ReplyDeleteThanks for these instructions. Great! The 'share this' one didn't work for me though.
ReplyDeleteIn the name of my blog, thank you for your information, it was very useful.
ReplyDeleteGreetings from Romania ;)
Hi Aneesh,
ReplyDeleteI was able to use your code to have the buttons show up. But! I do not have the following line of code so I can add the text 'Share' before the buttons themselves. Is there a workaround for this?
b:if cond='data:post.sharePostUrl'
Also, the buttons are in black & white but turn color when I hover. I am assuming I can just alter the 'on mouse over' bit, right?
Thanks in advance for any help you can give me! :)
Jen
@IlLusioN can u tell me please when i need to add your code? thx
ReplyDeletevery helpful..
ReplyDeletethanks:)
@d3v1l, do you mean Blogger Share Buttons extended or share buttons design changing?
ReplyDeletecss code put before ]]></b:skin>
I did a small tutorial up here
Thank you so much.. It workd so well. Best regards.
ReplyDeletehttp://sunmang.blogspot.com/
Thanks!! It worked:)
ReplyDeletethanks. it's finally working. you could also mention that it is possible to add the share buttons in the footer. adding the code below the
ReplyDeleteadds the share buttons under the post, and not in the footer. anyway, the hack is great and it's working :)