How to Fix the Image Upload HTTP Error in WordPress

How to Fix the Image Upload HTTP Error in WordPress

You know the old saying – one picture is worth a thousand words. The explanation for this is less poetic than the saying, but fascinating nevertheless. Compared to words, images are processed by our brain at a faster rate, so they can easily convey a multitude of information, including highly abstract ideas. On websites, images tell stories, complement your content, create the atmosphere and define your brand.

So, it is not hard to see why being unable to upload images is the nightmare of every website admin. Moreover, reading a vague and unhelpful message such as “HTTP error” can make the whole problem even more frustrating.

In this article, we will guide you through the various causes and methods of tackling the HTTP error that occurs when uploading images in WordPress. You can also use these methods if you’re getting this error when uploading videos, PDF and any other WordPress supported media files.

How to Verify the HTTP Error

HTTP error image wide

There can be many possible causes for this issue, which is why WordPress displays such a vague message: HTTP error. Since this doesn’t put you any closer to the solution, you have to be analytical and look for the culprit in several places. Yet before you start panicking and digging, make sure the issue isn’t only temporary.

Sometimes, the HTTP error happens due to server glitches and a loss of internet connection. Both resolve on their own, so here’s how to determine whether you’re dealing with temporary issues.

Checking for Temporary Issues

If you are getting an HTTP error message, the first thing you should do is simply wait a few minutes and then try uploading the media file again. If the file is uploaded without any errors, the problem is solved.

If the previous step failed, try uploading a smaller image or media file. If you upload it successfully, you’ll know the issue was the size of the file. To avoid further issues, reduce the dimensions of the original image or change the file format. Upload it again. You can also try to change the image format if the issue persists.

If the issue persists, move on to browser-related tests. Try refreshing the page and re-uploading the image or media files. If your login session has expired, login to the dashboard and refresh the page by pressing the reload button or the “F5” key on your keyboard. Try reuploading the file.

Expired login session image

Keep in mind that, despite its popularity and wide use, Google Chrome is known to have issues with image upload. Switch your browser to Firefox, for example, and upload the image again. Also, clear the cache after completing each of these steps and try re-uploading the image or media file.

Clearing the cache after each step will allow you to pinpoint what exactly is causing the issue.

Checking Your Plugins and Theme

Sometimes the plugins you use, or even the theme itself, could be the culprit of the HTTP error. It is important to test thoroughly for every possible cause.

Plugins that are prone to causing HTTP errors are usually image optimization or security plugins, so make sure you check those first. Deactivate plugins one by one, and after each is deactivated, try uploading an image or media file.

As soon as the image upload process is successful, you can pinpoint the last deactivated plugin as the source of the error.

To check the WordPress theme, make sure you backup your site first. Then, switch your theme to a default theme (e.g., Twenty Twenty). If the issue is solved afterward, report it to the developers of your theme.

Renaming the File

One of the often-overlooked reasons for HTTP error is an incorrect file name.

When you’re naming your file, make sure you’re using letters, numbers, and dashes only. This means that special characters (for example, the apostrophe or the equals sign) and international language symbols should be avoided.

Our recommendation is to create a system of naming files. Add dashes between the words and a dash and a number at the end (e.g., my-uploaded-image-1.png, my-uploaded-image-2.png and so forth).

To determine if the incorrect file name is the source of the issue, rename the file in your local folder following our guidelines. Upload the renamed image or media file. If the error is no longer present, you’ll know the incorrect file name was the issue.

If the previous steps have given no result, it’s time to turn to some coding solutions. Don’t worry if you have no experience in this field – we’ll guide you every step of the way!

Qode WordPress Themes: Top Picks
Bridge WordPress Theme Banner

Creative Multi-Purpose WordPress Theme

Stockholm WordPress Theme

A Genuinely Multi-Concept Theme

Startit WordPress Theme

Fresh Startup Business Theme

Biagiott banneri

Beauty and Cosmetics Shop

How to Solve the HTTP Error

Insufficient server memory is one of the common reasons for the HTTP error, since an increased memory limit is a requirement for the image upload process. Therefore, increasing the memory used by the server should solve the issue.

Before we delve into the possible methods of server memory increase, let’s mention two important prerequisites for this process.

  • Increasing memory is only possible within the limits of your hosting package. Increasing it past these limits will likely result in an internal server error, the so-called error 500. Consult with your hosting provider about the change, especially if you are using shared hosting.
  • To perform the changes described in the following sections, you have to edit files using an FTP client.

We will show you 4 ways to increase the memory limit.

Memory Increase

The first way to increase the memory limit requires you to edit the wp-config.php file. Simply add the following line of code in the wp-config.php file.

define( 'WP_MEMORY_LIMIT', '256M' );
Wp config memory increase-image

The second method for increasing memory limit is changing the memory limit value within the cPanel.

Log in to cPanel, navigate to the Software section, and click on the “MultiPHP INI Editor”.

cPanel editing php.ini image

Then, select your domain, search for “memory_limit” and insert 256M as the value.

cPanel editing php.ini image-1
cPanel editing php

