Change Form 2.0 Submit Button Text on Landing Page not in form

Anonymous
Not applicable

Change Form 2.0 Submit Button Text on Landing Page not in form

I know how to change the text on a button using the new forms 2.0 functionality. However, I don't want to have a different form for each text value. I used to be able to use JQuery code on the landing pages to change the text value. With the new Forms 2.0 functionaltiy, the old code no longer works.

Has anyone figured out how to do change the submut button text on an individual landing page with Forms 2.0? I'm hoping it can still be done with JQuery code - and has anyone figured it out? If so, can you please post the code snippet.
Thanks,
Sheila

Tags (1)
4 REPLIES 4
Matt_Stone2
Level 9

Re: Change Form 2.0 Submit Button Text on Landing Page not in form

Hey Sheila,

I figured this out today.. so I thought I'd see if you were still needing help.

In order to do this, you use jQuery and manipulate the form using the directions here: http://developers.marketo.com/documentation/websites/forms-2-0/

So you would alter your embed code to look like this:

<script src="//app-sjqe.marketo.com/js/forms2/js/forms2.js"></script>
<formid="mktoForm_621"></form>
<script>
MktoForms2.loadForm("//app-sjqe.marketo.com", "718-GIV-198", 621, function(form){
   jQuery(document).ready(function($) {
                  $('.mktoButton').text("new text here");
    });  
    //from here we have access to the form object and can call its methods.
}); 
</script>

And voila! You've changed your submit button text.

Please note: You need to change the variables in there to match your form you're embedding. Also, I'm using this setup on a Drupal-based website, so my document ready function has to work around some peculiarities with Drupal -- depending on what you're using, you might not need to use that, or it might work all the same.
Sam_Chou1
Level 2

Re: Change Form 2.0 Submit Button Text on Landing Page not in form

I tried using Matt's code on my Marketo landing page, but it loaded up a 2nd form. I'm assuming it was meant for a non-Marketo page, hence the "loadForm" call. 

For my Marketo landing page, I used a stripped down version inside a custom HTML box:

<script>
  MktoForms2.whenReady(function (form){
jQuery(document).ready(function($) {
                  $('.mktoButton').text("YOUR TEXT HERE");
    });  
  });
</script>
SanfordWhiteman
Level 10 - Community Moderator

Re: Change Form 2.0 Submit Button Text on Landing Page not in form

FYI there's no need for the jQuery(document).ready() wrapper here.  By definition, the form is already ready in the DOM when MktoForms2.whenReady() fires.

Jenn_DiMaria2
Level 10

Re: Change Form 2.0 Submit Button Text on Landing Page not in form

If the form is in your Design Studio, but being pulled into different Programs, you can also use a my.token to change the Submit button on a Program level.