Should Word Replacement work on button text?

Question

I have a contribution form page that is primarily used by folks who want to sign up for membership, which in many cases does not require payment. I would like the button on the bottom, which currently shows a checkmark and the word "CONTRIBUTE", to say "SUBMIT". I have tried putting that as a Word Replacement, both with all lowercase and all uppercase, but without impact.

In fact, I am not sure Word replacements are working at all. They didn't work on a word I used in the body of a form, as a test, but that's not necessary, I can edit the word itself.

Any ideas? If Word Replacement will never work, can anyone point me to where the 'CONTRIBUTE" button text can be edited directly? Thanks! (Using CiviCRM with WordPress, current versions.)

Answer 1

Yes, Word Replacements does work for this. I replicated your issue as it is case sensitive. The helper text says:

IMPORTANT: Replacements are case-sensitive whether 'Exact Match' is checked or not.

To get it to work you need to enter it as Contribute in Propercase.

I referenced the value of it below as custom CSS styling could differ from the value:

Answer 2

Here is an example of a CSS alternative that I am using. Colors and positioning will vary depending on your theme.

/* Change text color to background color of button to make original text invisible, and set button line height */
.crm-contribution-page-id-3 #_qf_Main_upload-bottom { color: #a3ce1e; line-height: 5px; } 
/* Add new text, format and reposition over original text */
.crm-contribution-page-id-3 #_qf_Main_upload-bottom:after { content: "Join"; text-indent: 0; display: block; color: #ffffff; position: relative; top: -9px; } 
/* Change text color of the check mark back to be visible */
.crm-contribution-page-id-3 .fa-check { color: #ffffff; }
/* Change original text color on hover to also be invisible */
.crm-contribution-page-id-3 #_qf_Main_upload-bottom:hover { color: #7ebb45; }