Marketo on Wordpress - Form success message

[Anonymous]

Hi, I'm working on a new wordpress site and I'm looking for the best way to handle form fills.

For gated content - how can I force the correct pdf/thank you page to display if I'd like to use a global form rather than using a new form for each asset?

For contact requests, and email newsletter signups, I'd like to use the "stay on page" option with a success message, but that doesn't seem to be working for me as it just refreshes the page and the form (which is usually in the footer or in a sidebar) appears empty, which would definitely make the user believe that the form wasn't successfully filled.

Thanks!

[Grégoire_Miche2]

Hi Nikki,

For both needs, You will need to use a custom form code, leveraging Marketo forms 2.0 API. Are you using an out-of-the-box wordpress module or are you embedding your forms ?

-Greg

[SanfordWhiteman]

For contact requests, and email newsletter signups, I'd like to use the "stay on page" option with a success message, but that doesn't seem to be working for me as it just refreshes the page and the form (which is usually in the footer or in a sidebar) appears empty, which would definitely make the user believe that the form wasn't successfully filled.

This is, by the way, the (perhaps unexpected) definition of Stay on Page in Marketo-land.

Stay on Page means "reload the current page."  It doesn't mean "don't reload this or any other page, just replace content in the current page."

If you search the Community for "same page thank you" you will see various examples of how to accomplish the goal of replacing content.

[Jay_Jiang]

Gated content - you could manually link the pdf after submission using stay on page below or you could pass some variable on from the CTA link (see Multiple CTA's but only one form ​

Stay on page - general gist is:

        <script src="//###-####.marketo.com/js/forms2/js/forms2.min.js"></script>
        <form id="mktoForm_#"></form>
        <script>
            MktoForms2.loadForm("//###-####.marketo.com", "###-###-###", formid, function (form){
                form.onSuccess(function(values, followUpUrl) {
                    document.getElementById("mktoForm_#").innerHTML ="<p>Thank you for submitting the form.</p>";
                    return false;
                });
            });
        </script>

[SanfordWhiteman]

Hey Jay -- careful with getElementByById() here because when the same Marketo form is used twice (like in header/footer/popup/etc.) the first one in the DOM will get updated even if that's not the one they used.

Safer to target the current <form> element with getFormElem():

MktoForms2.loadForm("//###-####.marketo.com", "###-###-###", formid, function (form){  
  form.onSuccess(function(values, followUpUrl) {  
    var formEl = form.getFormElem()[0];
    formEl.innerHTML ="<p>Thank you for submitting the form.</p>";  
    return false;  
  });  
});