How can I change our email sign up from old vendor to Marketo?

[Jen_Heidenreich]

We have a email sign up that is on a template level of our site. It is already branded. We are switching to Marketo for sending the emails, and so we want the sign up to continue to look as it does, but send to a Marketo form. I understand how to place a form designed in Marketo onto a web page, but it will not match the current formatting. Here is the current sign up:

Is there a way to code the button to send to a Marketo list?

Thank you for all you do,

jen

[SanfordWhiteman]

Yes, if this is a generic HTML form, you can capture the standard submit event and redirect the form data (just one form field in this case) to a hidden Marketo form, then submit the hidden form.

Search the Community for "background form," "hidden form" et al. to see numerous examples of the technique.

If you provide an actual URL, I can check how hard this transition will be for this form (remember, we can't troubleshoot a screenshot).

P.S. I'm not convinced you can't use a Marketo form for this one-line form, but I understand if you don't want to do any restyling.

[Jen_Heidenreich]

Thank you so much. I found the article on hidden forms...does the code need the script code from embed code?

<script src="//app-sjo.marketo.com/js/forms2/js/forms2.min.js"></script>
<form id="mktoForm_xxxx" style=”display:none”></form>
<script>MktoForms2.loadForm("//app-sjo.marketo.com", "452-ZON-215", xxxx);</script>
var myForm = MktoForms2.allForms()[0];
myForm.addHiddenFields({
                //These are the values which will be submitted to Marketo
                "Email":"test@example.com",
                });
myForm.submit();

[SanfordWhiteman]

You need more than that (and you don't want to just add that code as it will automatically submit the form on page load).

What's your URL?

And can you please highlight the code in your post as JavaScript using the Advanced Editor's syntax highlighter?

[Jen_Heidenreich]

NM.org. - The current form is on every page, near the bottom.

Sorry, I will edit it.

thank you for all you do,

jen

[SanfordWhiteman]

OK, this is an example of a form that, while very simple, is not a plain HTML form. It uses another JS form library under the hood to capture/reroute the submit event, and you'll have to tweak that library to reroute the submit to the hidden Marketo form.

The way it works now is the submit button click is captured and turned into an Ajax request to Silverpop.  Instead of going to Silverpop you want to transfer the values of the email, website, and source fields on the visible form to the Marketo form using Marketo's form.addHiddenfields() method. Note the Marketo field names are capitalized differently, as Email, Website, and LeadSource, so you have to use the Marketo names when calling addHiddenFields.

Then run the Marketo form.submit().

It's actually incredibly simple. It just can't be done on top of the current JS, it needs to replace the current JS handling.

(You can/should continue to use the ASP.NET MVC form validation, which checks that the field is a well-formed email address... it's only the Ajax submit part that needs to be changed. Your developer will understand what I mean.)

[Jen_Heidenreich]

This is perfect. Thank you so much for taking the time to help me with this. I also appreciate the comment about it being simple...hopefully our agency won't try to say this change is out of scope

Thank you for all you do,

Jen