Share Your del.icio.us Links With WordPress
By Ronald Huereca on Mar 22, 2008.
One of the features of the new RA Project re-design is to have a place where I share relevant links on reader appreciation. After debating the appropriate technique for link sharing, I finally went with del.icio.us to start a link blog for WordPress.
Within this article I will share a step-by-step tutorial on integrating your del.icio.us links with your WordPress (2.2 and up) installation.
Step 1: Get an Account
While it should be obvious, you can’t share your del.icio.us links without an account.
If you don’t have an account, registering is easy enough.
Step 2: Post Some Links With Appropriate Tags
You’re going to want to start posting some links so that they’ll show up on your blog.
One important thing to note here is your use of tags. Use a unique tag for every link you want to show up on your blog. For our blog I choose “raproject”. So basically anything tagged “raproject” will show up on this blog.
Step 3: Modify Your Theme
Open up one of your WordPress theme files (I decided to place the links in my “footer.php” file) and insert the following code:
<div id="linkblog">
<a href='http://del.icio.us/ronalfy/raproject'>del.icio.us Links</a>
</div>
The above code is a place-holder for the real del.icio.us links to show and is a nice fall-back for users who don’t have JavaScript enabled. Just be sure to modify the above link to point to your own del.icio.us links.
Step 4: Add the LinkBlog JavaScript File to Your Theme Directory
Please download the LinkBlog JavaScript file and place it in your themes directory after unzipping it.
If you’d like to customize the output, please modify line 12 in the file. There’s three outputs that del.icio.us provides:
- post.u – The link URL
- post.d – The link Title (Description)
- post.n – The link notes (Long Description)
Feel free to customize to your heart’s content if you’re comfortable with JavaScript.
Step 5: Modify Your “functions.php” File
You’ll need to tell WordPress to load the JavaScript files. The best way is to add the appropriate code to your “functions.php” file. Every WordPress theme should come with one, and if not, it’s pretty easy to create an empty one using a text editor. I’ll also provide a downloadable sample “functions.php” file if you need one.
To load the appropriate JavaScript (I’m assuming you placed the JavaScript file in your theme directory), please add this code to your “functions.php” file:
add_action('wp_print_scripts', 'addScript');
function addScript() {
wp_enqueue_script('delicious', 'http://del.icio.us/feeds/json/ronalfy/raproject?count=5');
wp_enqueue_script('delicious_footer', get_bloginfo('template_url') . '/link-blog.js', array('jquery','delicious'), '1.0');
}
The above code adds the appropriate JavaScript files to your WordPress theme so the links can show up.
You’ll want to modify the path to the first file, which in this example is: http://del.icio.us/feeds/json/ronalfy/raproject?count=5
Say for example your username is “rachel” and you want to only show links with a tag of “blog“. Your link would be: http://del.icio.us/feeds/json/rachel/blog?count=5
For more pointers on modifying your link, please check out the JSON Post Feeds over at del.icio.us.
Step 6: You’re Done!
After you’ve followed the above steps, you should now be able to see your del.icio.us links in your blog footer (or wherever you chose to put them).
I personally find del.icio.us links a lot more flexible when showing a link blog because I can specify which tags to display. Using the custom JavaScript I provided can also lead to some nice customization possibilities.
Conclusion
Thank you for reading my short tutorial on adding del.icio.us links to your WordPress blog.
All the code mentioned in this post can be downloaded here.
Here is a link summary of the places I mentioned in this post:
This article is a part of the del.icio.us social media mega group project.
Random Posts
Popular Posts
Recent Posts
Recent Comments
- ??100??Wordpress???? | ????: ... WP Ajax Edit Com
- rmilana: Bes,imo they're pret
- Daniel: Bes, from what I obs
- Bes: Thanks for the comme
- Denzel: I doubt people come
really, really cool. Thanks for the del.icio.us advice, Ronald. Should definitely try it on my blog as well.
Comment by inspirationbit — March 22, 2008 @ 3:59 pm
Glad you like it Vivien. Just make sure your WP is 2.2 and up as the technique requires jQuery.
Comment by Ronald Huereca — March 22, 2008 @ 4:08 pm
[...] Share Your del.icio.us Links With WordPress @ raproject.com [...]
Pingback by That sounds delicious: How an online bookmarking service can improve your life | On Financial Success — March 22, 2008 @ 6:04 pm
[...] Ronald teaches us how to Share Your del.icio.us Links With WordPress. [...]
Pingback by Across The Universe With Social Media » Inspiration Bit — March 29, 2008 @ 7:33 am
[...] Ronald teaches us how to Share Your del.icio.us Links With WordPress. [...]
Pingback by Across The Universe With Social Media » Inspiration Bit — March 29, 2008 @ 7:33 am
[...] How to Share Your del.icio.us Links With WordPress by Ronald [...]
Pingback by Results from the Social Media Mega Group Writing Project } Group Writing Projects — March 31, 2008 @ 2:13 am
[...] Share Your del.icio.us Links With WordPress | The Reader Appreciation Project how to add del.icio.us to your sidebar or elsewhere in wordpress and maybe other blogs. (tags: wordpress del.icio.us links tags) [...]
Pingback by links for 2008-04-04 | The Other Blog — April 3, 2008 @ 10:50 pm
[...] Ronald teaches us how to Share Your del.icio.us Links With WordPress. [...]
Pingback by Social Media Win! — April 4, 2008 @ 4:25 am
I’m a huge fan of this post, because I have been trying to figure out how to do something exactly like this, i.e., host my feed (del.icio.us/knishes) on wordpress.
You see, I’m a Neanderthal when it comes to coding. I mean, truly clueless. I’m sure i could follow your steps, which gets me 98% of where I want to go. I wonder if you could help me figure out that last 2%….
You see, I love the idea of making my del.icio.us feed pretty, by putting it on wordpress… but I’d Love Love Love to make my tags visible too…. how could I take what you’ve done, and enable tags to be visible on the wordpress site?
thank you thank you thank you
Comment by juan — April 16, 2008 @ 7:05 pm
@juan,
You’d have to use the JSON tag feed. That would require a separate tutorial since I’d also have to play around with it.
If you’re interested, I can write one up. I’m not sure I’d write it here, but I’ll share the link to whatever site I do write it on.
Here’s the link to the JSON tag description on delicious.
Comment by Ronald Huereca — April 16, 2008 @ 9:49 pm
Thank you so much! Very quick and easy and works great!
Comment by Jess — May 12, 2008 @ 8:31 pm
You’re welcome Jess.
Comment by Ronald Huereca — May 12, 2008 @ 8:37 pm
[...] Share Your del.icio.us Links With WordPress | The Reader Appreciation Project (tags: possibility) [...]
Pingback by pegd.org » links for 2008-06-12 — June 12, 2008 @ 5:31 pm
Hey, first off, I really appreciate this post. You give awesome directions for the technologically challenged. Everything worked perfectly the first time around! I guess my question is similar to Juan’s. I’d like to have one page with various sorted links (I hear we call them “tags” now). I want it to be easy though. I wanna right click, add the website to del.icio.us and know it’s going to end up looking great on my page. I tried a couple of things that just broke the script. So, if you have any suggestions on where or what I can research on ow to post sorted tags from del.icio.us and, of course, if you make a script for Juan, I’d would be honored to be in the loop. I’m off to explore your site more. Thanks.
Comment by tracy — June 27, 2008 @ 5:45 pm
Kinda thought it would be polite to follow up. I found an easy way to create link rolls with tags (http://del.icio.us/help/linkrolls). Ciao!
Comment by tracy — June 29, 2008 @ 11:42 am
@tracy,
Thanks a lot. Sorry I didn’t respond earlier. It’s been a rather busy week
Comment by Ronald Huereca — June 29, 2008 @ 4:21 pm
Hi,
great job.
Did I understood right?
You can show your own post per del.icio.us links on your site?
I need something like adding posts automatically to my del.icio.us.
E.g. Twitter Updater does it for Twitter.
Is there any plugin to do that?
Thanks a lot.
Comment by soshibi — August 12, 2008 @ 8:05 pm
[...] Share Your del.icio.us Links With WordPress | The Reader Appreciation Project A step-by-step tutorial on integrating your del.icio.us links with your WordPress (2.2 and up) installation. [...]
Pingback by My week on the web | bitful — August 31, 2008 @ 11:58 pm
I have a problem though, as I cannot find anywhere. Will this work with the most current version of Wordpress 2.5?
Comment by Adam Gurney — September 24, 2008 @ 6:48 pm
[...] Share Your del.icio.us Links With WordPress | The Reader Appreciation Project how to add del.icio.us to your sidebar or elsewhere in wordpress and maybe other blogs. (tags: wordpress del.icio.us links tags) [...]
Pingback by Del.icio.us links for 2008-04-04 :: The Other Blog — October 21, 2008 @ 10:45 am
Hi there
I’d really like to use this but when I try (in WP 2.7.1) I get errors.
I have placed the linkblog div in my page template, added the javascript file to my theme, and added the functions code to my functions.php file as instructed, but when I try to save the functions.php file I get this error:
Warning: Cannot modify header information – headers already sent by (output started at /blog/wp-content/themes/martinjy/functions.php:17) in /blog/wp-admin/theme-editor.php on line 70
Is there an issue with this technique and the latest version of Wordpress?
Thanks
Marty
Comment by martinjy — March 5, 2009 @ 1:40 am
Pls ignore my earlier comment. I fixed my own problem. Turns out that blank linebreaks in my functions.php file were causing the errors.
Your technique is working just fine for me now.
Comment by martinjy — March 5, 2009 @ 3:59 am
This is awesome! thanks so much. Is there an easy way to add a date along with the title? This was exactly what I was looking for.
thanks again,
Liz
Comment by liz — July 29, 2009 @ 5:29 pm
Does anyone know how to agregate links in same domain (suboages) with Delicious?
Comment by Mitchel — August 5, 2009 @ 5:34 am
I just implemented a new technique and this should further reduce queries. I’m personally having trouble verifying the queries saved, so if you could give me feedback, that would help me to fix it.
Comment by Frank — September 23, 2009 @ 4:20 am