WordPress Tutorial: Add Image with Hyperlink to Your Sidebar Widgets

by jupiterjim on November 4, 2011

In this WordPress tutorial I will show you how to not only add an image to the widget in your sidebar, but how to make that image “clickable” or turn it into a hyperlink to take someone to another page within your blog, an affiliate link, your Facebook Fan Page, or whatever you choose.

Click here for more WordPress tutorials!

Here’s the code you will need to copy and paste into your sidebar widget:

<div style="text-align: center;">

<a href=" http://jupiterjim.com " />

<img src="  paste URL from media library here " />

</a>

</div>


Related posts:

  1. Thesis Tutorial: Customize Sidebar Widgets in Thesis 1.8.1 and WordPress 3.1.3
  2. Using Images for Sidebar Backgrounds with WordPress Thesis Theme 1.8

Over 75 FREE WordPress Video Tutorials!

portrait of jupiter jim I have created over 75 FREE WordPress and Thesis Theme Video Tutorials! That's over 10 hours of FREE Training! Click here for my Thesis Theme Video Tutorials. And click here for my WordPress Video Tutorials. You may find all my videos on my YouTube Channel. I also design WordPress Blogs and Websites using the Thesis Theme.

Thanks for your COMMENTS!

Sincerely,

Jupiter Jim

{ 33 comments… read them below or add one }

Marni Spencer-Devlin November 5, 2011 at 7:10 AM

Anyone who has a blog or newsletter in WordPress CANNOT do without Jupiter Jim’s tutorials. The man is a saint!!!

Marni Spencer-Devlin

SmoothOrganics.com

Reply

Jared Lopez November 5, 2011 at 9:39 AM

I love Jupiter Jim! He is one of a kind. No body is better when it comes to websites! Your out of your mind if you pay some one else. He is very helpful and gives great tips in all his videos! Call or email him so you can start your online business today! -Jared Lopez
Palm Beach County Boot Camp #1 Fitness Business in Florida!

Reply

David Johnson November 5, 2011 at 2:02 PM

Hey Jim, this is exactly what I was hoping to find, and being able to have this on my sidebar via a widget makes it VERY easy to manage – much better than editing the theme php files, so many thanks for your tip!
David Johnson recently posted..Toolera Tool BackpackMy Profile

Reply

jupiterjim November 5, 2011 at 2:10 PM

@David Johnson,

David, so glad I was able to help! Don’t forget to subscribe to my blog so you’ll get all these great tutorial in your email inbox!

Thanks for the kind words!

Jupiter Jim

Reply

Dr. Erica Goodstone November 5, 2011 at 8:38 PM

Jupiter Jim,

Wow! Thank you, thank you, thank you. I had uploaded my book image and also my paypal link but I could not figure out how to get the book image to be clickable to get to the sales page itself. I looked at other images that were clickable but somehow I just could not figure it out. I never knew how to get the URL link for an image. This is the very first time I went into the library and found an image and its URL in there. One more little piece of this unline puzzle you have taught me. I am so grateful.

Warmly,

Dr. Erica
Dr. Erica Goodstone recently posted..Are You Freely Creating Love?My Profile

Reply

Marc Korn November 5, 2011 at 8:44 PM

Hey Jim,

Love the tutorial…you have a great teaching style and you are very thorough and your training is very easy to follow.

This tutorial will help many bloggers with making their sidebar widget images clickable.

WP can be intimidating for many new bloggers and your tutorials show bloggers in easy to follow steps how to accomplish all the fundamentals and then some.

Well done…

Marc
Marc Korn recently posted..Does Your Homepage Pay You ?My Profile

Reply

jupiterjim November 6, 2011 at 3:51 AM

@Marc Korn,
I really appreciate your comments. I do try to be as thorough as possible. I hate it when I watch other people’s videos only to realize that they skipped a critical step and now I still don’t know how I am supposed to do what they said they were gonna teach me!

Reply

