This custom HTML layout contains a left column for an image and the right column containing the post title and description. This custom HTML will collapse as a single column in mobile view.

2-Column RSS Layout

%RSS-FEED|URL:https://website.com/rss/feed|SHOW:ALL%
    %RSS-LOOP|LIMIT:5%
    <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin:0; padding:0; border-collapse:collapse;">
        <tr>
            <td align="left" valign="top" width="325">
                <img src="%RSS:ITEM:MEDIA%" width="325" style="display:block; width:100%; max-width:100%; border:0;">
            </td>
            <td width="20" height="20"> </td>
            <td align="left" valign="top">
                <div style="padding-bottom:30px; font-size:15px; font-family: Open Sans, Roboto, San Francisco, Helvetica, Arial, sans-serif; color:#222222; line-height:130%; line-height:1.2;">
                    <div style="margin:0; padding-bottom:8px; font-size:23px; color:#000000; font-family: Open Sans, Roboto, San Francisco, Helvetica, Arial, sans-serif; line-height:1.1;">
                        <a href="%RSS:ITEM:LINK%" style="font-size:23px; color:#000000; font-family: Open Sans, Roboto, San Francisco, Helvetica, Arial, sans-serif; line-height:1.1; font-weight:700; text-decoration:none;">
                            <span style="font-size:19px; color:#000000; font-family: Open Sans, Roboto, San Francisco, Helvetica, Arial, sans-serif; line-height:1.1; font-weight:700; text-decoration:none;">%RSS:ITEM:TITLE%</span>
                        </a>
                    </div>
                    <div style="padding-bottom:10px; font-size:15px; font-family: Open Sans, Roboto, San Francisco, Helvetica, Arial, sans-serif; color:#222222; line-height:130%; line-height:1.2;">%RSS:ITEM:DESCRIPTION%</div>
                    <div style="font-size:13px; font-family: Open Sans, Roboto, San Francisco, Helvetica, Arial, sans-serif; color:#222222;"><b>%RSS:ITEM:STARTDATE%</b></div>
                </div>
            </td>
        </tr>
    </table>
    %RSS-LOOP%
%RSS-FEED%

I tried the code, but the image would not show. How do I fix it?

@nwwatim Hi, I would need to see how you've implemented this in your campaign. Would you mind reaching out to our support staff and have them send your campaign details to me directly. I can take a closer look. Thanks!

@kvann Thank you for your reply.

This was used in an email CMS template as a customized HTML block, and this is the code: (I modified a bit per my manager's request)

And the image currently shows "Error! Filename not specified. | Error! Filename not specified."

Hi @nwwatim,
Looking at your RSS feed located here https://goodnews.greatergood.com/feed/, I see that the image associated with each article is in the media:content namespace, ie

<media:content medium="image" url="https://drb960u7vv58y.cloudfront.net/resize/368959/1200/627/image.jpg" type="image/jpg" />

To pull the value for the url attribute from this namespace, we'll write it like this, disregarding the media text:
%RSS:ITEM:CONTENT_URL%

So between our RSS pers tag, it would look something like this:

%RSS-FEED|URL:https://goodnews.greatergood.com/feed/|SHOW:ALL% %RSS-LOOP|LIMIT:3%
    <img src="%RSS:ITEM:CONTENT_URL%" />
%RSS-LOOP% %RSS-FEED%

Here's a complete example with our 2 column layout:

%RSS-FEED|URL:https://goodnews.greatergood.com/feed/|SHOW:ALL% %RSS-LOOP|LIMIT:3%

<table cellpadding="0" cellspacing="0" border="0" width="100%" style="table-style: fixed;">
    <tr>
        <td valign="top" align="center" width="325" style="padding-bottom: 20px;">
            <a href="%RSS:ITEM:LINK%"><img src="%RSS:ITEM:CONTENT_URL%" width="325" style="display: block; width: 100% !important; min-width: 325px !important; max-width: 100% !important;" /></a>
        </td>
        <td width="20"></td>
        <td valign="top" align="left" style="padding-bottom: 20px;">
            <table cellpadding="0" cellspacing="0" border="0" width="100%" style="table-style: fixed;">
                <tr>
                    <td valign="top" align="left" style="padding-bottom: 10px; vertical-align: top; font-family: 'Roboto', sans-serif; font-size: 17px; color: #000000; line-height: 1.2; line-height: 120%;">
                        <a href="%RSS:ITEM:LINK%" style="font-family: 'Roboto', sans-serif; font-size: 17px; color: #000000; text-decoration: underline; font-weight: bold;">
                            <span style="font-family: 'Roboto', sans-serif; font-size: 17px; color: #000000; text-decoration: underline; font-weight: bold;">%RSS:ITEM:TITLE%</span>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td valign="top" align="left" style="padding-bottom: 10px; vertical-align: top; font-family: 'Roboto', sans-serif; font-size: 12px; color: #888; line-height: 1.2; line-height: 120%;">
                        <span style="font-family: 'Roboto', sans-serif; font-size: 12px; color: #888;">%RSS:ITEM:PUBDATE%</span>
                    </td>
                </tr>
                <tr>
                    <td valign="middle" align="left" style="vertical-align: top; font-family: 'Roboto', sans-serif; font-size: 14px; color: #333333; line-height: 1.2; line-height: 140%;">
                        %RSS:ITEM:DESCRIPTION%
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
%RSS-LOOP% %RSS-FEED%

Hope this help 🤞 Please let me know if I can assist further.

(UPDATE: edit link color for title tag)

@kvann Thank you so much for your help. I suspected the ITEM:MEDIA was the issue, but could not figure out what else to replace with. I will modify and report back. Again, I truly appreciate your time and help.

@kvann

IT WORKS! Thank you so much!

Hi @nwwatim 🙌
You're very welcome! ... have a good weekend