Take a look at the bottom of this post. Hover your mouse over the Social Bookmarks displayed there. Do you like this hack? I thought so.
I saw this use of dynamic HTML at one of my favorite websites, Vladstudio. And reverse-engineered it to fit into Blogger Beta.
For starters, I just give you some simple instructions on how to implement this hack. Later on I'll expand on how this hack works and how to tailor it to your needs. If you want to have other services, let me know.
Implementation is easy.
Step 0: Backup your template.
Step 1: Add the following code to the head of your template:
<script src='http://home.planet.nl/~hansoosting/downloads/beautifulbeta.js' type='text/javascript'/>
Step 2: Find the following line of code in your template:
<p class='post-footer-line post-footer-line-3'/>
and replace it with the code from this file (right-click and save).
Save your template and there you go!
And now for some tech stuff.
At the bottom of the post I have added a 1-row, 2-column table. The left cell contains the text, the right cell displays the icons. The text is between divs with a unique id. The id consists of the string "sbtxt" followed by the post id (data:post.id). Each icon is a link to the specified social bookmark services, and can trigger a onmouseover-event and a onmousout-event. The onmouseover event trigger a call to a javascript showsbtext-function, passing the unique id of the left text-cell, and passing a number from 1 to N, N being the total number of icons. The javascript functions looks for the specified div, and replaces its inner text with another text, such as Add to Digg. The onmouseout-event again invokes this javascript, but now by passing a value of 0 it lets the function display the standard-text.
How to tailor it to your own needs.
You can replace the icons with icons of your own choice. You have to change the links between the <img/>-tags to accomodate for that. You could also change the text that is displayed, by downloading the js-file, and changing the string-array to the values you like.
But I am sure that with this way-points layed out for you, most of you will be able to work it out.
If you need help, please let me know!
Look Up Words as You Compose
1 day ago

