How to Add Images to Your WordPress Website Sidebar without Using a Plugin or Editing HTML

Hello everybody, this is Michelle Castillo with WordPress Insider, and today I would like to show you a simple way that I’ve been using for a long time now to add images to the sidebar, or any other widgetized area on your website. The basic idea is to add a text widget to the sidebar and then put inside the HTML that represents the image. But I’ll show you how to do it so that you could get the HTML code easily.

Let’s start with adding the widget. We’ll go to “Appearance”, “Widgets”, and I’m going to add a text widget to my sidebar, so it’s pretty simple. And now I have a text widget, it is empty. Next, I’m going to go to the “Pages” screen and I’m going to add a new page, which is going to be just a tool I’m going to use in order to build the HTML code that I need, and then later on, I can delete this page. So let me just give it a name, and I’m going to upload my image from my computer; it’s an image that I have prepared before, so let me pick my image here, and I’m going to insert it to the page.

What when I added the image to this page, WordPress automatically creats the exact HTML code that I need. Before I’m going to copy this HTML code, I’m going to take care of a few parameters of this image, such as setting up the title and the Alt Text, something that we usually want to do in order to enjoy some SEO benefits. I’m going to update these, and I do not want my image to be linked to anything, so I’m going to click on “None” here and update, and now that I’m happy, or I think I’m happy, I can go to the text mode of the editor and just copy this HTML code, and I’m going to paste it into the text widget, I’m going to save my text widget, and let’s see what happened.

free instagram training


wordpress training


wordpress training


"Hey It's Bill And Mike, Grab Your 101 Free WordPress Plugins Below"

best free wordpress plugin

Now I have the image here, it was pretty straightforward. Note that if you’re not happy with your results, you could always go back to our temporary page and edit the image. For example, in this case, I could make the image smaller, I could centralize it, and then again, I can go to the text area and the HTML is going to reflect the changes that I’ve just done, and so I can copy it again, go to the widgets area, and replace the text that I have with the new text, and then save it. Now let’s see what happened. We can see that the image is smaller and it is centralized.

Basically, you can do whatever you want. If you do want to hyperlink the image to one of your pages at the side, you could do that, as long as it works on the page, and if you copy the exact HTML to the widgetized area, it’s going to work. So I hope you find it was useful, and I’m going to see you in the next video.
For more WordPress tips and tricks visit us at


More Video Training From Around The Web

Post Author:

Leave a Reply

Your email address will not be published. Required fields are marked *