How do you make Marketo "Hero" image responsive? | Community
Skip to main content
Ryan_Garcia
Ryan_Garcia
Level 2
January 17, 2017
Question

How do you make Marketo "Hero" image responsive?

  • January 17, 2017
  • 1 reply
  • 5871 views

All,

I am trying to figure out what line of code makes the Marketo template "hero" image responsive. I have tried every code change I could think of and nothing is working. I have attached a screen shot of the image container code. I have looked at all the "style" coding and haven't had any luck in getting the main hero image to respond. Any suggestions would be greatly appreciated.

Thank you.

-Ryan

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

1 reply

Grégoire_Miche2
Grégoire_Miche2
Level 10
January 17, 2017

Hi Ryan,

I gather you are looking for a responsive email?

It's quite difficult in the context of this community to just fix you code, as all the <head> is missing and a responsive email need to be designed as a whole, not just one section standalone.

The best way would probably start from one of Marketo email 2.0 starter templates.

-Greg

Ryan_Garcia
Ryan_GarciaAuthor
Level 2
January 17, 2017

Hi Greg,

Thank you for your response. I am using a Marketo email 2.0 starter template. It is the "Basic" template. I'll keep messing around with the code.

Thank you,

-Ryan

Grégoire_Miche2
Grégoire_Miche2
Level 10
January 17, 2017

Hi Ryan,

Honestly, responsive email dev can be very tricky. The basic email template seems to be working fine (I just tested) and you should simply change the image in the variable. What's not working in your case?

AFAIK (and we have some experience: we have developped internally a complete email framework as well as we have been one of the heavy tester of the email 2.0), the background image cannot be made to scale on mobile devices on email. Furthermore, it would probably be a little dangerous to try to make it so, since the width/height ratio of the hero zone will vary depending on the device (be higher on mobile), so you would be better to keep a larger and higher background image.

-Greg

Terms & ConditionsAccessibility statement

Loading footer...