Adding images to header and sidebar in WordPress

Last Update: August 25, 2017

Due to ”popular demand” I will try to create a series of short tutorial posts answering some technical questions I have been asked here at WA.

(Some of the questions will probably be answered within the certification training as well, but I’m sure these short posts will also come in handy here for people looking for quick answers to these questions.)


How you can add images to certain places within your WordPress site varies depending on your theme. In this tutorial I will show in a very conscise manner how images can be added to the Media Library and how you can add them to your blog’s header and sidebar.

In the Certification training there is a video tutorial about adding images that complements this tutorial (Course 2, Lesson 5: Making Use of Visuals, starting at about 12:40)
https://my.wealthyaffiliate.co...


The Media Library

The images that you want to add to your WordPress blog will have to be added to the Media Library first. On your WordPress site’s admin menu (on the left side), go to Media -> Library. Here you can see all images you have added so far. You can add a new image by clicking ”Add New” next to the Media Library title. You can also go to the same place from the menu, Media -> Add New. Then, either drag and drop the image files from your computer to the area surrounded with a dashed line or click ”Select files” to browse files from you computer.

When you write a blog post or add a new page, you can also add images directly to the Media Library when writing the post. So there is no need to go to the Media Library first separately to add the images.

Adding images to the sidebar

Head over to Appearance -> Widgets.

On the Widgets page you can see a section called ”Sidebar”. This is where you can add all your sidebar content. To the left there is an area called ”Available widgets”. If you want to add a new image to the sidebar, drag the block titled ”Image” from the left side to the Sidebar area. You can also rearrange the sidebar by dragging the added components by grabbing them from the title area and then moving to the new place.

When you have added the image block to the sidebar, add the image by clicking the ”Add image” button. You can choose an image from the Media Library or upload a new image in the ”Upload Files” tab.

When you have added the image, you can also add a title, but you don’t have to. Then click ”Save”.

Adding images to the header

This can be a bit trickier as the header part of the WordPress site varies quite a bit from theme to theme.

Usually you can add your logo or other header image by going to Appearance -> Customize. Depending on you theme you should find a place where you can choose which image you wish to use as a logo in your theme’s customization options. Typically this should open the standard Media Library view where you can choose the image the same way as explained in the sidebar chapter.

The size of the logo image can also be restricted by the theme. If your image doesn’t look as you were hoping it should, you can either edit the image to better suit the theme’s requirements or find out if the theme allows you to edit the size of the logo area.

Join the Discussion
Write something…
Recent messages
JoelWilson1 Premium
Thanks very much for this info. I have been looking for 2 days and only very complex instruction, some even including the downloading of additional software. Very much appreciated.
Reply
jtaienao Premium
Thank you for sharing these very helpful tips Sanna.
Jerome
Reply
DebbieRose Premium
Great information. It will be one of my reference tools. Thanks. Debbie
Reply
svaata Premium
You're welcome! Happy to help!
Reply
abrosco Premium
Samba
Am I right to say in the appearance/header one needs to insert title and subtitle and then tick the hide box before inserting a logo?
Richard
Reply
svaata Premium
Richard, I'm not quite sure I know where the hide box is you mention. Does your theme currently show just title and subtitle, but no logo image? Then, if you have this checkbox that says something about hiding or showing the logo, you should probably tick or untick that and see if the logo will now appear. Of course you would have to upload the logo image too first.

Which WordPress theme are you using? In some themes there are different options that need to be selected to show or hide the logo. If I know your theme I might be able to comment more.
Reply
Song1 Premium
Hi Sanna , very practical. Thames!
Reply
svaata Premium
Thank you Song!
Reply
Top