Herself's Webtools

Scripts, HowTos, Templates, Plugins, Widgets, Tips

How to add ‘StumbleUpon’ links to your blog posts

with 16 comments

First backup your template.

Go to Layout->Edit HTML and click download full template.

Blogger

<a expr:href=’”http://www.stumbleupon.com/submit?” + “url=” + data:post.url + “&amp;title=” + data:post.title’ target=’_blank’> Stumble it!</a>

For Blogger go to your Template->Edit HTML and click expand widgets.
Find <p class=’post-footer-line post-footer-line-3′/>

It’s about three quarters of the way down in most templates.

Then just add the above code just below that line.

WordPress

<a href=”http://www.stumbleupon.com/submit?url=<?php the_permalink(); ?>&title=<?php the_title(); ?>”> Stumble it!</a>

James Wilkes Design sent me a corrected version of this link ( see comments below: )

<a href=”http://www.stumbleupon.com/submit?url=<?php echo urlencode(get_permalink(get_the_ID())); ?>&title=<?php echo urlencode(get_the_title(get_the_ID())); ?>”>Stumble it!</a>

You will want to edit your template to add the link.

Go to Presentation->Theme Editor

Select Main Index Template, or index.php or what ever the index page is called in your template.

Find the section that has the postmetadata add the above code in there somewhere that looks nice on your template.

See also:
How to add Digg Links to Blogger and WordPress Posts
How to add Del.icio.us Links to Blogger and WordPress Posts
How to add Reddit Links to Blogger and WordPress Posts

Written by Linda MacPhee-Cobb

May 14th, 2007 at 4:35 pm

Posted in blogger,blogger template,hack your template,how to,wordpress

16 Responses to 'How to add ‘StumbleUpon’ links to your blog posts'

Subscribe to comments with RSS

  1. Thanks for the tip! :-)

    Wei-Yee Chan

    10 Jun 07 at 2:58 am

  2. You’re welcome!

    herself

    11 Jun 07 at 4:14 am

  3. Clearest explanation so far! Consider yourself stumbled.

    M

    13 Jun 07 at 3:43 am

  4. I’ve decided to add a link to this blog on my blog, if you don’t mind.

    >http://chanweiyee.blogspot.com/2007/06/interesting-links-13th-jun-2007.html 

    Wei-Yee Chan

    13 Jun 07 at 8:04 am

  5. Thank you!

    herself

    13 Jun 07 at 11:45 pm

  6. Maybe I’m a complete blonde, but I’ve read several instructions from several different bloggers online on how to add stumbleupon to my blog and I still don’t get it.

    Do I go to the CSS editor for the theme? (I’m on WordPress) I can’t find any other type of editor.
    Thanks for the help.

    trumpethope19

    23 Nov 07 at 8:07 pm

  7. It’s ok, my fault.

    1) If you are using WordPress then in the Admin area go to Presentation
    2) Click on Theme Editor
    3 ) Go to your index.php template
    You will find a section ( every template is different ) that looks like this

    < ?php the_content(...something);?>

    Put it directly under that
    4) You will also see a file called single.php Do the same thing to that file.

    * backup your template first!!! ( ftp to your site and download it )

    admin

    24 Nov 07 at 9:46 am

  8. Thats the problem. When I go to Presentation there is no Theme Editor to click.

    There is: Themes, Widgets, Extras, Custom Image Header and Edit CSS.

    Is there a program I have to download first to get all of this to work or something?

    trumpethope19

    24 Nov 07 at 5:46 pm

  9. I see the problem – you are hosted on the WordPress.com site. They only allow very limited editing of templates.

    I see they do have a del.icio.us widget but no Stumble upon.

    I played around with it for about a half hour and I don’t see an easy way to add Stumble Upon links. WordPress doesn’t allow PHP in posts and there is no way to get to the template.

    I don’t see a way to add Stumble links except by hand for every post as long as your blog is hosted there.

    If you replace
    < ?php the_permalink() ?> with the link to the post

    and replace
    < ?php the_title(); ?> with the title of your post

    You can do it by hand for each post.

    admin

    24 Nov 07 at 10:43 pm

  10. Please help me. I have carefully searched the body of template after clicking the “expand” box. I can not find

    It is just not there. the closest I find is

    I am using blooger
    thanks, rod

    Rodwilliams

    22 Mar 08 at 6:30 pm

  11. What I do when I have a huge file to search ( like the Blogger templates ) is to copy and paste the text into your favorite text editing program on your home machine – then search for the text you are looking for.

    I just tried doing this with Firefox and it did not expand the template. If you, like me, are using the beta Firefox, try a different browser. It did expand in Safari for me. So perhaps you can’t find it because your browser did not expand the template for you?

    The place you are looking for is about 2/3rds of the way down the template. Usually right near the line that says ‘quickedit pencil’.

    herself

    23 Mar 08 at 12:07 pm

  12. Hi there, I was overjoyed to find such clear and simple instructions on how to do this because I don’t appear to be able to do a lot of this stuff from the info I’m given by tools like Stumble Upon. However when I went to look for the code:

    it wasn’t in there. I used the control f function and it just wasn’t there.

    I am using Blogger, and the template I am using is Rounders 4. Should I be looking for a slightly different piece of code or am I being really dumb?

    I really want to add the Stumbleupon, Delicious, Reddit etc. functions on to my blog – I am trying to get to know all this web 2.0 stuff so that when I start my business I can add a blog, and try to do it properly.

    So even if I am being really silly, please help!

    Thank you so much,

    MinkMama

    MinkMama

    15 Jun 08 at 2:56 pm

  13. Right now Blogger is giving me errors when I try to edit the template, but…

    In Rounders4 look for the line
    div class=’post-footer’

    under that is post-footer-line-1

    I can’t test now but just under one of those lines should be about right. Go there, try it, you may have to play with it and go up or down a line or two. But you want it in that general area.

    ljmacphee

    15 Jun 08 at 3:54 pm

  14. Hi. Nice article but I’ve got a technical improvement. It’s best to url encode the url and title in case of ampersands or whatnot in the title. It’s a little awkward I’ll admit but this works for me (wordpress 2.9.1):

    <a target="_blank" href="http://www.stumbleupon.com/submit?url=&title=“>Stumble it!

    jameswilkes

    16 Mar 10 at 12:54 pm

  15. Hmm, that got garbled rather badly :-(

    jameswilkes

    16 Mar 10 at 12:55 pm

  16. Thank you!

    Sorry I was out of town and today’s the first chance I’ve had to play with this. Yes, my version no longer works and yours does a fine job of Stumbling the link.

    Here is James version of the Stumble upon link:

    <a href=”http://www.stumbleupon.com/submit?url=<?php echo urlencode(get_permalink(get_the_ID())); ?>&title=<?php echo urlencode(get_the_title(get_the_ID())); ?>”>Stumble it!</a>

    timestocome

    21 Mar 10 at 8:17 am

Leave a Reply

You must be logged in to post a comment.