After years of experimenting with Wordpress image optimization methods, I've come up with an approach which seems the best so far and achieves the following:
- Pixel perfect image size for any screen and retina
- Delivers the latest supported formats (AVIF, WebP), and falls back to traditional: PNG, JPG
- Achieves high image scoring marks in Google Page Speed and GT Metrix tests
- Only 1 file on the server per image (less bloated and manageable /uploads folder)
- Only 1 file size per image: 'Full' - no more agonizing about which pixel size to choose when adding an image to a fluid % design
- Works in Elementor, but should work in general in Wordpress and with themes (you may need to tweak the snippet depending on what your setup is)
00:00 Introduction
00:41 Example and Page Speed Results
01:44 Pain Points We Are Solving
03:24 How Wordpress Handles Images by Default
05:02 Uploads Folder Headaches
06:21 Default Page Speed Results
07:32 Using Only 1 File Per Image + Functions File Changes
09:50 Removing Elementor Size Controls
10:28 Uploads Folder After Functions File Changes
11:23 How to Disable -scaled Images
11:58 Manually Setting Scaled Image Max Size
14:30 Page Scores Before Using Optimole (Bad)
15:32 Optimole Plugin Install and Settings
19:26 WP Rocket Plugin Install and Settings
21:03 Page Scores After Plugin Installs (Good)
22:50 Summary and Call for Feedback
I'm not sure how to share the snippet(s) in the description without formatting issues so you can get the code via this Mailchimp landing page, by joining the Grizzly Den: mailchi.mp/0f6...
Tools used:
Get Optimole: bit.ly/optimol...
Get WP Rocket: bit.ly/wp-rock...
Get the Hello theme: wordpress.org/...
Get the Hello child theme: github.com/ele...
Get the Elementor page builder: bit.ly/wp-img-o...
We may receive a small affiliate kickback if you purchase any of these solutions using our links. Thanks!
Негізгі бет The Best Wordpress Image Optimization Method
No video
Пікірлер: 35