How to add multiple images within <repeater><layout> tags

Hi everyone,

I am a designer new to Campaign Monitor and have to say I am really liking it. I am just having trouble trying to get my template perfected. I am trying to create an image layout section where a user can add a title, subtitle, a smaller image to the left of text that wraps around it. This is all done within tables and looks fine but how do I get it so the user can add another image, say in another paragraph? I can set this up in the template with a specified number of images but this number will change depending on the content.

Currently I have it set up within a repeater tag, where the user can add a title, subtitle, content, image block, as they are all separate layouts. This seems to work fine but it just seems like a lot of work as they have to keep adding a layout for every section of content they want to add.

I had to do this for list items as well as using an image for a bullet doesn't work in most browsers so I had to set up a layout that has an image for the bullet and then the text beside it.

Is there a better way to do this? The code below is for the image layout block I created.

Any help would be appreciated.

Thanks

<layout label="Image Block Left">
              <table width="458" border="0" cellspacing="0" cellpadding="0">
                <tr>
                  <td width="54" align="left" valign="top" style="padding-right: 10px;"><img src="images/left-image.jpg" width="150" height="70" editable="true" label="Image" /></td>
                  <td width="404
                  " align="left" valign="top">
                    <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td style="font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 20px; color: #323232;"><multiline label="Description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. </multiline></td>
  </tr>
  <tr>
    <td style="padding-top: 10px;"><img src="images/btn-learn-more.gif" width="165" height="28" editable="true" label="Button" /></td>
  </tr>
</table>

                  </td>
                  </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td>&nbsp;</td>
                </tr>
              </table>
              </layout>
Mindsplit, 5 years ago

This is the full correct post.

oneblackcrayon oneblackcrayon, 5 years ago

Hey Mindsplit!
So if I understand you, you want to add multiple images to a content block.
Currently, the Multiline tag does not support inline images, which I hope will be fixed at some point (please fix this CM). So the best way to do it is to create a layout that has multiple images and one multiline section. Then delete the extra images you do not need. Also, you may want to remove the padding inline style on your TD as I believe Outlook will not recognize it. Hope this helps.

Mindsplit, 5 years ago

Hey Crayon,

I've had issues before with images aligned left or right and some email clients don't like the padding and margins around images so I've been putting images into their own table column and the text beside it in another column.

So if one block in my template contained say five different images and text sections the user would be able to delete the image and text but CM seems to leave some spacing where those images and text were which would look odd if there was only one image. And what if the user wanted to have six images? I'm hoping CM will have the functionality to add images in the multiline editor. That would help things a lot!

Thanks for the help.

Chris

roshodgekiss roshodgekiss, 5 years ago

Hi Chris, thanks for the feedback here. We're keen to look into how we can better work with images in the editor, so I've certainly added your feedback internally. Many thanks!


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098