Would you like to learn how to view full size images in WordPress?
The latest version of WordPress will automatically resize large images to improve performance. However, sometimes you need to display larger-sized images.
This tutorial introduces four different ways to display full-size images on your WordPress site.
Why does WordPress scale large images?
In previous versions of WordPress, users could upload very large images.
What happened, however, is that beginners to WordPress uploaded images that were just too big for the modern web. Large images result in slow website loading speeds and poor performance.
To fix this problem, the WordPress 5.3 update changed the way WordPress handles very large images.
For example, if you upload an image with dimensions of 5000 x 7000 pixels, WordPress will resize the image to 2560 pixels and scale the width to match the original dimensions.
When a user visits a page with a previously large picture, they are shown the reduced version of that picture.
This results in improved website performance and overall happier users.
Reasons to prevent WordPress images from scaling
This new feature will be useful for most WordPress website owners, but some users may need to view full size images.
For example, if you’re a photographer or artist who sells your work, you may want to display larger images on your website for visitors to buy or download.
Or you run a website that requires larger images, such as B. a photo website or a website that sells custom prints and pictures.
Maybe you need a large picture for your home page wallpaper that is larger than the 2560px limit?
Regardless of the reason you want a full size image, we’ll show you how to do it step by step.
How To View Full Size Images In WordPress (4 Methods)
There are 4 different ways you can view full size images in WordPress.
Some methods work better for individual pictures, while others are best for an entire picture library.
You should choose the full size imaging method that works for your goals.
Method 1. Get the full size image url in WordPress
If you only want to use a large image or two on your website, this solution is probably the best.
If you upload an image to WordPress that exceeds the dimensions, WordPress will scale your image and create a new one. However, the original image is still intact.
To see the original image dimensions, you’ll need to delete “-scaled” at the end of the WordPress image url and paste the image with the modified link into your site.
Just go to your media library by going to Media library and choose your big picture.
Now find your ‘file url’ in the image field.
Next, you’ll want to delete “-scaled” at the end of your image url.
After that, you can copy the image url and paste the image into your website.
Note that you need to embed the image in your site via the link minus the scaled part.
To do this, navigate to a post or page that you want to add the image to and click the ‘+’ icon to add a new block.
Then click the image icon to add an image block to paste your URL into.
Click “Paste from URL,” paste your full-size image url into the box, and hit Enter.
After that you have to click on “Publish” or “Update” if the post is already active. Your full size image is now ready to be viewed on your website.
You can do the same process for any full size image that you want to add to your site. However, as long as you use the file url minus “scaled”, your WordPress images will display at full size.
Method 2. Automatically disable image scaling in WordPress (using a plugin).
The second method is to use a WordPress plugin to disable image scaling on your website.
The plug-in we recommend is called Disable the “BIG Image” threshold. This plugin offers one of the easiest workarounds for displaying large images on your website and is completely free to use.
First, you need to install and activate the BIG Image threshold deactivation plugin. For more information on installing a plugin, see our step-by-step guide on installing a WordPress plugin.
Once you’ve installed and activated the plugin on your site, it will automatically remove the large image threshold added by WordPress.
You can add new images just like you were before the WordPress image update.
When this plugin is active, WordPress does not add the ‘-scaled’ attribute to any image.
Method 3.Automatically disable Big Image Scaling in WordPress (with code snippet)
Another option is to add a code snippet to WordPress, which accomplishes the same goal as the plugin above.
If for some reason the plugin doesn’t work or you don’t want to install too many plugins, you can use this method.
The new WordPress image scaling feature uses a filter called big_image_size_threshold.
You should use the following code to disable this feature:
add_filter (‘big_image_size_threshold’, ‘__return_false’);
You’ll need to add this code to your theme’s functions.php file, a site-specific plugin, or using the code snippet plugin.
Method 4: open full-size WordPress images in a lightbox
The final option is to add a full size image lightbox to your site. With this solution, you get the best of both worlds.
You can upload smaller thumbnails to your blog content, gallery, or carousel. Clicking on it will display your picture in full size.
We recommend using the Envira Gallery plugin for this. It’s the best WordPress image gallery plugin out there, and it’s easy to add the lightbox pop-up image effect.
The first thing to do is to install the Envira Gallery plugin. For more information, see our step-by-step guide on installing a WordPress plugin.
After installing and activating the plugin, read our step-by-step instructions for creating an image gallery in WordPress with the lightbox effect.
Note that before you can upload full size images for your gallery, you need to disable image scaling through the plugin or the methods above for child topics.
Otherwise, your lightbox images will use the scaled down version of the image.
Finally, it should be noted that when adding large-sized images, it is important to optimize them for the web so that you don’t slow down your website.
We hope this article has helped you view full size images in WordPress. You might want to check out our guide to optimizing images for SEO and our expert pick of 40 useful tools to manage and grow your blog.
If you enjoyed this article, please subscribe to our YouTube channel for WordPress video tutorials. You can also find us on Twitter and Facebook.