marquita herald November 5, 2011 at 9:08 PM

Hi Jim,
Very well done tutorial. Just wanted to share – for those who cringe at the thought DIY – there is actually a really cool – free – wordpress widget you can use called – Simple Image Widget. No code required – simply download and use it to just add images to sidebar or images plus link within / or outside your blog.
marquita herald recently posted..Always Crazy Busy? Warning Signs you May be Addicted to Stress.My Profile

Reply

jupiterjim November 6, 2011 at 3:28 AM

Marc,

I really appreciate your comments. I do try to be as thorough as possible. I hate it when I watch other people’s videos only to realize that they skipped a critical step and now I still don’t know how I am supposed to do what they said they were gonna teach me!

Reply

jupiterjim November 6, 2011 at 3:40 AM

Dr. Erica,

So glad that you found this tutorial helpful. In the end it’s all easy. The hard part is finding the good tutorials and finding the time to watch them all! Thanks so much for commenting!

– Jupiter Jim

Reply

jupiterjim November 6, 2011 at 3:42 AM

David,

Thanks for your comment and yes this is so much easier than having to edit the PHP files! And a lot less dangerous, too!

Reply

jupiterjim November 6, 2011 at 3:46 AM

@marquita herald,
Thanks so much for sharing that! That is very cool. I try to minimize the use of plugins because they are not always updated whenever WordPress is updated, and plugins can conflict with each other and slow down loading times. And I make adding images so easy. Just cut and paste. On the other hand, for some people, your alternative is the only one they will consider. So thanks for sharing.

Reply

Mark November 6, 2011 at 5:03 AM

I normally prefer to steer clear of code, but this is so simple to do I’m going to add it to my WordPress toolbox. The video is well presented, everything is explained clearly and you have an “easy” teaching style. Thanks Jim, much appreciated.

Reply

jupiterjim November 6, 2011 at 5:19 AM

Mark,

Glad you like the video. So what is your blog URL so I can check it out?

Take Care,

Jupiter Jim

Reply

Dennis November 7, 2011 at 12:33 AM

This is exactly what I’m planning to do. Thank u for making this tutorial. Made life more easier for me. Thanks again!
Dennis recently posted..Back Together: Hands-on Healing for Couples (Paperback)My Profile

Reply

clare November 8, 2011 at 2:22 PM

Hi Jim,
I have been wondering how to hyper-link an image for a long time. Thank you so much for freely sharing your knowledge here. As you have told me yourself, the more you share, the more will come back to you in the future. You deserve all the success that is yours now and in the future.

You have given me confidence to keep improving my blog for a better reader experience.

Be Blessed,
Clare
clare recently posted..Emotional Intelligence: Key to Better Health and Greater Success!My Profile

Reply

Greg November 9, 2011 at 4:30 PM

I am really looking for some WordPress tutorials and thank GOD I found this blog post. I will definitely use this to add better image in my blog. Thanks!
Greg recently posted..Auto Affiliate Armageddon Review-By Mo MullaMy Profile

Reply

antioxidants November 10, 2011 at 10:55 AM

really excellent blog, Jim, found it full of really helpful tips, thanks sooo much for your help, keep up the good work

Reply

Joseph November 10, 2011 at 6:40 PM

Very informative post..I am not really good in WP.i done self study and it’s still confusing

Reply

Julieanne van Zyl November 12, 2011 at 2:23 AM

Hi Jim, have you tried out the Thesis “Fremedy” theme yet? I put it on my Scuba diving blog plus another blog, and it looks quite nice! Have a good weekend! Julieanne
Julieanne van Zyl recently posted..Are you ready for that quantum leap in your business?My Profile

Reply

free stuff November 14, 2011 at 6:06 AM

Very helpful for me i am new blogger on wordpress i was searching that hoe i can submit my image with link!!

Reply

Sandy November 14, 2011 at 10:02 AM

Hi Jim,

