Adding Images to Your Template

← Email Design
In order to display images in your template:

Locate Images in Your Feed

To verify if images are populated in your feed, open the feed page (xml) and look for one of these elements. Digesto supports three different image elements:

1) Enclosure Image (<enclosure>)
This is the standard way to pass images in an RSS feed. 
Example: <enclosure url="http://perkuto.com/wp-content/uploads/2017/05/perkuto_sigle_200x200_t.png" length="900" type="image/jpg" />

2) Media-Content Image (<media:content>)
Example: <media:content url="http://www.learningliftoff.com/wp-content/uploads/2015/09/SOTW_Fruit.jpg" type="image/jpeg" medium="image" width="100%" height="auto">
    </media:content>

3) Embed Image 
Image added to the beginning of the Excerpt text (<description>) or Full Content element (<content:encoded>).
Example:<content:encoded><![CDATA[ <img class="size-full wp-image-7788" src="http://perkuto.com/wp-content/uploads/2017/05/mkto-core.png" alt="" width="720" height="405" srcset="http://perkuto.com/wp-content/uploads/2017/05/mkto-core.png 720w, http://perkuto.com/wp-content/uploads/2017/05/mkto-core-300x169.png 300w, http://perkuto.com/wp-content/uploads/2017/05/mkto-core-555x312.png 555w" sizes="(max-width: 720px) 100vw, 720px" /><br />...

Still can't locate images in your feed? Contact us or check out this tutorial (WordPress only) to add images to your feed.

Add Featured Images to Your Template

To add images to your Digest, you can either chose a new template from our gallery (recommended) or customize your existing template with the WYSIWYG editor or by manually adding it via the code editor.

Using a New Template

The quickest and easiest way to add images to your template is to use and benefit from one of our pre-formatted templates that will already have a placeholder for your post images. 
From the Digest Editor, position your cursor where you would like the image to appear and select the Digesto Tag for Enclosure Image, Enclosure Image (URL). Alternatively, for Embed Image, use First Post Image (Embed Code), or for Media Content Image, use First Post Image (Embed Code).




Manual update

Toggle to code view (</>) to edit the code manually. Use the following merge tags to dynamically insert image URLs into your Digest Template.

1) For Enclosure image, use the {{ITEM-IMAGE-URL}} merge tag
Example: 
<!-- BEGIN IMAGE CODE --><a href="{{ITEM-LINK}}"><img border="0" alt="Post Image" onerror="this.style.display = 'none'" src="{{ITEM-IMAGE-URL}}" width="100%" height="auto"></a><!-- END IMAGE CODE -->

2) For Media Content image, use the {{ITEM-MEDIA-CONTENT-IMAGE-URL}} merge tag
Example:
<!-- BEGIN IMAGE CODE --><a href="{{ITEM-LINK}}"><img border="0" alt="Post Image" onerror="this.style.display = 'none'" src="{{ITEM-MEDIA-CONTENT-IMAGE-URL}}" width="100%" height="auto"></a><!-- END IMAGE CODE -->

3) For Embed image, use the {{ITEM-FIRSTPOSTIMAGE-URL}} merge tag
Digesto offers a special features that will extract the image from the "body" of your feed to make it available to use as a header image. This allows for more control of the image styling.
Use First Image (Embed Code) in your template editor or go in code view and insert {{ITEM-FIRSTPOSTIMAGE-URL}} as part of your image code. Example:
<!-- BEGIN IMAGE CODE --><a href="{{ITEM-LINK}}"><img border="0" alt="Post Image" onerror="this.style.display = 'none'" src="{{ITEM-FIRSTPOSTIMAGE-URL}}" width="100%" height="auto"></a><!-- END IMAGE CODE -->

Adjusting Body Images


In addition to featured\thumbnail images, Images may appear on the body section of your post. Your blog email may require a different formatting to adjust to a different width and adapt to specific email clients and ensure responsiveness.You can gain control image formatting with CSS Styling and Images attributes using the Image Inline Style and Image Attribute fields found under "Advanced Settings" at the bottom of the template editor.

Image Style and Image Attributes



Feedback and Knowledge Base

(thinking…)