bookmark_borderWordPress – How to change the Maximum Upload File Size

Out of the box, PHP defaults the Maximum Upload File Size to 2M. I.E 2M is the default setting.
Where 2M represents 2 Megabytes or 2048 Bytes  (1M = 1024 Bytes).

But what if we want to upload images that are larger than 2 Megabytes?
Well, to alter the Maximum Upload File Size in WordPress, you will need to change a setting in your php.ini file.

Where it says upload_max_filesize = 2M, you will need to alter the value of 2M.  Where 2M means 2 Megabytes or 2048 Bytes  (1M = 1024 Bytes).

So, let’s say that your or your client wants to be able to upload images that are just under 10MB. Then you would change this to 10M.

It is NOT a good idea to just make this some ridiculously large number. It’s there to protect the server from having to deal with large image uploads so please, put some thought into it.

So the Original Settings are…


; Maximum allowed size for uploaded files.
; http://php.net/upload-max-filesize
upload_max_filesize = 2M

After our changes, it becomes…


; Maximum allowed size for uploaded files.
; http://php.net/upload-max-filesize
upload_max_filesize = 10M

When you make any changes you will need to restart your webserver, for these changes to take effect!
This will depend on your OS and Webserver.

On Linux/Debian, for apache2, you can use the command


$ sudo systemctl reload apache2

On Linux/Debian, for NGINX, if you are using php7.4-fpm, you will need to restart PHP, for the changes to take effect.


$ sudo systemctl reload php7.4-fpm

BUT NGINX has a Default File Upload Size Restriction.

In NGINX, just changing the PHP upload_max_filesize setting is Not Enough as NGINX has it’s own setting for this. (See WordPress – The server cannot process the image. )

It is important to set the NGINX client_max_body_size to a value equal to or larger than the PHP upload_max_filesize setting.

 

bookmark_borderWordPress – The server cannot process the image.

How to Fix: The server cannot process the image. This can happen if the server is busy or does not have enough resources to complete the task. Uploading a smaller image may help. Suggested maximum size is 2560 pixels.

So you have installed WordPress and you are ready to start uploading images.

In the WordPress Dashboard, you click on the Media Entry in the Menu and get the following on your browser.

NOTE: By default WordPress sets a Maximum upload file size: 2 MB or Maximum Image File Size of 2MB ).
Actually this Maximum upload file size is determined by a PHP Setting on the server. ( See How to Increase the Maximum upload file size )

So you Click on Select Files or Drag and Drop an image which is just smaller than 2MB ( and bigger than 1MB which is a clue for later) and BOOM, you get an error message like the following.

The server cannot process the image. This can happen if the server is busy or does not have enough resources to complete the task. Uploading a smaller image may help. Suggested maximum size is 2560 pixels.

So that’s annoying! But hang on, our image is under the Maximum File Size of 2MB so what is going on?

If we attempt to upload an image that is larger than the specified Maximum File Size of 2MB, we get the expected error message of

If we attempt to upload an image that is 1.3MB, we get the unexpected error message

So What is happening?

This situation occurs when you are using NGINX as your webserver.

When you attempt to upload an image that is larger than 1MB and smaller than the Maximum upload file size: 2 MB, the server will respond with the Server Error message of:

413 Request Entity Too Large

The reason is, NGINX has a file upload size setting. By Default this setting is 1M ( That’s 1 Megabyte or 1024 bytes ). As a result, the NGINX Server returns a 413 Server Error and that results in the Server Error message.

What is the FIX?

There is a setting in NGINX called client_max_body_size.

To Apply this globally across all sites

To apply this to all sites, in the file /etc/nginx/nginx.conf,  you will need to add client_max_body_size 2M; inside the http section.

File: /etc/nginx/nginx.conf


http {
    # Default is 1M
    client_max_body_size 2M;
}

To Apply this on a Per Website/Domain

If you are using virtual hosts. I.E you have configured individual sites by adding configuration files in /etc/nginx/sites-available/. For Example: your-domain.conf, you will need to add client_max_body_size 2M; inside the server section.

File: /etc/nginx/sites-available/your_domain.conf


server {
    # Default is 1M
    client_max_body_size 2M;
}

Check Changes made to NGINX Conf files are OK!

When you make changes to any configuration files it is a good idea just to check they are ok.
This can be done with the command sudo nginx -t.


oska@oska-VirtualBox:/var/www/wordpress-dev$ sudo nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

Restart the Server

And as always, if you make any changes to your webserver, you will need to restart it.


$ sudo systemctl restart nginx

How to Increase the Image Upload File Size.

In the Case where you want to upload larger files see – WordPress – How to change the Maximum Upload File Size

System Settings

This is running on a Virtual Box running Mint Linux and NGINX with PHP 7.4.

Operating System

The operating system has no impact on this and is just mentioned for reference only.


oska@oska-VirtualBox:~$ lsb_release -a
No LSB modules are available.
Distributor ID:	Linuxmint
Description:	Linux Mint 20.3
Release:	20.3
Codename:	una

NGINX Server

This is the Culprit/Cause of this issue. Not sure if the versions are important but you’d expect this has been a setting since the early days.


oska@oska-VirtualBox:~$ nginx -v
nginx version: nginx/1.23.0