Hi, I’m trying to work out how to insert a complex image tag into my entries, where I call the snippet of code and then add in the file name and caption, as in {snippet file_name="picture.webp" caption="some picture"}, which creates a block of <img> and code, so that if at a later date I want to change the code I don’t have to trawl through hundreds of entries. Is this possible?
Best
Andy
Yes - you can use either a template variable (if it is a fixed bit of code) or template partial (if you plan to use evaluated EE tags within the code block).
HTH
Thanks for your reply. The problem is I’m trying to include some kind of partial into the entry text, such as:
This is some text
{figure image_file="image.webp" caption="This is an image"}
This is some more text
That is going to insert and populate this:
<figure class="figure">
[img]/cdn-cgi/image/fit=scale-down,format=auto,width=1200/images/blog_images/{image_file}?v=2bngZBNbaOhqxlhuBbiWrqotsKyDm3WEctypography_img_src_end
alt="{caption} image" class="figure-img img-fluid rounded" srcset="/cdn-cgi/image/fit=scale-down,format=auto,width=200/images/blog_images/{image_file}?v=3 200w,
/cdn-cgi/image/fit=scale-down,format=auto,width=576/images/blog_images/{image_file}?v=3 576w,
/cdn-cgi/image/fit=scale-down,format=auto,width=768/images/blog_images/{image_file}?v=3 768w,
/cdn-cgi/image/fit=scale-down,format=auto,width=992/images/blog_images/{image_file}?v=3 992w,
/cdn-cgi/image/fit=scale-down,format=auto,width=1200/images/blog_images/{image_file}?v=3 12000w"
sizes="(max-width: 200px) 200px,
(max-width: 576px) 576px,
(max-width: 7680px) 768px,
(max-width: 992px) 992px,
(max-width: 1200px) 1200px"
[/img]
<figcaption class="figure-caption">{caption}</figcaption>
</figure>
So far I can only use a Template Variable to insert the block of code, but without the variables (image and caption).
Hope this makes sence.
Assuming that you intend to populate the two variables {image_file}
and {caption}
from some surrounding EE tag-pair, then simply putting this code into a template partial should do the trick - template partials are inserted into the EE template before tags are evaluated so EE will try to expand any variables included in the partial.
FWIW you probably could achieve the same srcset population using a single EE tag and avoid the need to insert your code fragment completely. The JCOGS Image add-on will (among the many things it is capable of) generate an <img>
tag with populated srcset= and sizes
parameters along with all the image versions needed. Full disclosure - I am the author of the addon… 😊
HTH
Packet Tide owns and develops ExpressionEngine. © Packet Tide, All Rights Reserved.