How to Display Full Size Images in WordPress (4 Methods)

Do you want to learn how to display full size images in WordPress?

WordPress automatically resizes large images so your site loads faster and runs more smoothly. However, sometimes you may need to show large images at their full size.

In this tutorial, we’ll show you how to display full size images on a WordPress site.

Why is WordPress Scaling Large Images?

Early versions of WordPress allowed users to upload images with very large dimensions. However, some website owners uploaded images that were big enough to affect their website’s loading speeds and performance.

The WordPress 5.3 update fixed this issue by changing how WordPress handles very large images.

For example, if you upload an image that’s 5000px by 7000px, then WordPress will resize that image to 2560px and then scale the width to match the original dimensions.

Visitors will see this scaled-down version of the original large image. This can boost WordPress speed and performance, which means a much better experience for your visitors and customers.

However, sometimes you may still need to show full size images. For example, if you’re a photographer or artist who sells digital downloads on WordPress, then you may want to display larger images on your website.

For some sites, large images are a requirement, such as a stock photo websites. Sometimes you may even need to show a single large image, such as a background image in WordPress.

No matter what your reason for wanting a full size image, we’ll show you how to do it, step-by-step.

Some methods work better for single images, while others are best for an entire image library. Simply use the quick links below to jump straight to the method that’s right for your goals.

Method 1. Get Full Size Image URL (Best for Single Images)

If you only want to use one or two large images on your website, then you can simply change that image’s URL.

When you upload an image to WordPress that exceeds the maximum dimensions, WordPress will scale that image to create a smaller version. However, the original image is still intact.

To show the original image, you simply need to delete ‘-scaled’ from the end of the image’s URL. Then, you can add it to any page or post using the modified link.

To do this, open the Media Library by going to Media » Library, and then select your large image.

Towards the right of the screen, find the ‘File URL’ field

You simply need to delete ‘-scaled’ from the end of the image URL.

With that done, you can copy the image URL and insert the image anywhere on your WordPress blog or website.

Just be aware that you need to embed the image using the link, rather than selecting it from the WordPress Media Library.

To do this, go the post or page where you want to use the image, and then click on the ‘+’ icon to add a new block.

Here, type in ‘Image’ and then select the right block when it appears.

With that done, click on ‘Insert from URL.’

You can then simply paste the full size image URL into the field, and press the ‘Enter’ key on your keyboard.

When you’re ready to go live, just click ‘Publish’ or ‘Update.’ You can now visit this page or post to see the full size image in action.

To add more full size images, simply follow the same process described above.

Method 2. Automatically Disable Image Scaling in WordPress (With a Plugin)

If you want to show lots of different full size images on your website, then you can disable image scaling using Disable “BIG Image” Threshold.

This free plugin has no settings for you to configure, so it’s very easy to use.

First, you’ll need to install and activate the Disable “BIG Image” Threshold plugin. For more details on installing a plugin, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, the plugin automatically removes the big image threshold.

WordPress will now no longer add the ‘-scaled’ attribute to any image, so you can upload large media files and WordPress will show them full size by default.

Method 3. Automatically Disable Image Scaling in WordPress (Using Code)

You can also disable image scaling across your entire website using code.

If you don’t want to use a plugin, then you can add the code to your theme’s function.php file. For more information, please see our guide on how to add custom code in WordPress.

However, we recommend using WPCode instead. WPCode is the best code snippet plugin for WordPress that allows you to simply copy and paste code into a user-friendly editor. This is much easier and safer than editing your theme files directly.

To begin, you’ll need to install and activate WPCode. For more information, you can see our step-by-step guide on how to install a WordPress plugin.

In the WordPress dashboard, go to Code Snippets » Add Snippet.

Here, simply hover your mouse over ‘Add Your Custom Code.’

When it appears, click on ‘Use snippet.’

To start, type in a title for the custom code snippet. This can be anything that helps you identify the snippet in the WordPress dashboard.

After that, open the ‘Code Type’ dropdown and select ‘PHP Snippet.’

In the code editor, add the following code snippet:

add_filter( 'big_image_size_threshold', '__return_false' );

When you’re happy with the snippet, scroll to the ‘Insertion’ section. WPCode can add your code to different locations, such as after every post, frontend only, or admin only.

We want to use the custom PHP snippet across our entire WordPress website, so click on ‘Auto Insert’ if it isn’t already selected. Then, open the ‘Location’ dropdown menu and choose ‘Run Everywhere.’

After that, you’re ready to scroll to the top of the screen and click on the ‘Inactive’ toggle so it changes to ‘Active.’

Finally, click on ‘Save Snippet’ to make the PHP snippet live.

Now, if you upload a large image WordPress will use the original dimensions, rather than resizing the image.

Method 4: Open Full Size WordPress Images in a Lightbox

The final option is adding a full size image lightbox to your site, which is perfect if you’re creating a gallery, carousel, or photo portfolio.

This method allows you to show smaller thumbnail images when the page first loads. Visitors can then click on any thumbnail to see the full sized image in a popup.

Just be aware that you need to upload full sized images for your gallery, which means you’ll need to disable image scaling using one of the above methods. If you don’t, then your lightbox will use a scaled-down version of your large images.

Once you’ve disabled image scaling, it’s time to create a gallery. We recommend using the Envira Gallery plugin as it’s the best WordPress image gallery plugin in the market and lets you create beautiful and eye-catching lightboxes.

The first thing you’ll need to do is install the Envira Gallery plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

After installing and activating the plugin, see our step-by-step guide on creating an image gallery in WordPress.

No matter what method you use to add images with large dimensions, it’s essential to optimize them for the web, so you don’t slow down your website.

We hope this article helped you learn how to display full size images in WordPress. You can also go through our guide on the best drag and drop page builder plugins and how to create a custom Instagram photo feed in WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.