Constraining a mktEditable image proportions in email template | Community
Skip to main content
A
Anonymous
October 31, 2013
Solved

Constraining a mktEditable image proportions in email template

  • October 31, 2013
  • 2 replies
  • 1316 views
Hello,

I am trying to create a mktEditable image that will retain its proportions and style attributes when edited. The placeholder image in my template has the following style attributes: width="100%" height="230" style="display: block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;". When I try to replace the image when creating a test email, the image loses these style attributes. 

Does anyone know how I can create mktEditable images that will retain their proportions and style attributes when edited?

Thanks!
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by
Hello Ann,

Have you tried storing the image url in a token and then just reference the token within the image tag inside the mktEditable region? The image should get rendered based on the section's style settings regardless of its actual dimensions.

Not sure if this answers your question, but I've found it makes things much easier if I store the image url in a token rather than manually going into the mktEditable region and replace the image. I know it will always get rendered properly regardless of the image's dimensions.

Here's an example:
<div class="mktEditable" id="header-image" ><img style="display: block;" src="{{my.HeaderImage}}" alt="" height="230" width="560" border="0"></div>

Hope this helps!

2 replies

A
Anonymous
October 31, 2013
Ann,

What happens to the image when you lose the style attributes? Except for making it a block image,  I think those styles are superflous (i.e. img don't usually have a text-decoration property set). 
A
Anonymous
Accepted solution
October 31, 2013
Hello Ann,

Have you tried storing the image url in a token and then just reference the token within the image tag inside the mktEditable region? The image should get rendered based on the section's style settings regardless of its actual dimensions.

Not sure if this answers your question, but I've found it makes things much easier if I store the image url in a token rather than manually going into the mktEditable region and replace the image. I know it will always get rendered properly regardless of the image's dimensions.

Here's an example:
<div class="mktEditable" id="header-image" ><img style="display: block;" src="{{my.HeaderImage}}" alt="" height="230" width="560" border="0"></div>

Hope this helps!
Terms & ConditionsAccessibility statement

Loading footer...