How do I make background images editable on landing page? | Community
Skip to main content
New Participant
August 20, 2021
Solved

How do I make background images editable on landing page?

  • August 20, 2021
  • 1 reply
  • 4478 views

Hi Community,

 

I was attempting to enable editability on two background images on a custom-built landing page template.

 

I changed the code for these images from the following:

 

 

<meta class="mktoString" id="sec1_bg_image" mktoName="Section-1 BG Image" default="http://promos.ovstravel.com/rs/512-JJP-615/images/AdobeStock_213835443_Preview.jpeg"> <meta class="mktoString" id="sec3_bg_image" mktoName="Section-3 BG Image" default="http://promos.ovstravel.com/rs/512-JJP-615/images/AdobeStock_154151287_Preview.jpeg">

 

 

To the below: (changed meta class to mktoImg and added mtkoModuleScope="true")

 

 

<meta class="mktoImg" id="sec1_bg_image" mktoName="Section-1 BG Image" default="http://promos.ovstravel.com/rs/512-JJP-615/images/AdobeStock_213835443_Preview.jpeg" mktoModuleScope="true"> <meta class="mktoImg" id="sec3_bg_image" mktoName="Section-3 BG Image" default="http://promos.ovstravel.com/rs/512-JJP-615/images/AdobeStock_154151287_Preview.jpeg" mktoModuleScope="true">

 

 

Below is how the images appear without adding the ModuleScope and changing the meta classes to mktoImg:

 

 

 

This is how the landing page appears when adding the modulescope and changing the meta classes.

 

The Section-3-BG block appears but in the wrong place and the Section-1-BG block doesn't show at all.

 

 

When I add images to the landing page and preview the page, both images appear at the top instead of in the places they would ordinarily appear.

 

 

Any idea what I'm doing wrong?

 

There is some external styling for this page, but I'm not sure if that would affect the appearance since I haven't changed anything but updating the code to be able to edit the images.

 

Link to LP:

 

http://promos.ovstravel.com/SMS-Multi-Branded-General-Acquisition_SMS-Test-Landing-Page-2.html

 

Thank you,

 

LK

 

 

 

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 SanfordWhiteman

Hi,

 

MktoImg is also not supported by Landing Pages, if we will use mktoImg then it will work as a simple image not background image.

 

Let me know in case of any concerns.

 

Thanks!

Jasbir

 



mktoImg is also not supported by Landing Pages, if we will use mktoImg then it will work as a simple image not background image.

That's simply not true. It only requires out-of-the-box thinking.

Using a mktoImg LP element as a CSS background-image

1 reply

New Participant
August 23, 2021

Hi @guitarrista82 

 

In the Landing Pages, mtkoModuleScope do not work, so please avoid using mtkoModuleScope in the LPs, it works in the emails only.

 

Use code like the below - 

<meta class="mktoString" id="Header_BG_Image" mktoName="Banner-1 Desktop Background Image" default="http://via.placeholder.com/1900x651">

 

And, after that the Image URL will show in the Variables not in the Elements.

 

 

Let me know in case of any concerns,

 

Thanks & Regards,

Jasbir

SanfordWhiteman
New Participant
August 23, 2021

@jasbirka as you can see in the original post, the goal is to use browseable mktoImg elements. Not mktoString.

New Participant
August 23, 2021

Hi,

 

MktoImg is also not supported by Landing Pages, if we will use mktoImg then it will work as a simple image not background image.

 

Let me know in case of any concerns.

 

Thanks!

Jasbir