Tagged: enfold, image quality, image with hotspots
-
AuthorPosts
-
July 6, 2016 at 1:36 am #657309
Hello,
I uploaded a picture for an Image with hotspots element. The quality of the displayed images is just plain awful.
Surprisingly, the image is for real in a very good quality. I tested opening all of the versions of the image wordpress seems to make after I upload it, and all of them looks good when opened in my mac.
If I open any of this images independently using my browser, they look as good as they should. But somehow when in the page, element into the enfold theme, the image is amazingly crappy.
I found out the cause of the problem, by right click on the image and select “open image in new tab”. The image looks great but for some reason, enfold is using the lowest size of the versions: 300×169. No surprise it looks crappy in a 1920px screen.
Checking in the element’s configuration, i can’t see where to specify the size it should be taking the picture, nor in the wordpress media page.How can I fix this?
Thanks,
SantiagoJuly 6, 2016 at 6:29 am #657331Hey sanvolador!
The images used, are based on some tests, on how it should be visible to the users.
Can you please give us a link to your web site, so we can give it a look, understand what you need and help you get it further?Thanks a lot for your patience and understanding
Best regards,
BasilisJuly 6, 2016 at 7:35 pm #657681Hi Basilis, thank yo for your answer.
Unfortunately I’m testing in a VM before uploading to the website, but I’ll explain step by step:1) I’ve imported “Startup business demo” to work as a base .
2) When editing the home page, there is a section with an element “Image with hotspots”.
3) I’ve uploaded an image of size 1920×1080 (collage.jpg), to replace the original in the demo.
4) When I check the wordpress directory wp-content/uploads/2015/02 , along with many other images, I can see my own uploaded image but in many versions.
> ls collage*
collage-1030×579.jpg collage-1500×430.jpg collage-180×180.jpg collage-36×36.jpg collage-495×400.jpg collage-768×432.jpg collage-845×684.jpg
collage-120×120.jpg collage-1500×630.jpg collage-260×185.jpg collage-450×253.jpg collage-705×397.jpg collage-80×80.jpg collage.jpg
collage-1210×423.jpg collage-1500×844.jpg collage-300×169.jpg collage-450×450.jpg collage-710×375.jpg collage-845×321.jpg5) When I check the page using my browser (Safari, Chrome, Firefox), I see the image awfully rendered.
6) I open the image in a new tab, and see that the problem is the theme is using collage-300×169.jpg, instead of another larger version, more appropriate regarding the screen size.
7) Couldn’t find any option to “tell” Enfold to use the largest image possible for the screen size.
Suggestions?
Thanx!
SJuly 8, 2016 at 11:57 pm #658618Basilis, any update?
Thank you,
SJuly 9, 2016 at 3:03 am #658669Hi,
Thank you for the info. In the hotspot element, after clicking the “Insert Image” button and selecting the appropriate image, are you setting the correct “ATTACHMENT DISPLAY SETTINGS” > “Size” before clicking the “Insert” button? It will default to the smallest thumbnail.
Best regards,
IsmaelJuly 9, 2016 at 4:42 am #658694Ismael,
That was exactly the problem, or other than a problem something me (newbie) haven’t seen. Thank you very much.
Have a great weekend.July 10, 2016 at 12:42 pm #658942Hi,
Great, glad we could help. Please let us know if you should need any more help on the topic.
Thanks,
RikardDecember 2, 2016 at 2:07 am #719464I am a long time traditional website designer used to sizing and compressing my images for html pages and, whilst using enfold for a number of my projects these days, am unhappy with the overall quality of images after being uploaded to wordpress. Is there a “best practice” formula for uploading?? ie a suggested pre upload size, resolution and compression level in order that, once uploaded, the ideal compromise between quality and loading speed is achieved?
Seems to me that the wordpress (enfold?) defaults do more than a 10% reduction in quality.December 7, 2016 at 4:15 am #721311Hi,
It depends on where you want to use the image. The theme generates multiple versions of the thumbnails which is then use on different elements in the theme. What image or element are you trying to improve? If you’re familiar with the browser inspector, you can check the theme demo and inspect the images there. This article might help as well.
// http://kriesi.at/archives/4-key-wordpress-image-optimization-tips
Best regards,
IsmaelJune 6, 2017 at 8:50 pm #804674I’m experiencing the same issue with image quality being noticeably reduced in the thumbnails with pixelation and artifacts. The images will render fine in the WP design interface and the Media Library, but render poorly on the live webpage. Any solutions or suggestions? I’d go SVG but appears you can’t upload that format.
June 7, 2017 at 8:40 am #804920Hi @stanbrid,
Would be great if you could provide us with a site and screenshots of the problem.
Best regards,
RikardJune 19, 2017 at 4:49 pm #809870Hi Rikard,
A good example is here: http://www.voicecarrier.com/reseller/ scroll to the third-to-last section that reads “ALREADY A PARTNER?”. It becomes evident when you compare the text to the images. The text is nice and crisp. The graphics are blurry sans clean lines. Both were uploaded at 300dpi. I’m on a Retina screen, btw.
Thank you for the help,
NicoleJune 21, 2017 at 11:12 pm #811216Hi,
That is basically of the size that you need to upload.
You would need to edit the image to be a good quality and upload it as should.Thank you
Best regards,
BasilisApril 9, 2018 at 6:07 pm #939339Hi! As Ismael says, when i go to select an image as background of a section or a column the theme select automatically the thumbnail size of image. There’s a way to change this defaul selection? Maybe use the big or the orginal one?
Many thanks!
April 10, 2018 at 8:09 am #939683Hi housedada,
Wordpress is notorious for compressing images, there is a way to control image compression, and it says in a thread that it is not supposed to compress the png images at all, but… Here is some reading
https://wordpress.stackexchange.com/questions/227007/wordpress-png-compression-issueIf you need further assistance please let us know.
Best regards,
VictoriaApril 10, 2018 at 7:35 pm #939990Hi Victoria, thanks for your answer but my questions is about completely another thing. I’m talking about default selection of image size when i try to choose an image for a background (in sections or column).
Avia builder > Section > Section Background > Insert Image > then i select an image > and under “Attachment Display Settings” on the media sidebar the default dimensions selected is “Medium”, one of the smallest size here, and is strange because i’m here to select a background.
So… there’s a way to change che default selection?
Thanks.
n.April 12, 2018 at 4:44 am #940750Hi housedada,
You mean this
It’s just for you to specify which size of attachment you’re trying to assign, you can change it there in the drop-down.There is no such functionality to specify the size you need in Enfold out of the box.
If you need further assistance please let us know.
Best regards,
Victoria -
AuthorPosts
- You must be logged in to reply to this topic.