Grow your CSS skills. Land your dream job.

Last updated on:

Automatic Social Media Links

This would go inside the loop, probably underneath the_content(), probably in your single.php file.

// bookmark on Delicious
<a rel="nofollow" href="http://delicious.com/post?url=<?php the_permalink(); ?>&amp;title=<?php echo urlencode(get_the_title($id)); ?>" title="Bookmark this post at Delicious">Bookmark at Delicious</a>

// submit to Digg
<a rel="nofollow" href="http://digg.com/submit?phase=2&amp;url=<?php the_permalink(); ?>" title="Submit this post to Digg">Digg this!</a>

// tweet on Twitter
<a rel="nofollow" href="http://twitter.com/home?status=<?php echo urlencode("Currently reading: "); ?><?php the_permalink(); ?>" title="Share this article with your Twitter followers">Tweet this!</a>

// submit to StumbleUpon
<a rel="nofollow" href="http://www.stumbleupon.com/submit?url=<?php the_permalink(); ?>&amp;title=<?php echo urlencode(get_the_title($id)); ?>" title="Share this post at StumbleUpon">Stumble this!</a>

// share on Facebook
<a rel="nofollow" href="http://www.facebook.com/sharer.php?u=<?php the_permalink();?>&amp;t=<?php echo urlencode(get_the_title($id)); ?>" title="Share this post on Facebook">Share on Facebook</a>

// submit to Blinklist
<a rel="nofollow" href="http://blinklist.com/index.php?Action=Blink/addblink.php&amp;url=<?php the_permalink(); ?>&amp;Title=<?php echo urlencode(get_the_title($id)); ?>" title="Share this post on Blinklist" >Blink This!</a>

// store on Furl
<a rel="nofollow" href="http://furl.net/storeIt.jsp?t=<?php echo urlencode(get_the_title($id)); ?>&amp;u=<?php the_permalink(); ?>" title="Share this post on Furl">Furl This!</a>

// submit to Reddit
<a rel="nofollow" href="http://reddit.com/submit?url=<?php the_permalink(); ?>&amp;title=<?php echo urlencode(get_the_title($id)); ?>" title="Share this post on Reddit">Share on Reddit</a>

Reference URL