This is what people say:
Right now, the "Improved Super Peek-A-Boo Post" appears in the DESCRIPTION section of del.cio.us, can you make it appears in the TAG section? I mean, how can I create a tag automatically so that people don't have to type in the tag. Thank you.
Hi Anonymous, the way it works now, the posts url is put into the url-field of del.icio.us, and the post title in the description field. I think the whole idea of del.icio.us is that the user wants to assign his or her own tags to the post, and not the tags that you define. So I think it works the way it should.
hello Hans. This is a good hack. I have added it to my blog and also extended it to other bookmarking sites. If you get requests for adding more sites, feel free to point them to my blog. thanks
hey hans!
This is a nice hack!
But there is one problem in my blog with this...
I did just as you have told in the instructions but the image border appears around the Bookmark Buttons...
Check the problem here:
http://bloggertemplatestesting.blogspot.com/
Greetings from Portugal.
Hans nice hack, i´ve experience the same problem as in the post above, altough the image borders dont affect that much on my blog there isnt any animation when hovering the buttons. Im hosting your script as i needed to translate it.
@archit
find the following in your template:
.post img {
padding:4px;
border:1px solid #cccccc;
change the border value to 0
@archit: if you want to remove the border around the buttons, you have to change its class. You can do it the way ricardo santos suggested, by setting the .post img settings, but I have provided a class named "bookmark". Add the following to your css-style:
.bookmark img { border 0}
@ricardo:
And if you want the push-style add:
.bookmark a:hover {
position: relative;
top: 1px;
left: 1px; }
Thanks Hans for the tips, the bookmark class doesnt work on my blog.
i have to change the post.img settings.
hi hans...
The code which you gave me is somehow not working...
.bookmark img { border 0}
I tried removing the space between { and border, then also its not working.
@archit: the mistake is mine. The correct style-declaration for the bookmark-class is:
.bookmark img { border: 0; }
The missing colon (:) between border and 0 is the reason why the code doesn't work on your site.
Hans, I added this to my blog! Love it. I wanted to add Ma.gnolia to the selection but can't figure out how to do it. Can you help? I did find a little png image that I can use, but don't know how to connect it properly. Thanks!!!
Hi Annie,
You have to add the following link to the row of 'buttons' you already have.
<a expr:href='"http://ma.gnolia.com/
bookmarklet/add?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",6);"' target='_blank'><img alt='Ma.gnolia' border='0' src='http://photos1.blogger.com/blogger2/
2604/6063341998323/320/magnolia.png'/> </a>
Replace the image source with yours, and you will be okay.
Thanks, Hans. I will do it when I get home (or get a chance)!
Hans, I got it. There was a part left out: "&title=" (the amp; part). Just wanted to put it here in case someone else was trying to do it also.
How do you get the graphics in that nice little box? My Ma.gnolia isn't in a box :-(
Hi Annie, I downloaded all the graphics from Vladstudio. But it is quite easy to get the image in a bigger box. I noticed that your magnolia-icon is a 16x16 picture. My icons are 24x24 pixels. Just create a 24x24 bitmap in paint, and in the menu select paste from... and load your image into the new bitmap. Position it in the middle, and save it as png, gif, or anything you like.
And Annie, draw a greyish box around the icon. Download one of the icons and open it in paint to see how it is done.
This is a very very nice hack but I think I`ve messed up. Big time.
Look here http://freak-squad-go.blogspot.com
@TVFan: Yes you did mess up a bit. You did not copy the code correctly into your template. Download the file bookmark.txt from the link that is given in the post. Save it as .txt, not as .html! Open the bookmark.txt with Notepad and cut/paste the entire code to your template.
If you look closely at the code, it is made up of a table with 1 row and 2 columns. The icons are in the right cell, the text is in the left. This left cel has a div called sbtxt, that is essential to this hack. It is missing in your template.
Hans, sorry to bother you again, but I just discovered that when I click on the Ma.gnolia button in my post footer, it leads to a "I'm sorry page". It should just bookmark it. What is wrong? I have looked at yours and compared it to mine, but no matter what I do, it doesn't come out right.
Oh, and one other oddity. When you hoover over the Ma.gnolia button, a little _ appears to the right of the button.
Hi Annie, I will look into your first problem asap, it just puzzles me now.
You second point, the trailing underscore, is caused by your coding and by your css. Your Mangnolia-link has the following structure: <a href="link"><img="button"/> </a> Do you notice the space between the image tag and the closing anchor-tag? This means that the link consists of an image plus a trailing space.
In your CSS you have a definition for your links. When they are hovered-over, they are underlined. So that is why you see a trailing underscore: it is not and underscore, but an underlined space. In your class "pushbutton" a:hover you should set your text-decoration to none to get rid of it.
Be back with you soon on the other problem.
Hi Annie, well, it took some digging into the code of your blog and mine to see the difference. Again: it is a space. Inside the href of the magnolia-link, you have a space just in front of the bookmarklet-word. Remove that space, and it will work (I guess).
I received the following comment from Don Yuan:
"Nice hack Hans! It worked on my blog during the first try! But theres still something that's nagging me. I'm not registered with every site which you have used for your bookmarks. Is that a problem?! Do pass by my blog if you've got time and tell me how to make it better!"
Well, Don, it is not a problem that you have no accounts with the social bookmarking services. The buttons are there not for you, but for your readers.
As your Blog contains explicit adult content I removed your comment with the link. The best way to improve your Blog would be to delete it, as there are many children-bloggers around that should not be confronted with this.
Hans, thanks for commenting on my blog...you are right, I did miss your response to my questions. I checked back on your blog and kept reading the recent comments to see if you responded, but must of missed it.
Anyway...you are awesome!!!!! I looked at that code one night until I almost went blind, comparing mine to yours. Thanks sooooooo much! It is all working as it should.
I noticed that you have your comments to show up a different color. How did you manage that?
Hi Annie, glad you have the bug fixed now. To highlight author-comments, checkout Ramani
thanks han,it work great man!i love this stuff now.hope your keep provide us with your latest hack!thanks a lot!
Hi hans^^
I am a beginner in Blogger Beta. Your blog "Beatuiful Beta" is really a good palce for the blogger to visit. I saw your betiful hacks (Social Bookmarking Revisited), and then i want to use the hacks on my blog. However, the characters appear messed up or scrambled in the descirption(title) fields of the del.icio.us page. It's due to that the encoding of title passed by IE will be incorrect, this might be fixd by encodeURIComponent funciton. So i would use the js code rather than the way you hacked. The code i used is modified from Julian.
Below is my code:
<a href="javascript:if (window.getSelection) desc = window.getSelection();else if (document.getSelection) desc = document.getSelection();else if (document.selection) desc = document.selection.createRange().text;else desc = '';if (title= prompt('Title',document.title)){ desc = prompt('Extended description (optional)',desc); void(open('http://del.icio.us/post?v=4&amp;url='+encodeURIComponent('data:post.url')+ '&amp;title='+encodeURIComponent('data:post.title')+ '&amp;notes='+encodeURIComponent(desc)));}"><img alt="Delicious" src="http://www.twistermc.com/RSS-images/delicious.gif" /></a>
I don't know how to let these two parameters data:post.title and data:post.url work.Similar Problem is also found in the Google Gruops.Could you give me some advice to edit the code?
I'm sorry to bother you, but I think you would be kind to a beginner.^^
Thanks a lot!
@shenez: looking at your js I would say that you are not a beginner :)
I did not test your code, I assume this is an old non-beta js-script.
I guess that to make it work, the href should point to a js-void() function, and the real work should be done with a onMouseclick-event. Check out how I solved this in this hack, I also struggled with this. I am short on time now so I can't delve into it any deeper now.
This is really cool, Hans. I have added this to my blogs!
should you provide the js source download?
I want to use it in my website.
Maybe you can mail it to me.
dugangs@gmail.com
Thanks for your hacking site.
Good wish!
@dugangs: you can get the download address from step 1 of the tutorial. Copy-paste it into your browsers address bar, and it will download. Save as .js-file, and open it with your Notepad.
its easy.. code hans below before code hackosphere. its double
<p class='post-footer-line post-footer-line-3'/>
example:
(hans code)
<p class='post-footer-line post-footer-line-3'/>
XXXXXXXXXXXXXX
............................
(hackosphere code)
<p class='post-footer-line post-footer-line-3'/>
</div>
</div>
</b:includable>
</b:widget>
</b:section>
hope its help to blogger team.
Hans~
I can't seem to get this to work! I tried it on my test site :http://artslave-test.blogspot.com/ and nothing.
I want to put it on my 'good' blog but how?
@Gina: did you add the javascript to your blogtemplate? It seems you didn't do that, and that's why it doesn't work.
Hey Hans,
You are God! I was desparately looking for a social bookmarking bar for my Blogger Beta blog. You have come up with a simply amazing hack.
I promptly put it up on my blog, and I must say, your hack is very user-friendly when it comes to implementation.
Cheers and keep up the great work!
@Kedar: thanks!
hmm maybe I'm using the one blogger beta template that doesn't have that p class you talked about- couldn't find it in my template. I'm using Rounders 3.
the head section is superlong with all the css and the body just has divs with b sections... no p tags- should I use a different template or something?
aha- and duh- I didn't have "expand widgets" checked, so I wasn't seeing it all...
hmm, ok, but why isn't my footer tall enough to hold them? I can't see where in the css I can change that- it's probably obvious, sorry, but I don't see it- thanks for your hack and help! oh, here's the blog
Hans, just wanted to say thanks for publishing such a great hack and making the instructions so easy to understand. It looks great on my blog.
Thanks for this grreat hack. One problem though, it takes one letter from my post title or the date and puts it in the line above. Any idea on how to fix this?
http://www.todayshottopic.blogspot.com/
I figured it out myself just now! Thanks again for the code!
@I-pod guy: look in your template for the </head>-tag. Insert the js-script just above this tag.
@adam, CD: thanks!
Hey Brian B. Carter, you are a life saver... I had no idea that I had to check that "expand widgets" box. I was going at it for a long time trying to find that stupid line and I could not find it!
Thanks!!! :-) You saved my sanity!
@Pappa: you might want to opy my stealbutton, put it on your blog with a link to my blog. Thanks in advance!
Hi Hans,
I like this hack, but I have a question. I use the peek-a-boo posts and would prefer for the Social Bookmarks buttons to show only in the expanded post not the summary. Is this possible? If not, can you advise as to how to make the buttons smaller.
Thanks
@Jenny: Vivek Shangi wrote an article on how to let widgets display only on certain pages. Check out he did that. You will see that the hack exists of a test, that looks like <b:if cond='data:blog.homepageUrl != data:blog.url'>, followed by some lines of code, and closed with </b:if>. So if you understand this, open your blog template, switch to edit HTML, expand widgets, and search for the bookmarking-code. Embed this code in the <b:if ...> lines, and save your template. The icons will only show up when you are not on the main page, but for example on your post's item page.
If you want to make the buttons smaller, download them (rightclick picture and save), edit them with Paint or any other drawing program, and host them from another location.
@Adrian: I don't see it working at all. Did you add it to the template?
hi hans...... i use this hack in my blog
http://just4kelana.blogspot.com
it's great,
but how i can make the line (see in my blog) go under the pictures?
really need your help :)
@Kelana: when you install this hack, you have to download a txt-file with all the code from my site. Open this file in Notepad, and take a careful look at it. You will see (if you are familiar with html) that I created a table with one row and two columns, the left cell contains the text, the right one contains the buttons.
If you want the text above or below the buttons, change the table to 2 rows and 1 column. The format will look like: <tr><td>text</td></tr><tr><td>buttons</td></tr>
Gracias!
Hello Hans!
I tried applying this cool social networking script, and it's real amazing, however, they don't fit the light blue box on my template. Is there a way to push them up, or lengthen the height of that blue box where they are?
Here's my blog: nostalgiamanila.blogspot.com
You will see under each post, a blue box with the "posted" (time), and "comments" links, and your social bookmark buttons.
Would really appreciate your help on this. I have also implemented your search bar, and Recent Comments script and they work like a charm!!!! This is the BEST hacking site for Blogger!!!! THANK YOU!
Looking forward to a response: nostalgiamanilamail@yahoo.com
Hans,
I ACTUALLY FIXED IT! Now your social bookmarking buttons fit within the blue box. Anyone who has a similar template, it's really an easy fix. Just add another line break tag towards the end of the long script, and viola! It fits perfectly!
Hans your hacks are the best!!!!!!
@Nostalgia: I hadn't found time to take a look at your blog yet, but I am glad to hear you fixed it!
Hi Hans! A small request. Could you make a code for Google Bookmarks? I did a poll on my blog and Google Bookmarks got a large share...22%. So, I would like to add it to my lineup!
BTW, you have been a busy little hacker!
Hi Hans - Thanks so much for the bar it's awesome - I have a small problem though on my blog at http://cajunfoodcooking.blogspot.com/
the mouse over does not work and I'd like to have them run in one line...can you ?
thanks
@Annie: it's ready. See my recent post.
@Ladesignz: you have to add the beautifulbeta javascript script tag to your template, then the rollover will work.
Sorry, I cant seem to find Footer Line 3. can you help?
@Shirazi: I guess you have a template without this postfooterline. Go to end of the post template, just before the <!-- End .post --> line. Insert the code there.
hi, tnx for this but i cant find the
p class="'post-footer-line"
may u help me locating it by taking alook at my template? thank you :)
@Vince: I looked at the sourcecode of your blogpages, and I definitely can see a class="post-footer" there. Make sure that you are in html-edit mode, and click Expand Widget Templates.
Good luck!
Thank you very much. I saw it already but still having the difficulty of putting texts like "Add to Digg" thing as you mentioned. Im frustrated but never giving up, reason why I am tempted to visit this entry again, LoL! Hmm, im just a novice with HTML. I appreciate much your reply, sir. Merry Christmas.
Hello Hans!
Could you say as experpt an opinion that can Vivek´s google translator and your social bookmarketing system used simultaneously in same blog?
@George: I guess they work together fine. I have Google Translator on my blog as well.
hi Hans, i did, paste the script and the file into my template but still they dont work, just like when the cursor hover at the icon, the "Loading" text doesnt even change, are there still lacking? here is the link if u may see it... i saved it for u to look at, than you...http://recedo.blogspot.comawa
I tried to add vivek´s translator in "post-line-3" where is also added your social bookmarketing- code. Could you give me a hint what to check out?
@Vince: you have to add some javascript to the head of your template, see step 1 of the instructions. I checked the sourcecode of your blog and the javascript appears to be missing.
@George: I could be of help if you can tell me what problems you have with your Blog. I visited your blog, but it seems to have no posts, so I can't take a look at the post footer lines.
when I try and add it to my blog I get this error:
Please correct the error below, and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The reference to entity "bkmk" must end with the ';' delimiter.
any ideas?
seems the issue is with the google code - when i remove the google link it works.
here is my blog: http://cutedogsblog.blogspot.com/
anyt ideas how to get google to work?
@Mike: my experience is that the Blogger editor is very critical when saving code. It check if everything is correct XML before saving, and then error messages might pop up. The message you mention seems to happens when you are using an &-symbol, while Blogger expects &. You have to try fiddling with the code, checking all parentheses etc.
Thanks for the sigs, this is a really good hack that I hope will help me build some traffic to my blog.
I had trouble with the Google bookmark as well. I managed to get it to work by using the Spurl image instead of the Google one (icon_sb_spu.gif instead of icon_sb_goo.gif), and also by changing & to & in a couple of places. There seems to be some kind of issue with the Google image.
Ian
SELECTPrivacy.blogspot.com
Hi Hans,
I have installed the Neo template by Ramani, and was very keen to include Social Bookmarks
I followed your instructions from the post but somehow it is not working, Can you look into it and suggest some thing?
@ian: I don't know what the issue with the Google icon is.
@nitin: as far as I know Ramani's neo template doesn't use the template widget for posts, but retrieves the post from a JSON-feed, and displays the post using his own javascript function. That is why the hack doesn't work. But maybe it is best to contact Ramani on this subject.
error:
XML error message: The reference to entity "bkmk" must end with the ';' delimiter.
i have copied the code verbatim- help.
sorry, I cannot understand need for this. since interest for bookmarking one particular post would be almost none (when compare to 'bookmark this page').. so, show bookmark icon for every post may not be that great idea. instead, this could be added in sidebar..
how can this be implemented in a widget template? plz help
Hi hans:
I have the same problem like matt:
error:
XML error message: The reference to entity "bkmk" must end with the ';' delimiter.
i have copied the code verbatim- help.
please help!!
Thanks a lot !
Hi,Hans
I'm tried so many time but not working,my problem is same like matt and unknown ??
Thank in advance.
to Yuva this is for beauty purpose and impression to our blog look like and that why
Hans call this blog beautiful beta..
@all: the XML-error should be solved now, I updated the bookmark.txt-file.
Hi Hans, I would like to implement this code but I cannot find the ++p class='post-footer-line post-footer-line-3'/++ in my test template. Can you be of assistance?
I am in the transition from moving my classic blogger template to the new style. My test blog is here: http://thedailykimchi1.blogspot.com/
Remove the "1" and you will get my real blog. Thanks for helping us, this is really great. :)
Hans,
social bookmarking is unbelievable hack. Whenever i try it at my blog lifefilter.blogspot.com my posts disappear. YIKES! any suggestions. Im unclear oh where i add the first bit of code. You mention the head of the blog.. Is that the header? or a particular line of code? any answer would be most helpful and greatly appreciated.
thanks
ross - lifefilter@gmail.com
@gdog: the idea is that you insert the bookmark links in the footer of the post. It appears that your template has a <p class="post-footer"> post footer. You can try inserting the bookmark links there.
@ross: the javascript line should be in the head of the template, just above the </head>-tag.
thanks hans! will give it a shot! Very grateful to have dedicated programmers like yourself out there.
-ross
Hi Hans, I am trying to implement the script following the easy instructions, but when I save the template and preview the blog, HORROR! ALL the content of the posts has disappeared. A white line is only seen.
Could you help me, please?
Hans,
I have installed the widget @ my blog http://karmatarsis.blogspot.com, but once I installed it, the entire posts in my blog doesn't appear.
In order to my posts appear I needed to clear the widget again.
I appreciate your help on this
@Ross: thanks!
@Alex and Natanael: could you set up a test-blog, using a copy of your real blog's template? Then add the code there, and see if it happens there too. Then give me a link to this testblog so that I can see the problem in action.
I tried this and the post page refreshed to a blank page, it did not show anything. Any advice
Great hack Hans. I posted it on my blog (http://ryanmapes.blogspot.com ) several months ago and it has worked beautifully. I don't know much about coding, so I needed a little bit of help from a programmer to make everything work in the new blogger....but it's all there now.
Thanks!
I looked up your previous post and found the google javascript update, and it worked HURRAH actually thought I left a tag open or deleted something
Hi, Hans. I'm sad to say I've encoountered the exact same problem as Alex and Natanael. Everything just disappears! I followed your advice and here you have my test-blog:
http://www.errepececomps.blogspot.com/
I've tried this hack on my blog, on my brother's (I'm helping him because he's more technologically challenged than me - by the way the template of my test-blog is the one he uses), and now on this test with the same result. Can you help me?
Thanks in advance and keep up the good work!
@Errepece: there was a bug in the coding, caused by my adding a new bookmarkservice to it. It should be working now, if you download the .txt-file again and paste it into your template.
Hi Hans,
at first thxx a lot for ya gr8 support here. when our blog is completly relaunched we will give u the right tribute 4 sure.
but i am sad to have to tell ya that i do have the same problems as Errepece. We use a nearly kind of template as Errepece, but with 3 columns. http://online-dating-news.blogspot.com/index.html
When i included the code, i got the same result as Errepece and i downloaded the new code u told us a line above.i have deleted the code again from the form to make the blog work again.
Another little question: the actually post is the first on our blog after i included the peak-a-boo script.do ya have any idea how i can make the margin from the last word in summary to the "read more" a bit shorter?
thxx again 4 all ya do here
Hi, Hans. Thank you for your effort, but I'm sad to tell you it is still not working. I tried the new code on my test-site with the same results. I'm sorry to bother you again but I would really like to implement your nice hack on my site. Thanks.
Hans I have the same problem that my entire blog doesn´t appear. I tried to solve it following the directions you gave. I use the new bookmark and i placed the codes in the (i think) the right place.
Heres´s a link to a test blog as you suggest i hope you can help me please.
http://prueba-anibal.blogspot.com/
I'm kind of newbie in this ...
@Anibal, Errepece and others: I took a look at Anibal's testblog, and looked into the page source. It seems that there is no Blog Posts widget at all. I suggest that we work together to solve the problem. Anibal, woul it be possible for you to do the following: first, delete the code for the social bookmarking buttons from the post-widget (but leave in the beautifulbeta.js script in the head). Now save and see if it works. The, 1 by 1, try to add pieces of code for the bookmarklinks to your template, and save. Maybe that way we can find the culprit!
UPDATE: I have uploaded a new bookmark.txt file that has an exact copy of the code in my blog template. I have tested using this new file on a testblog and there it works fine. I noticed that when I copied the code and pasted it into Blogger's editor, spaces and linebreaks were added. If one of the spaces is in the javascript-call, the javascript generates an error, and the post widget will not be displayed. So check to see that there are no unnecessary line breaks, especially between showsbtxt and the ( that follows it. Good luck!
Hi, Hans. Now it works wonderfully. Thank you so much for your help. Once again I translated your hack into Spanish. You can see it working here:
http://modestiaaparte.blogspot.com
Thanks again and see you for the next hack.
Hi Hans,
u r on the right way. Watch the result: http://online-dating-news.blogspot.com
The only problem, is that the google button isnt shown completly. Now we have only to fix the "bookmark this post" above the icons, or to find a way that the icons r showm in two lines.
plz make my day;-)
thanks ALOT for the Great hack! but there one tiny problem i cant seem to fix...the social bookmarks appear in the post footer right? i cant seem to get them to fit into the post footer margins...any ideas on what i have to change to get them to fit?
http://dragonsofeden.blogspot.com
Thank you! oh great hacker! :) Cheers
and the social bookmark icons arent animated either...why is that?!?! confused confused!!!! dimi needs Hans's help!!! heheh thanks alot! have a great day!
http://dragonsofeden.blogspot.com
@Dimitri: the bookmarkbuttons are wrapped inside a paragraph-element; as you can see it is between a <p> and a </p>-tag. Just before the </p>-tag insert the following code in your template: <span style='clear:both;'></span>. This will make the buttons fit inside the box.
Now for the animation: in the skin of the template, you have to add a class with style definitions for the buttons, as explained here
Han...your a lifesaver!!! :) the coding works fine...its pretty much perfect! hehe the animations are fully functional and it all fits within my margins! Thanks ALOT for the kind assistance and some awesome coding! Cheers! Dimithri Perera - The dragon of Eden.
http://dragonsofeden.blogspot.com
is there a way for us to infer the posting code for other social bookmark sites, like NewsVine?
BTW, I'm now using three of your hacks -- by far yours is the most valuable resource for blogging widgets I have encountered!
This blog is awesome! Thanks Hans! I've incorporated the Social Bookmarking Hack into my blog and it's great!
More power to you!
thanks for sharing.Good tip.
Free Wallpapers
This worked brilliantly. Thanks.
Furl code isn't working at all!
See also
http://www.exploding-boy.com/2007/01/31/add-social-bookmarks-to-blogger/
for better icons (specially the furl!!!)
Hans- thanks for the hack and the easy to follow instructions. it looks great on my blog. I do have a question about functionality. When I click on the Technorati link for the lead story on my blog, it searches for the full story URL (vs. the shorter general URL) which no one has linked to. Would it make more sense to have it search just for atlantaeats.blogspot.com vs. atlantaeats.blogspot.com/2007/02/joke-is-on-us.html? Same thing for del.icio.us? Trying to make the most of this great new tool. Thanks!
I don't understand. This isn't working for me at all. Every time I post this code into my template I get and error saying the 'div' tag isn't closed. I seached the entire file you provided for instance of the div tag and only found one which was properly closed. Yet taking this code out of my template resolves the error. What gives???
Hi Hans,
I have add your social bookmark to my blog.. Take a look at http://myinvestmentjourney.blogspot.com/...
Hi Hans,
Thank you very much for this social bookmarking widget, especially for hosting the icon at your web server.
I will download those icon and move it somewhere else, so it doesn't steal your bandwidth.
Hello Hans,
I've been using your beautifulbeta.js for a long time now and although I couldn't reach you by email, I would like to ask you the following:
Is it possible to have a selection of bookmarking sites on the script? I just need Digg, Reddit, Yahoo, Delicious, Netscape, and StumbleUpon.
I will be tracking the comments here so please type back as soon as possible or contact me via email.
Kind Regards,
ilker yoldas
www.thethinkingblog.com
I love this hack, but it has bothered me that the Technorati link was a url 'cosmos' search rather than a link to add to favs, which is the equivalent function of all the other buttons.
I found code to do just that. The boilerplate should be:
href='"http://technorati.com/faves?add=" + data:post.url'
instead of
href='"http://www.technorati.com/cosmos/
search.html?url="
@John: thanks for the update. I am currently reviewing and updating the hacks on this blog. As soon as I start working on the SB-hack I will fix this one.
Thanks it works for me. I just got to work on the formatting of my blog.
See http://prolight.blogspot.com/index.html
Marc.
I have got the social bookmarking and 3 columns working. Thanks Hans for your great blog.
Thanks.
See it on freshapps.blogspotcomowc
Thanks for this hack. I just added it last night.
Hi, hans. Awesome hack! I put it on my Linux blog.
Would you tell me please if you know how2 place Printable Page ("Print This Page", smth like that) on weblog posts?
You can add Digg, StumbleUpon and Del.icio.us using social bookmarking links to the end of blogger posts.
Instructions here:
http://100-dollars.blogspot.com
Hans,
This is great.
I would like to add this to my blogger-hosted research site, and I am not particularly interested in having my users bookmark posts so much just the site itself, so I want to put your code into a page element somewhere. Can I do that by just changing the first line of the code? if so, what do I change it to??
Thanks much,
Mike
Have you considered adding Facebook to the bookmark list?
Hans,
Great hack....I can't get the animation over the buttons to work..mind taking a look?
http://www.homeconstructionimprovement.com
"@Jenny: Vivek Shangi wrote an article on how to let widgets display only on certain pages. Check out he did that."
This post was in reference to widgets. What is the specific code to make this work for the social bookmarking icons as described on your pos
I don't want the social bookmark icons to appear on my home page.
Thanks!
I think I followed your directions, but the social icons aren't clickable, and there's no rollover effect:
http:www.//georgewashington.blogspot.com
Help!!!
I think I followed your directions, but the social icons aren't clickable, and there's no rollover effect:
http:www.//georgewashington.blogspot.com
Help!!!
I desperately want to use the social bookmarking tool on my blog but I don't have the footer tag you've listed. I've tried this a million different ways and I can't get the links to work. Can you please help me? I've spent hours on this since I have no clue what I am doing.
=)
http://dayngrzone.blogspot.com/
Take a look at http://www.entopica.com/, a new social bookmarking website
It is an online system that allows you to easily access, categorize, share and store your bookmarks online
Entopica offers a free registration and it is both quick and easy. Register now and discover a whole new world of social bookmarking
I added this widget to my blog at
http://widgetsforfree.blogspot.com
I tried configuring a link to stumble upon but when you hover over, it says "add to mag.nolia". I'm not sure how to fix this.
Hi Han, Just tried it to my blog http://shoughunsecondlife.blogspot.com/ but it seems that the hover thing while the right text is changing does not work on me... Thanks...
Hans,
I got the technorati button to work on my blog. You can now easily add any of my posts to your technorati favorites. Anyone feel free to check my site out to see how it works...
Hi Hans. I love the site. Thanks for all the great hacks. I cant seem to get the downloadable file for the social bookmark bar hack. Can you help me?
Patrick
Thans a lot! i look to try the code on my blog: http://britneyzer.blogspot.com/
link for the bookmark.txt it's old and expired
Hey hans,
From looking at this widget I really wanted it,But I could not figure it out,
The code link is expired!!!!
Thanks
Bad link on the downloadable? It seems to not be there anymore. =(
Thanks for sharing best information about SEO.i have also found one website which offier similar services"Directory Submission,One way Link Building,Social Bookmarking"
Social Bookmarking Services,Directory Submission Services,One way Link Building,Social Bookmarking
Share your thoughts!
Feel free to post your questions, remarks and comments here. Moderation is set for this blog, so your comments will appear in due time.
Look who's linking here!
0 Backlinks point here