Hi this client is a high end art gallery and they are very concerned about how their images display. They use apples double pixel density displays in thier office and i thing because of that the images appear soft to them So for example if i put a 250px image in a 250px container. those displays want a 500 px image in essence and so the browser up rezes them and so they appear soft.
Is there any practical solution to this issue- like someway to use a different image size if its being viewed on a retina display.
Hope ive framed this correctly
Hi,
Welcome to Toolset support. Toolset does not have any additional consideration when it comes to Retina screens, as it uses the WordPress standards.
But as WordPress uses scrset, it handles such scenarios automatically. I can suggest a few points which is not related to Toolset directly per se, but are general points:
Upload big enough originals
- Make sure your source image is ≥ 2× the largest CSS size it will appear at.
- Example: if you display at 250 px wide, upload at least 500 px wide.
Let WordPress generate responsive candidates
- WordPress adds srcset/sizes automatically for <img> tags created by the editor/theme/Toolset.
- Retina browsers then pick the higher-resolution candidate without you doing device detection.
Use <img> (not background images) in your templates
- Blocks editor: use the Image block with Dynamic Source (pick your Toolset image field or Featured Image). This outputs srcset.
- Legacy Views/CTs: use the image shortcodes in HTML mode, not URL-only:
[types field="artwork-image" size="large" output="html"][/types]
or
[wpv-post-featured-image size="large"]
Please check the documentation below to know more about srcset and how to implement that for Retina screens:
enlace oculto
Thanks.
