Need help! Can I set up a mktoImg Synax for inline style on landing page template? | Community
Skip to main content
K
Kense1
Level 1
April 3, 2020
Question

Need help! Can I set up a mktoImg Synax for inline style on landing page template?

  • April 3, 2020
  • 2 replies
  • 2751 views

My goal is to have a mktoImg synax in the inline style. When I do it anyother way the background image doesn't properly scale with the div.

 

See example code.

<div class="layers-background">

<div class="image" style="background-image:url(**MKTOIMG**);background-position: 60% !important;"></div>

</div>


Live Page:

(note: background hero image is static, not responsive to the div)

try.zadara.com/April2020-Veeam-BaaS.html

 

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

2 replies

SanfordWhiteman
SanfordWhiteman
Level 10
April 3, 2020

This will behave exactly the same way if you had it in a CSS <style>, it doesn't need to be in an inline style attribute. 

 

Inline style attrs are only necessary in emails, not on LPs.

 

But you do bring up a shortcoming of the mktoImg syntax, in that you can't have an image browser that directly populates an attribute like background-image.  To make this work, you have to create a mktoImg element that's hidden (display:none;), and then copy its value to populate the background-image of another element.

 

You can read about the technique here: https://blog.teknkl.com/using-a-mktoimg-element-as-a-css-background-image/

    Dave_Roberts
    Dave_Roberts
    Level 10
    April 5, 2020

    This is really a really clever way to extend the native functionality for images in Marketo, and I love that you can set it to one or many elements in the document - that's a rich feature 👍

     

    So aside from the one-to-many relationship this could create, is there any reason to do this rather than using a string variable to set the background-image property on the parent element instead of using an <img> element? I get that you can explore for your image in the dialog that pops up, but if you already know the name of your image, you can find it all the same in the Design Studio Image/Files folder and grab the URL from there all the same. Why would you want to do something like this in this first place instead of using the native functionality, can you help me understand the use-case this solves for?

     

    SanfordWhiteman
    SanfordWhiteman
    Level 10
    April 5, 2020

    It's to use the image browser instead of  having to paste a string from somewhere else.

     

    I don't agree with the "if you know the name" argument, if Marketo removed the image browser you'd hear plenty of opposition.

    SanfordWhiteman
    SanfordWhiteman
    Level 10
    April 3, 2020

    Also please highlight code (in this case as XML/HTML) when you post it, it's very hard to read otherwise.

     

    Terms & ConditionsAccessibility statement

    Loading footer...