Widgets & Sidebars

Widgets »Image Widget

The Image Widget provides you with a simple way to display an image in your blog’s sidebar.

Here’s an example of what it looks like:

Getting Image URL

Before you activate the Image Widget, you will need to get the file URL for the photo you want to include in your sidebar. This means that if you’re using a photo from your computer’s image library, you’ll need to upload it to your Media Library first. You can do this via your Media  Add New page or by following this guide.

You can get the Image URL by going to your Media Library and clicking on the photo you want to insert into the widget. After clicking on the picture, click the blue edit box. Once you click the edit button, a new window will pop up. The box that says URL shows the image URL. Click the copy button. Next, click done.

↑ Table of Contents ↑


Once you add the widget to your sidebar from the Customizer  Widgets, you’ll see that the widget settings look like this:


  • Widget title: The title to be displayed above the image.
  • Image URL: The URL of the image you wish to display (as explained above). If you’re using an image from another website, check the URL in the browser before adding it to the widget to confirm that it ends with an extension specific to an image file (such as .jpg, .gif, .png, etc.).
  • Alternate text: Text to be used as a replacement whenever the image cannot be viewed. (Optional)
  • Image title: Text to be displayed as a tooltip (when a mouse pointer is hovered over the image). (Optional)
  • Caption: Text to be displayed as a caption under the image. When a caption is used, the image and caption will have a border style added. (Optional)
  • Image Alignment: How to align the image. Choices: left, right, center, none.
  • Width: The display width (in px) of the image. This should be a value equal to or less than your theme’s sidebar. If you leave this empty, the widget will attempt to determine the original width of the image and use that.
  • Height: The display height (in px) of the image. If you leave this empty, the widget will attempt to determine the original height of the image and use that.
  • Link URL: The URL to link the image to. (Optional)

When you’re finished, click Save and then visit your website to see your shiny, new Image Widget!

↑ Table of Contents ↑

Image Widget Tips

We’ve gathered our best advice on using widgets effectively, including tutorials on how to create beautiful image widgets (with no design experience necessary)! Check out our top tips.

Still confused?

Contact support.

Not quite what you're looking for?

Get Help