Adding a link and/or image to your WordPress sidebar

This is a more specific post than the earlier tutorial on the “mighty text box” which outlined what we could include in the Text box widget.

Adding just a link: Go to Appearance, Widgets and drag a fresh text box into your sidebar. Within that put your link (I usually copy and paste, to be sure it’s right). Now you need to “tell” WordPress that it is a link by placing some html code around the link; the code you need is <a href=”http://yourlinkaddress.com/”>Text for your link</a>

The a tells WordPress and the Internet that a link follows, and the href says where the link is, and you do need to be sure to “close” your link with the </a>

So, for a link to the Blogmistress free healthcheck the code would be:

<a href=”http://www.blogmistress.com/wordpress-healthcheck/”>Book your free WordPress healthcheck here</a>
Now if you want to use an image instead or as well as your link, you first need to have your image available online. You can either upload using the notes in the earlier post on using images within WordPress, or use FTP (for which I am not going to do a tutorial just now – if you know it you’ll know what to do). What you need is the image address/url (get in touch if you do want some help with this), and you use that instead of the link text – but with a little code so that the the web knows it’s an image – the <img says this, and then src=”http://www.whereimageis.com/image.jpg” tells it where, and then it’s a good thing to include some alt text, which will tell screen readers what the image is about alt=”short desc of your image”. So for the healthcheck button in our sidebar (at time of posting), the code is:
<a href=”http://www.blogmistress.com/wordpress-healthcheck/”><img src=”http://www.blogmistress.com/images/healthcheck.jpg
” alt=”wordpress healthcheck” /></a>

Of course you may want to link to an image that is already online, such as something within wikipedia – do be sure that you are allowed to use any images from elsewhere, and you simply use that image’s url instead of the one you uploaded.

And it is possible to add a link and/or image to your WordPress sidebar without using a widget, but that means rolling up our sleeves and coding into the theme’s files – we’ll cover that later.

Related posts:

  1. Adding an image to your WordPress post or page
  2. More WordPress Widgets – the mighty Text Box!

View Comments to “Adding a link and/or image to your WordPress sidebar”

  • Wordpress Belarus » Blog Archive » Add an image and/or link to WordPress sidebar | WordPress Help and …:

    [...] Read this article: Add an image and/or link to WordPress sidebar | WordPress Help and … [...]

  • There's one problem i encountered while doing this. After pasting your links, for some reason, wordpress added a second quotation here
    (after confounddead/):

    <img src=”//confounddead.files.wordpress.com/2010/08/1280671443_twitter.png” alt=””Follow” />

    With this the link too was broken. To fix it, for me, i had to get rid of the inner quotation mark.

    [Reply]

Leave a Reply

blog comments powered by Disqus
Books worth buying:
The Copywriting Scorecard for Bloggers by the successful, expert ProBlogger himself, Darren Rowse (and there are not many I'd refer to as an expert).
bloggers wanted