SOLVED

Modify Button Text using Javascript

Go to solution
Highlighted
Anonymous
Not applicable

Modify Button Text using Javascript

Hello,

I'm leveraging an embedded global form on many external pages, and I'd like to be able to modify the button text depending on the page. In order to do this I was hoping I could add custom javascript to the embed code - is this possible? I wasn't able to find anything that got me there.

Thanks in advance!

Tags (1)
1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Level 10 - Community Moderator

Re: Modify Button Text using Javascript

You don't even need JS, just CSS. Set the button text to empty by default.

Then:

.mktoForm button[type="submit"]:after {

    content: "Go Get 'Em";

}

View solution in original post

7 REPLIES 7
Highlighted
Level 10 - Community Moderator

Re: Modify Button Text using Javascript

You don't even need JS, just CSS. Set the button text to empty by default.

Then:

.mktoForm button[type="submit"]:after {

    content: "Go Get 'Em";

}

View solution in original post

Highlighted
Anonymous
Not applicable

Re: Modify Button Text using Javascript

Thanks, Sanford Whiteman - super helpful. I set the button text to empty in the form editor, but it seems to be defaulting to "Submit" anyway, so now I'm seeing my new text after"Submit." Any other tips on how to clear that out?

Highlighted
Level 10 - Community Moderator

Re: Modify Button Text using Javascript

You actually want a space rather than blank, IIRC.

Highlighted
Anonymous
Not applicable

Re: Modify Button Text using Javascript

Ahhh, that did it - thanks again!

Highlighted
Anonymous
Not applicable

Re: Modify Button Text using Javascript

Sanford Whiteman​ At form submit I'm seeing the custom text I added smashed against the 'Waiting Label' text. See screenshot:

Screen Shot 2017-09-28 at 11.26.12 AM.png

Is there additional code I could add to address this? For right now I've just cleared out the "Please Wait" text with a space - so there's no 'Waiting Label' text at all now. Not the end of the world, but if there's a way to replicate the desired functionality without smashing the two phrases together that would be awesome.

Highlighted
Level 10 - Community Moderator

Re: Modify Button Text using Javascript

.mktoForm button[type="submit"][disabled]:after { 

    content: ""; 

}

Highlighted
Anonymous
Not applicable

Re: Modify Button Text using Javascript

Perfect. For others, you place your 'Waiting Label' text ("Please Wait" or something) between the quotation marks in the above CSS, keep the value blank in Marketo (with a space), and you will also still need to use the previously mentioned CSS to populate the pre-submit button text.

Thanks, Sanford!