Creating a token for changing a form ID on a Landing page

[Anonymous]

Hello Community,

I've been trying to find a document here in the community that has come confronted the embedded vs. guided forms options. To speed things up it would be really cool if I could just ad a token to swap out a form ID on a landing page through the campaign program. Is there a way to do this anyone?

Thanks for your brilliance!

[SanfordWhiteman]

"Embedded vs. guided" isn't really a meaningful distinction -- guessing you mean embedded vs. named mktoForm/free-form canvas elements.

If you truly mean a token (not a GLP variable) then sure, you can load an embedded form by using a {{my.formid}} text token in the page's markup and JS.

[Anonymous]

Hello Sanford, is it that simple. Trying it now!

[Anonymous]

What's terrible about this method is the end-user has to create multiple clones of the template. To me that makes no sense. So I was thinking that a token is the best approach. Just looking for the proper JS to run a token instead.

[Anonymous]

Man, what's missing is the JS. I see nested scripts but no JS. This is how it was coded:

<div class="hero-form-wrap">

                        <h5 class="mktoText" id="heroFormTitle" mktoname="Hero Form Title">Schedule a Live Custom Demonstration</h5>

                        <form id="mktoForm_1111" class="mktoForm form-light marketo-embed-form" mktoName="Page Form">

                        <script>

                            MktoForms2.loadForm("https://app-sj19.marketo.com", "009-WSR-714", 1111);

                        </script>   

                        </form>

                        <div class="mktoText" id="heroFormFooter" mktoname="Hero Form Footer">

                            <span>* All fields are required.</span>

                        </div>

                    </div>

[SanfordWhiteman]

This is JS:

MktoForms2.loadForm("//app-sj19.marketo.com", "009-WSR-714", 1111);​

I was saying you can tokenize this as:

MktoForms2.loadForm("//app-sj19.marketo.com", "009-WSR-714", {{my.formid}});​

But there's a confusion in your code because you have a named form element ("Page Form") and you also have a call to loadForm. You don't need both of these, in fact you must not use both of these on the same page (one the named element, the other the embed code).

[Anonymous]

Ya, that was commented out before. I tried but still no glory. I'll assume when I create the token I'm just adding form id of 1111 and nothing else. Thats at least what I'm used to. When I go into the page I can select a form, which I'm assuming should not occur. Even though I select a form it still doesn't appear. So strange.

<div class="hero-form-wrap">

                        <h5 class="mktoText" id="heroFormTitle" mktoname="Hero Form Title">Schedule a Live Custom Demonstration</h5>

                        <script src="//app-sjqe.marketo.com/js/forms2/js/forms2.js"></script>

                              <form id="mktoForm" class="mktoForm form-light" mktoName="Page Form">

                                  <script>

                                        MktoForms2.loadForm("//app-sj19.marketo.com", "009-WSR-714", {{my.formid}});

                                   </script>

                              </form>                      

                        <div class="mktoText" id="heroFormFooter" mktoname="Hero Form Footer">

                            <span>* All fields are required.</span>

                        </div>

</div>

[SanfordWhiteman]

Close the <form>, open the <script>.  As long as you have class="mktoForm" you have a named form element. You don't want that.

<form id="mktoForm_{{my.formid}}" class="form-light"></form>
<script>
  MktoForms2.loadForm("//app-sj19.marketo.com", "009-WSR-714", {{my.formid}}); 
</script>

[Anonymous]

UDman! That worked perfectly. Thanks so much. I've been reading a ton of your responses and I have to say your knowledge is impressive. Thanks so much!

[SanfordWhiteman]

Cool, glad it worked! Forms are kinda my thing, yep.