Another way to increase the memory limit is to edit the php.ini file, which is located in the root WordPress directory.

Open the file, search for memory_limit and change the value associated with it.

If the file isn’t there, create it and insert this line of code.

memory_limit = 256M

For some shared hosts, you have to edit the .htaccess file so the previous change can take effect. Make edits by adding the following code to your .htaccess file, near the top. Replace the “your_username” part with your actual cPanel username.

<IfModule mod_suphp.c> 
suPHP_ConfigPath /home/your_username/public_html

The purpose of this code is to specify the directory of your php.ini file. With shared hosting, there are often multiple php.ini files, so you have to specify the exact location of the one you have edited or created. That’s the only way to execute the correct file and code and apply changes.

Htaccess shared host edit image

Finally, you can increase the memory limit by editing the .htaccess file.

This file is also found in the root WordPress directory. It is a server configuration file and usually hidden.

To access it, you should enable the relevant option(s) for showing hidden files within the FTP client of your choice. If you use FileZilla, as we do, navigate to the Server tab and click on “Force showing hidden files”.

Show hidden files image

Open the file, search for “memory_limit” and change the value associated with it. If no code is present, insert this line.

php_value memory_limit 256M
Htaccess memory limit increase image

Image Editor Changes

If the memory increase solution wasn’t successful, you can tackle the issue by adding code that modifies WordPress image editors.

WordPress relies on 2 image editor modules: GD Library and Imagick. They are used interchangeably. However, Imagick is known to cause memory drain, which leads to the HTTP error during image upload.

Therefore, one possible solution is to make the GD Library a default image editor. Simply add this code into functions.php of your theme, at the end of the file.

function wpb_image_editor_default_to_gd( $editors ) {
$gd_editor = 'WP_Image_Editor_GD';
$editors = array_diff( $editors, array( $gd_editor ) );
array_unshift( $editors, $gd_editor );
return $editors;
add_filter( 'wp_image_editors', 'wpb_image_editor_default_to_gd' );

The code prioritizes GD Library in the list of available image editors. Whenever an image is uploaded, GD Library is always used as the first image upload option.

Functions image editor code

Let’s explain why Imagick may cause issues.

Imagick uses multiple threads for more efficient image processing. However, on many shared hosts, this use is considerably restricted, leading to the HTTP error.

Another solution to the Imagick issue could be to force this image editor to use a single thread for image processing.

If you want to try that, insert this line of code into your .htaccess file.

Htaccess image editor code

Additional Troubleshooting Steps

In most cases, the image upload problem should be solved by using one of the solutions provided in the previous sections. However, keep in mind there are many possible reasons for the error, and so far we’ve included the most common ones. Now let’s look into some of the less employed troubleshooting methods.

Further Modifications of the .htaccess File

Sometimes, the WordPress image upload process can result in an HTTP error due to the mod_security rule set on the server. Mod_security is an open-source firewall used for security purposes. Sometimes, it can accidentally block the image upload. By removing/disabling it, you can solve the image upload issue.

To remove mod_security, add the following code to the top of your .htaccess file via an FTP client.

<IfModule mod_security.c> 
SecFilterEngine Off 
SecFilterScanPOST Off 
Htaccess mod security

If the issue isn’t solved by adding code/changing the option, revert the change, as it may cause security issues.

Also, if your server is using Authentication Access Control, you should also add this code to your .htaccess file via FTP.

# Exclude the file upload and WP CRON scripts from authentication
<FilesMatch "(async-upload\.php|wp-cron\.php|xmlrpc\.php)$">
Satisfy Any
Order allow,deny
Allow from all
Deny from none
Htaccess access control modification

Changing File Permissions

Having incorrect file permissions in your WordPress uploads folder is one of the many causes of the Image Upload error.

For the purposes of this article, we will only focus on the uploads folder, as it stores all the images uploaded to WordPress. Having improper permissions on your uploads folder can cause problems with image upload as well as show the already uploaded images as blanks.

Media Library
Images as blanks

This issue can happen after a migration from another host. The solution is rather simple, you only need to manually set the proper permissions on the uploads folder.

Permissions can be changed via FTP, by right-clicking on the uploads folder and selecting File Attributes. Manually insert the numeric value and check both the “Recurse into subdirectories” and the “Apply to directories only” options.

The suggested permission for directories and subdirectories is 755. It grants the administrator of the site all the permissions – to read, write and modify, while the rest (non-admin users) have the rights to read and modify directories.

Permissions on uploads folder

Contact Hosting Provider

A reminder – make sure you clear the cache and run the test after each suggested step.

If the problem still isn’t solved despite closely following our directions, it is time to contact your hosting provider. Describe the issue and the ways you tried to solve it, and ask for further assistance.

Final Thoughts

Now you’re ready to go back to telling thousands of new stories with each image you add to your website.

While this guide cannot cover all the possible causes for an HTTP error, you’ll most likely find the solution to your problem here. Keep this tutorial in your bookmarks, so you can quickly deal with this relatively common issue whenever it comes up.

Post your comment