SOLVED

How can I isolate or embed a form without having code collisions?

Go to solution
Anonymous
Not applicable

How can I isolate or embed a form without having code collisions?

We have embedded a form in our WordPress web site using the following code:

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

<form id="mktoForm_xxxx"></form>

<script>MktoForms2.loadForm("//app-sjxx.marketo.com", "xxx-xxx-xxx", xxxx);</script>

Once embedded, the form works okay; however WordPress will no longer allow us to edit its parent object.  It seems there's a code collision happening - perhaps a variable used by Marketo is the same name and scope as in WordPress.

Is there a way I can wrap the code above with JavaScript to isolate the code imported by the script reference?  Is there a WordPress plugin for this perhaps?  Thanks in advance for the help.

Tags (1)
1 ACCEPTED SOLUTION

Accepted Solutions
Anonymous
Not applicable

Re: How can I isolate or embed a form without having code collisions?

We changed the embed to using an iframe that references a plain landing page instead.  The plain landing page contains the form that was previously embedded using the script.

<iframe src="http://go.xxxxx.com/Contact-Embed.html"></iframe>

This solved the issue for us.

View solution in original post

3 REPLIES 3
SanfordWhiteman
Level 10 - Community Moderator

Re: How can I isolate or embed a form without having code collisions?

Please share an example URL and what you mean by "edit" its parent element.

The MktoForms2 object is of course global but everything else is pretty well encapsulated.

Anonymous
Not applicable

Re: How can I isolate or embed a form without having code collisions?

We changed the embed to using an iframe that references a plain landing page instead.  The plain landing page contains the form that was previously embedded using the script.

<iframe src="http://go.xxxxx.com/Contact-Embed.html"></iframe>

This solved the issue for us.

SanfordWhiteman
Level 10 - Community Moderator

Re: How can I isolate or embed a form without having code collisions?

Hmm okay, but a major change to the architecture that shouldn't have been necessary. I'd still like to see an example of the former behavior.