Comments

  1. Krinkle
    Permalink to comment#

    Awesome !

    This is an great collection of usefulness here.
    All the major links and codes we need to either use as-is or built or (sprite-powered ;-) ) GUI-version of it.

    Thanks !

  2. Thanks for making these links available in a form any web publisher can understand — I’ll try to make my own, more customized, images to link with these social bookmarking sites!

  3. Permalink to comment#

    I can’t get these to validate, anyone know what I might be doing wrong. This is the message I get,

    “general entity “t” not defined and no default entity”

    I’ve created a facebook share button on a wordpress blog.

  4. Permalink to comment#

    Big Thanks to make it easy to include to our Coda App ;)

  5. Permalink to comment#

    Nice post! Very helpful indeed!

  6. Thanx a lot buddy.
    Isnt there any app which submit to these sites automatically with minimal interaction possible?

  7. thanks to sharing social bookmarking button good post

  8. Permalink to comment#

    Nice one ..

  9. Great! This is the way to do without any plugins :)

  10. this nice code however all goes no to ready plugins its easy to be used

  11. Wow dats great …….. no need of JS and plugins in wordpress

  12. Nice list – However the Twitter one doesn’t seem to work anymore.

    This one does:
    http://twitter.com/share/?text=description+text&url=http://my-url.com/ – And it automatically runs it through Twitters shortlink service as well..

  13. to twitter, I prefer to use tweetmeme, because the count from twitter.com sometimes invalid.
    thank you for this information.

  14. Permalink to comment#

    Nice.. thanks, useful code.

  15. Permalink to comment#

    You always have the best info. Thanks for all your sharing.

  16. very helpful ! thx :)

  17. ilana mullin
    Permalink to comment#

    this is great! finally a way around those damn chicklets. custom icons and no more share counts!

    i’m curious about how to do the same thing for google+ and linkedin… any thoughts?

  18. Thanks for the great info, Chris. As always, spot on.

    @ilana, I did come across a way to also add a Google+ share link without the Plus icon. A bit late to your post, but in case this helps, here it is in the same format as Chris’s example above.

    
    // share to Google Plus
    <a rel="nofollow" href="https://plusone.google.com/_/+1/confirm?hl=en&url=<?php the_permalink(); ?>" title="Share this post on Google+">Share on Google+</a>
    
  19. On a related note, here is a share link for LinkedIn as well, formatted as the above.

    
    // share on LinkedIn
    <a rel="nofollow" href="http://www.linkedin.com/shareArticle?mini=true&url=<?php the_permalink(); ?>&title=<?php echo urlencode(get_the_title($id)); ?>&summary=<?php echo get_the_excerpt(); ?>&source=<?php bloginfo('name'); ?>">Share on LinkedIn</a>
    
  20. ilana mullin
    Permalink to comment#

    Awesome Jonathan! Thanks for sharing the knowledge!! I had figured out a way for both, but yours are awesome too. Google+ was the sort tough one. For some reason, the box that popped up for me was always in a different language than English, I couldn’t figure out why, the URL was plusone.google.com. I’ll have to try your solution out!

  21. Very useful… many thanks! One little problem, I’m displaying this:
    ” title=”Share this article with your Twitter followers”>Tweet this!
    …when I cut and paste the twitter code. I’m looking closely and comparing with the FB code which seems to be working.

    Please and thanks for any insights.

  22. Hi @Michael, what exactly isn’t working?

    • Michael
      Permalink to comment#

      Hi Jonathon,

      I believe this portion:

      ” title=”share this article with your twitter followers”>

      should not be appearing in the browser. I’m cutting and pasting the snippet so I don’t think I’ve altered the mark up in any way. I put the Facebook snippet in and it says “share on Facebook” in the browser. Which seems correct although The link takes me to Facebook but doesn’t paste a link to the page in text window on Facebook. Maybe that is what is supposed to happen. I don’t understand php but it does kind of look like it wants to get the permalink to the page.

      Thanks for your interest and the help.

      I’m using this on a development site at: http://durmpbeta.h5video.com

    • Hi Michael,
      What are you using for a code editor? On my local dev, the Facebook link carries the link with it, and the Twitter works fine.

      Maybe try copy / pasting the code snippets into Notepad, Notepad++ or any other simple text editor. If you’re using something like Word, or a rich text editor, then you might be having issues with some of the quotation marks and symbols. Could try pasting into Notepad++, select a quotation mark and type the quotation over to see if it switches to a simple quote. Hope that works for you. Nice photos on your site.

  23. Thank you for the feedback Jonathon. I will reveal my ignorance and tell you I was just copying and pasting out of the browser window. I’m now putting it into Textmate and saving as a php file before copying it. This did clear up the code showing up in the browser but I still don’t get the link carrying over to FB.
    I have more to experiment and work with now and really appreciate your insight into the problem.
    The photos are indeed nice, but, alas they were taken by my friend who is also named Michael. I’m converting his static site to a WordPress site so he can more easily update his content on his own.

  24. Permalink to comment#

    Very nice code

  25. Permalink to comment#

    Very very cool !!

    Now, only need link to share via mail

    any idea?

  26. Permalink to comment#

    This is awesome info. I’ve been searching for exactly this!!!
    Can someone tell me if I can just replace these for the addthis code I’m actually using?
    It’s because I’m tired for them (addthis) to slow my pageload.

    Thanks to all and,

    Greatest 2013 to you all!!!

  27. Permalink to comment#

    I’ve implemented most of them… works beautifully except for the g+ which I replaced with this one (retrieved from Google) on this comment date:

    
    a href=https://plus.google.com/share?url={YOUR_URL} title="Share this on Google+">Share on G+
    

    Thank you all!!!

  28. Daniel
    Permalink to comment#

    Pinterest? Anyone?

  29. kartonnade
    Permalink to comment#

    Hey!

    Thanks for this snippet! It was excactly what I was looking for!

    If anyone is interested, after reading this I’ve created a small tweet_this($post_id); function for generating Twitter Urls in WordPress with an excerpt of your choice.
    For instance you can use advanced custom fields or the_excerpt() or the_title() as a fallbacks to generate the Tweet.

    The Tweet is shorten to 140 before creating the url.

    You can as well shorten the link if you wish.

    You just have to call the function to generate the URL :

        
            <a rel="nofollow" href="<?php echo tweet_this($post_id); ?>" title="Share this article with your Twitter followers">Tweet this!</a>
            
        
    

    And your Tweet will look like :
    “Currently reading http://example.com/?p=101 : Your wonderful chosen (and shorten if needed) excerpt or the_title() as a fallback”

    Check the Gist : https://gist.github.com/kartonnade/5221436

    Any feedback or improvement is welcome!

  30. Awesome work! Thanks for sharing this snippet. I like this because the fact you do not have to use a plugin which I feel slows your load time down.

    Thanks again,
    Ryan Wagner

Leave a Comment

Posting Code

  • Use Markdown, and it will escape the code for you, like `<div class="cool">`.
  • Use triple-backticks for blocks of code.
    ``` 
    <div>
      <h1>multi-line block of code</h1>
      <span>be cool yo.</span>
    </div>
    ```
  • Otherwise, escape your code, like <code>&lt;div class="cool"&gt;</code>. Markdown is just easier though.

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".