Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<figure class="post-full-image">
{{!-- This is a responsive image, it loads different sizes depending on device
https://medium.freecodecamp.org/a-guide-to-responsive-images-with-ready-to-use-templates-c400bd65c433 --}}
<img
srcset="https://res.cloudinary.com/<YOUR_USERNAME>/image/fetch/w_300,c_fit,q_auto,f_auto,dpr_auto/{{img_url feature_image size="s" absolute="true"}} 300w,
https://res.cloudinary.com/<YOUR_USERNAME>/image/fetch/w_600,c_fit,q_auto,f_auto,dpr_auto/{{img_url feature_image size="m" absolute="true"}} 600w,
https://res.cloudinary.com/<YOUR_USERNAME>/image/fetch/w_1000,c_fit,q_auto,f_auto,dpr_auto/{{img_url feature_image size="l" absolute="true"}} 1000w,
https://res.cloudinary.com/<YOUR_USERNAME>/image/fetch/w_2000,c_fit,q_auto,f_auto,dpr_auto/{{img_url feature_image size="xl" absolute="true"}} 2000w"
sizes="(max-width: 800px) 400px,
(max-width: 1170px) 1170px,
2000px"
src="https://res.cloudinary.com/<YOUR_USERNAME>/image/fetch/w_600,c_fit/{{img_url feature_image size="m" absolute="true"}}"
alt="{{title}}"
/>
</figure>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.