How to Display an Image in Your Sidebar

Sometimes you need to display an image in your sidebar, but WordPress doesn’t have a native widget for images.

Luckily, there are two easy ways to display images in your sidebar. In this post, you’ll learn how to use a simple plugin to display images, and how to use the plain Text widget to display images too.

How to Use the Image Widget

The first method is to use the Image Widget by Modern Tribe.

screenshot of the Image Widget plugin on wordpress.org

To use this plugin, first install & activate it via the Plugins menu. Once added, visit your Widgets menu (Appearance > Widgets), and locate the new Image widget.

screenshot of the Image Widget in the Widgets menu

Click on the Image Widget, and select the widget area you want to add it to.

Once added, there’s just one thing to do: click the Select an Image button and choose the image you want displayed.

Image widget after being added to a widget area

Clicking the button will open the Media library where you can select an existing image on your site, or upload a new one.

Once you’ve selected an image to display, the widget will show an extensive list of optional settings for the image.

the settings available with the Image Widget

Among those options, the ability add a link to the image is especially handy.

Once the widget is saved, it will display on your site in the widget area you added it to.

How to Display an Image with the Text Widget

If you’re comfortable with a bit of HTML and prefer not to install a new plugin, you’ll love this method.

First, navigate to the Widgets menu, and add the Text widget to your preferred widget area. Then, copy and paste the following HTML into the widget:

<img src="" />

Here’s how it should look:

the HTML included in a Text widget

Next, you’ll need the URL of the image you want displayed. If it’s not already online somewhere, upload the image via the Media menu and copy its URL to your clipboard.

Add the image’s URL to the HTML like this:

<img src="http://example.com/some-image" />

Lastly, save the Text widget, and you’ll now see the image displayed on your site.

How to Link the Image

One more thing — If you want to link the image, you can surround the image in a link element like this:

<a href="http://example.com/some-page"><img src="http://example.com/some-image" /></a>

Just update the URL in the “a” element to where you want visitors to click-through to, and you’re done.

Conclusion

While it is a bit surprising WordPress doesn’t have a native image widget, the Image Widget plugin is as good as it gets. It’s a well-designed and easy solution for displaying images in any widget area on your site.

If haven’t used HTML with the Text widget before, you can see now how versatile it is. The Text widget can be used for displaying images, ads, blogrolls, and much more.

If you have any questions about using the Image or Text widgets, leave a comment below.

Related Posts

2 Comments

  1. Jeni Jeni

    These 2 tips are really important for WordPress user. I am using the Image Widget plugin.
    its awesome !

  2. auku auku

    This was such a pain to figure out!

Post a comment

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