How to Upload Images in WordPress?

There is a famous proverb “a picture is worth a thousand words” indicating you can easily convey complex text messages through an image. Though each image uploaded on your site sends a separate HTTP request, it is still a good option for explaining step-by-step tutorials, showcasing photography, portfolio, etc. Whether you are using old Classic Editor or Gutenberg blocks editor, there are multiple ways to upload images in WordPress site.

Enabling Image Related Blocks

Before explaining the methods, first make sure you have enabled all media related blocks in Gutenberg editor. They are enabled by default; however, you can confirm that by following the below steps.

• Login to your site and go to “Posts” section. Click “Add New” button to create a new post or click on any existing post to edit.
• When you are in Gutenberg editor, click the three vertical dots icon showing on top right corner.
• Select “Preference” from the menu which is the last item in the list.
• On the “Preferences” panel, go to “Blocks” section.
• Enable all blocks or go to “Media” section and make sure all blocks are selected.

Remember, if you do not select a block in “Preferences”, it will not be available for insertion in the editor.  

1. Upload Single Image Using an Image Block

I used to prepare article in Word document and copy paste in Gutenberg editor. The advantage here is that all images in the article will create placeholder Image blocks. After that I can easily upload individual images using inserted Image blocks. Alternatively, you can type /image or click the + icon to find and insert an image block in your content.

The block offers three options – Upload, Media Library and Insert from URL.

• Click the “Upload” button to select an image from your computer.
• Use “Media Library” option to open your image library and select an image. From there also, you can go to “Upload files” tab and upload an image.
• If you want to embed an image from another website or you have copied an image URL from your own site and want to insert in the post, then click “Insert from URL” button. Paste the image URL and click the “Apply” icon to insert the image.

After uploading an image, you can crop, add text overlay and apply duotone filter using the tools available in block’s toolbar. Similarly, you can add alt text, change dimensions and apply rounded corners from the block settings in right sidebar.

Note that, Image block supports uploading a single image. You can also drag an image from your computer and drop it in the Gutenberg editor. This will automatically create an Image block and show the dropped image.

2. Add Image + Text with Media & Text Block

Generally, you can use the Columns block to arrange multiple blocks side by side. However, you can use the “Media & Text” block to create two columns layout showing an image in one column and text in another column.

• Find and insert Media & Text block in the content area.
• The “Media area” in the block allows you to upload image from your computer or from Media Library.
• You can type any text in the “Content…” area.

It is possible to swap image and text positions from the toolbar icons.

3. Showcase Multiple Images with Gallery Block

As mentioned above, you can drag and drop a single image to insert an Image block in editor. However, WordPress will automatically create a Gallery when you drop more than one images.

Alternatively, you can find and insert a Gallery block and then upload your images from computer or Media Library.

The Media Library section opened from Gallery block will allow you to select multiple images. You can simply click on an image to select or deselect to add in the gallery. After adding your images, click on “Create a new gallery” button.

This will take you to “Edit gallery” section with Media Library pop-up. You can drag the items to rearrange the order and add captions if needed.

Now you will see a beautiful gallery which you can customize by adding additional images and changing the columns.

4. Create Hero Section with Cover Block

Cover block helps to create a fullwidth hero header style design.

• Add a Cover block and the block allows to insert image from your computer or from “Media Library”.

• In addition, you can also click on the “Add Media” button and upload an image.
• After uploading an image, you can add overlaying text, change the focal point, toggle full height, etc.

Learn more on how to customize Cover block to create beautiful sections.

5. Upload Featured Image

Featured image is shown in blog posts listing and other archive pages (like category and tag pages). It will not be visible in the content area though it may show above or below post title depending upon your theme.

• When you are in Gutenberg editor, click the “Post” tab in the right-sidebar.
• Click “Set featured image” option showing in “Feature image” section.
• This will open you Media Library and select an image from there to set it as your featured image.

Learn more about how to use featured images in WordPress.

6. Upload Images from Media Library

You may wonder what the difference between “Upload” and “Media Library” options in the above blocks is. Though both options allow you to upload image from your computer, Media Library will show all previously uploaded images for selection. So, you can upload bulk images from Media Library without even opening Gutenberg editor. Later, you can insert the uploaded images to your post content from the editor.

• Navigate to “Media > Library” in WordPress admin panel and click on “Add New” button.

• Click “Select Files” button and upload bulk images. Alternatively, drag and drop bulk images to upload in the library.

Note that the images you upload in editor will be automatically attached to that post. However, images directly uploaded in Media Library will be in “Unattached” status even though you insert in any content. Though this will not have any issue, you can click on the “Attach” link and link that image to any existing post or page.

Learn more about attachment pages in WordPress.

What You Can’t and Shouldn’t Do?

Though it is easy to upload images and files in WordPress site, you can’t/shouldn’t do few things:

• Do not upload images using FTP or File Manager. Those images will not be shown in your Media Library and you have no option to search them when opening Media Library in post editor. Though you can directly use the image URL to insert using Image block, you can’t view them anywhere inside WordPress admin panel. If you have already uploaded images or migrated site from one hosting to another hosting company, check the article on how to make FTP images visible in Media Library.
• WordPress by default does not allow you to upload SVG images and JSON files. If you need them, learn more on how to upload SVG images in WordPress.

Final Words

You can use one of the above explained methods to upload images in WordPress site. It is possible to showcase images as individual item, cover, gallery or in columned layout. Besides these options, you have plenty of third-party plugins to decorate images, create sliders and portfolio. If you are creating a post for showcasing your gallery images, then make sure to select the post format as “Gallery” from the right sidebar (Post > Status & visibility > Post Format). WordPress will also suggest you to select Image or Gallery post format when you have only images or gallery content.