first, Love the tutorial too. And i agree with Mark.
Your Teaching is simple to understand and it makes fun. It makes Fun to learn with and from you.

Great Post, great Site. Thank you so much.

With best Wishes for your Project :-)

Reply

Lynda Cromar November 14, 2011 at 1:58 PM

Thanks Jim, you explained that in such an easy and simple way! Often people don’t give the complete instructions, or they assume we understand it. This is easy enough for anyone beginner or more experienced!
Lynda Cromar recently posted..Success in MLM Network Marketing – Seeing What You Want Before You Have ItMy Profile

Reply

Benjamin November 15, 2011 at 1:08 AM

Without doubt, this is a priceless post, and your teaching style is great.
I am improving my blog step by step.
Thanks Jim.
Sincerely,
Ben.
P.S. Please, how can I hide our Affiliate Links? any plugin?
Benjamin recently posted..How To Get A Clickable Picture With The Text WidgetMy Profile

Reply

Benjamin November 15, 2011 at 1:11 AM

Sorry Jim,
Just to correct my email account.
Thanks,
Ben.
Benjamin recently posted..How To Get A Clickable Picture With The Text WidgetMy Profile

Reply

Paul Reimers November 15, 2011 at 9:22 PM

Thanks for the great tutorial Jim,

I also appreciate your supplying the HTML code that can be copied and pasted and then adjusted (especially great for those who are HTML phobic).

Being able to work with clickable images is important because most people respond more to images than plain text.
Paul Reimers recently posted..Review of Empower Network – Will This Tool Really Help You Build Your Business?My Profile

Reply

vanz November 15, 2011 at 11:32 PM

Hi Jim,
It is a pleasure for being a reader for your articles which gives us more superb tips and guides all through out making some blogs and articles. You are really a genius! For thinking such ideas which could help us not just readers but also for us bloggers. Keep up and be inspired! :D
vanz recently posted..Goal Setting – How to Achieve Any GoalMy Profile

Reply

Sadie-Michaela Harris November 16, 2011 at 6:01 AM

This is a good tip you have shared Jim one of the 1st frequently asked questions from people once they have familiarised themselves with WordPress. :)
Sadie-Michaela Harris recently posted..By: Sadie-Michaela HarrisMy Profile

Reply

Yorinda November 17, 2011 at 8:50 PM

Hi Jim,

thank you so much for the very clear instructions in your video.
I knew how to do it before, but now I understand it all a lot more.
Even though I learned html code in my computer course, the way you explained it was a lot more acceptable for my brain.
You are obviously a great tutor.

Much appreciated.
Yorinda recently posted..Vision Board for realising your DreamsMy Profile

Reply

Holly November 22, 2011 at 2:01 PM

Wow, that is simple enough for me to get!! Not that I have anything in the sidebar 2, but I could do this, without a whole lot of stress!! Thanks Jim!
Holly recently posted..Nobody Is As Busy As I Am!My Profile

Reply

Jenna Waites November 22, 2011 at 9:30 PM

You really have created some great simple tutorials! I wish I had you around when I was trying to figure this stuff out. I love your step by step approach and will definitely refer my followers here!

Can I make just 1 suggestion? In this video you mentioned how you taught already how to upload images into WP, can you maybe link to that video so that it is quick and easy for those who might have missed it?

Two thumbs up! :)
Jenna Waites recently posted..Microsoft’s New Social Network!My Profile

Reply

jupiterjim November 24, 2011 at 10:11 AM

Jenna,
Great suggestion! I’m actually going to re-shoot that video and add it to my collection, soon! Thanks for the feedback!
Jupiter Jim

Reply

Sherie February 4, 2012 at 10:19 PM

Thanks so much for this great tutorial!! I love how clear you are in the videos, your explanations are easy to understand and very thorough!
Sherie recently posted..Are All Goals Smart Goals?My Profile

Reply

Leave a Comment

CommentLuv badge

{ 2 trackbacks }

Previous post:

Next post: