-
Posts
-
Here is an example https://brightideas.co/how-i-use-trade-shows-to-find-new-suppliers-for-my-amazon-wholesale-business/
When I created the image, it is crystal clear. Image size is 1000px X 360px
Why is this happening?
Hey Trent,
I checked on the link you gave however it returns Error 404 – Page not found.
Do you have any image optimization plugin enabled? also try to make sure when you select a featured image, change the size to full since by default it uses medium size.Best regards,
NikkoHere’s another link: https://brightideas.co/blurry-image/
I use WP Smush and the image was inserted full size.
Hi,
It seems like wpengine sets a scrset attribute because the image code looks like:
<img class="aligncenter size-full wp-image-9988" src="http://3arbfj16woyk1773ke7lfben6q-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/How-I-Use-Trade-Shows-to-Find-New-Suppliers-for-My-Amazon-Wholesale-Business.jpg" alt="" srcset="https://3arbfj16woyk1773ke7lfben6q-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/How-I-Use-Trade-Shows-to-Find-New-Suppliers-for-My-Amazon-Wholesale-Business.jpg 1000w, https://3arbfj16woyk1773ke7lfben6q-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/How-I-Use-Trade-Shows-to-Find-New-Suppliers-for-My-Amazon-Wholesale-Business-300x108.jpg 300w, https://3arbfj16woyk1773ke7lfben6q-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/How-I-Use-Trade-Shows-to-Find-New-Suppliers-for-My-Amazon-Wholesale-Business-768x276.jpg 768w, https://3arbfj16woyk1773ke7lfben6q-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/How-I-Use-Trade-Shows-to-Find-New-Suppliers-for-My-Amazon-Wholesale-Business-705x254.jpg 705w, https://3arbfj16woyk1773ke7lfben6q-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/How-I-Use-Trade-Shows-to-Find-New-Suppliers-for-My-Amazon-Wholesale-Business-450x162.jpg 450w, https://3arbfj16woyk1773ke7lfben6q-wpengine.netdna-ssl.com/wp-content/uploads/2018/08/How-I-Use-Trade-Shows-to-Find-New-Suppliers-for-My-Amazon-Wholesale-Business-610x220.jpg 610w" sizes="(max-width: 1000px) 100vw, 1000px" width="1000" height="360">The scrset attribute is great if you want to increase the website performance (loading times, etc.) but it will also make the browser load compressed (low-res) versions of the image. See: https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-srcset/
If you want to make sure the original “high res” image will be loaded by the browser you must remove the scrset attribute. I’d recommend to talk to wpengine about this.
Best regards,
DudeI have checked with the hosting company and they don’t agree. They tell me that it is the theme causing the image to be blurry, and as proof, they put a copy of my site in the staging area and switch the theme to the default WP theme. As you can see, the image is not blurred when using the default theme: http://brightideas.staging.wpengine.com/how-i-use-trade-shows-to-find-new-suppliers-for-my-amazon-wholesale-business/ (hosted on WPengine)
So, how do we fix the issue of blurred featured images on my blog posts?
Hi,
Please try the following and check if that makes a difference:
1. Install this plugin: https://wordpress.org/plugins/simple-image-sizes/
2. Go to Settings > Media
3. Change theentry_with_sidebarimage size (increase its width / height).
4. Regenerate the thumbnails by clicking the button at the bottom.Best regards,
YigitHi Yigit,
#3 of your instructions was ambiguous, so I wasn’t able to figure out what you wanted me to do. I made the other changes and the image remains blurry. https://brightideas.co/how-i-use-trade-shows-to-find-new-suppliers-for-my-amazon-wholesale-business/
Hi,
You can try to increase the thumbnail quality by adding this code to the child theme functions.php file:
add_filter( 'jpeg_quality', function() { return 100;} );Reference: https://aristath.github.io/blog/change-wordpress-image-quality
Afterwards you need to regenerate all thumbnails with a plugin like: https://de.wordpress.org/plugins/regenerate-thumbnails/
Best regards,
DudeThat didn’t work either. I added the code to the last line of functions-enfold.php and then uploaded the image again with a new file name. I then replace the featured image on https://brightideas.co/how-i-use-trade-shows-to-find-new-suppliers-for-my-amazon-wholesale-business/ and it is every bit as blurry as before.
You can possible tell me that I’m the only Enfold user to every complain of a blurry featured image??
Hi,
Can you try to modify loop-index.php located in enfold\includes folder and find this code (line 66):
$size = strpos($blog_style, 'big') ? (strpos($current_post['post_layout'], 'sidebar') !== false) ? 'entry_with_sidebar' : 'entry_without_sidebar' : 'square';to:
$size = 'full';Please flush out cache if you have caching plugin, hope this helps.
Best regards,
NikkoHi Trent Dyrsmid,
No, I think that are the only solutions so I think it’s more of a caching issue as you can see in the screenshot the size should have changed it to full which means that the url of the image is supposed to look like mydomain.com/uploads/2018/08/myimage.jpg but instead it still fetches the cropped image which the url would look like this mydomain.com/uploads/2018/08/myimage-845×321.jpg
Can you give us temporary admin access to your site to check the settings and probably clear cache as well as ftp access to modify the file I mentioned so we can try to test it and check further.
Just place the wp-admin and ftp access in private content so it’s only visible to the moderators.Best regards,
NikkoHi Trent Dyrsmid,
Glad you got it working for you! :)
If you need further assistance please let us know.
Best regards,
VictoriaHi, I edited the loop-index.php file as indicated and my featured images are still blurry.
Any other ideas? They are not blurry in the actual post, just the main blog page. Link in
private content.Thank you!
- You must be logged in to reply to this topic.