Skip to main content
Jean-Pascal_Mer
Jean-Pascal_Mer
Level 4
Aug 23, 2016 2:00 PM UTC
Solved

Adding a Form # as a Variable

Hey guys,

We're trying to work on a template that's "almost" blank. Our goal is to get the Form into an editable block that has a width of 100%.

Since we can't "Nest" a MKTO element in a Guided Landing Page template, I'm thinking about adding the form # as a variable.

I would have something like this:

<div class="mktoText" id="exampleText" mktoName="Main Body Text">

Optionally add default text for the editable text area.

<Insert Form with variable here>

</div>

Anyone ever did something similar and can share how he made it happen?

Thanks,

JP

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Jim_Thao7
Jim_Thao7Accepted solution
Level 8
Aug 23, 2016 5:24 PM UTC

I'm trying to think about the need. 

How about not nesting Marketo Element Divs and just nesting Marketo Element Divs into a regular div that carries a 100% width?  The reason being is that each div is mutually exclusive anyways.  Even if you had Marketo Elements Divs that are nested, a form div is still a form div and a text div is still a text div.  

<div style="width:100%">

<div class="mktoText" id="exampleText1" mktoName="exampleText1"></div>

<div class="mktoForm" id="formPlaceholder" mktoName="formPlaceholder"></div>

<div class="mktoText" id="exampleText2" mktoName="exampleText2"></div>

</div>

View in thread

6 replies

Josh_Hill13
Josh_Hill13
Level 10
Aug 23, 2016 4:00 PM UTC

@Sanford Whiteman​

Translate
Jim_Thao7
Jim_Thao7Accepted solution
Level 8
Aug 23, 2016 5:24 PM UTC

I'm trying to think about the need. 

How about not nesting Marketo Element Divs and just nesting Marketo Element Divs into a regular div that carries a 100% width?  The reason being is that each div is mutually exclusive anyways.  Even if you had Marketo Elements Divs that are nested, a form div is still a form div and a text div is still a text div.  

<div style="width:100%">

<div class="mktoText" id="exampleText1" mktoName="exampleText1"></div>

<div class="mktoForm" id="formPlaceholder" mktoName="formPlaceholder"></div>

<div class="mktoText" id="exampleText2" mktoName="exampleText2"></div>

</div>

Translate
Jean-Pascal_Mer
Jean-Pascal_MerAuthor
Level 4
Aug 23, 2016 7:48 PM UTC

Because three heads in a meeting room couldn't think about the obvious answer.

Meeting rooms are damned.

Thanks Jim, that might actually do the trick.

Translate
SanfordWhiteman
User Group Leader
SanfordWhitemanUser Group Leader
User Group Leader
Aug 23, 2016 5:52 PM UTC

You don't want to use raw form IDs if you can avoid it, because Marketo knowing that something is a Form Element is crucial for presenting a friendly dropdown of forms and for automatic PreFill (although you can do the latter via tokens as well).

Like Jim, I'm curious about why you can't restructure your markup so they don't need to actually nest.

Translate
    Jean-Pascal_Mer
    Jean-Pascal_MerAuthor
    Level 4
    Aug 23, 2016 7:49 PM UTC

    Yea, Jim is right.

    But as to Forms, wouldn't the embed code take care of showing the form the right way + prefill?

    Translate
    SanfordWhiteman
    User Group Leader
    SanfordWhitemanUser Group Leader
    User Group Leader
    Aug 24, 2016 8:29 AM UTC

    But as to Forms, wouldn't the embed code take care of showing the form the right way + prefill?

    No. If you use the embed code on an LP instead of a Form Element, you have to simulate prefill with tokens. It's not at all difficult, but the JS is seen as any old "foreign JavaScript" in this case, so you have to build more yourself.

    Incidentally, you can move a ​mktoForm Form Element anywhere you want in the page, including nesting it inside a ​mktoText.  By hiding it from view until you've moved it into place (so the user doesn't see it quickly jump) you can put it anywhere you want.  But best avoided unless necessary.

    Translate
    Terms & ConditionsAccessibility statement

    Loading footer...