Do you want to add an image to a sidebar widget in WordPress? By default, WordPress makes it easy to upload and add images anywhere on your website. In this article, we will show you how to easily add an image in your WordPress sidebar widget. We will share multiple methods, so you can use one that works best for you.
Adding an Image in WordPress Using The Image Widget
The easiest way to add an image in WordPress sidebar is by using the default ‘Image’ widget.
Simply go to Appearance » Widgets page and add the ‘Image’ widget to your sidebar. If you haven’t used widgets before, then see our guide on how to add and use widgets in WordPress.
The widget will expand, and you will be able to see its settings.
The first option is to add a title to the image widget. After that, click on the ‘Add Image’ button to continue.
This will bring up the WordPress media uploader where you can click on the upload files button to upload your image or select an image you have previously uploaded.
After uploading the image, you will see image settings in the right column. From here, you can provide a title / ALT text for the image, add a description, select size, or even add a link.
Once you are done, you can click on the ‘Add to Widget’ button to save your changes. You will now see a preview of the image inside the widget settings area.
Don’t forget to click on the ‘Save’ button to save your image widget.
You can now visit your website to see the image displayed on your WordPress blog’s sidebar.
Adding an Image in WordPress Sidebar Using Text Widget
Adding an image to the sidebar using the default ‘Image’ widget is quite easy. However, sometimes you may need to add an image with custom HTML or text with formatting. In that case, you will need to use the ‘Text’ widget instead.
Simply go to Appearance » Widgets page and add the ‘Text’ widget to your sidebar. Under the widget settings, you will see the ‘Add Media’ button above text edit area.
Clicking on the button will bring up the media uploader allowing you to upload or select an image from the media library.
After selecting your image, click on the ‘Insert into post’ button. You will now be able to see an image preview in the text widget settings.
You can continue adding text and other elements to the text widget. The toolbar in the text editor gives you some basic formatting buttons.
Once you are done, don’t forget to click on the ‘Save’ button to store your widget settings.
You can now visit your website to see the sidebar image in action.
Manually Adding an Image in WordPress Sidebar Widget
In some cases, you may need to add additional HTML code to your image. The default text widget allows some very basic HTML, but it may not work with advanced HTML or formatting. In that case, you will need to manually add an image to your blog’s sidebar.
First, you need to upload the image to your WordPress site. Simply go to Media » Add New and upload your image file.
After uploading the image, you need to click on the Edit link next to the image.
WordPress will now take you to the ‘Edit Media’ page where you will see the image file URL on the right side of the screen. You need to copy this URL and paste it into a text editor like Notepad.
Next, you need to go to Appearance » Widgets screen and drag-drop ‘Custom HTML’ widget to your sidebar where you want to display the image.
In the text box area of the widget, you need to add your image using this code:
<img src="Paste The File URL Here" alt="Strawberries" />
img tag is used in HTML to display images. It needs two attributes, the first one is
src which defines the image file location. This is where you will paste the URL you copied earlier.
The second one is
alt which is used to provide an alternate text for the image. Your final img tag will look something like this:
<img src="http://www.example.com/wp-content/uploads/2014/09/strawberries.jpg" alt="Strawberries" />
You need to click on the Save button to store your widget settings and then preview your website.
Adding an Image in WordPress Sidebar Using a Plugin
Another way to add images to your WordPress sidebar is by using a plugin. This will give you a few more options and a simple interface, which some beginners may find easier than the default ‘Image’ widget.
Upon activation, simply go to Appearance » Widgets page. You will notice a new widget labeled ‘Image Widget’ under available widgets column. Simply drag and drop this image widget to your WordPress sidebar where you want to display an image.
Next, click on the ‘Select Image’ button to upload an image or select one from the media library. After that you need to click on the ‘Insert to Widget’ button, and you will see the image preview under widget settings.
You can add a title, alt text, link, and a caption for the image. You can also choose an image size from the list of available options.
Once you are satisfied, simply click on the Save button to save the image widget. That’s all, you can now go to your website and see the image displayed in your sidebar.
We hope this article helped you add an image in WordPress sidebar widget. If you come across a problem, don’t forget to look at our guide on how to fix common image issues in WordPress.
Rojenx is a leading concept artist who work appears in games and publications
Check out his personal gallery here