Change submit button text by simple CSS (only for Landing Pages) | Community
Skip to main content
spydream
Level 2
March 20, 2018
Question

Change submit button text by simple CSS (only for Landing Pages)

  • March 20, 2018
  • 1 reply
  • 17479 views

Change your existing form button with your choice of text, here is small css code, paste “Landing Page Action” > Edit Meta Tags,

<style>

button {text-indent: -9999px; line-height: 0;}
button::after { content: "MY NEW BUTTON TEXT"; /* Write you own button name */ text-indent: 0;  display: block; line-height: initial; }

</style>

This is fastest sweet css code, works in all type of landing pages, please write your feedback or questions...

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

1 reply

SanfordWhiteman
Level 10
March 20, 2018

Yep, generated content has been known and used for awhile, see here and elsewhere. Also used to fix this bug.

spydream
spydreamAuthor
Level 2
March 20, 2018

i have seen this​ solution, didn't work...(not replacing existing text), thanks!

SanfordWhiteman
Level 10
March 20, 2018

As it says at the link, you empty your text first! If you absolutely require that the text be replaced, use the simplest JS.

MktoForms2.whenReady(function(form){

  var formEl = form.getFormElem()[0],

  buttonEl = formEl.querySelector("button[type='submit']");

  buttonEl.textContent = "Go for it!"; // or use innerHTML for rich button markup

}); 

Supports HTML, too.

Anyway, you have to change the "Please Wait" text as well in your CSS, if you're throwing the real button text offscreen...