|
Chantel Botha
|
January 10, 2013 at 2:41 pm
Hello, Is it possible to add a “Finalize Button” similar to the “Submit” and “Confirm Registration” Buttons to the Payment Page instead of the
“Attention!
If you wish to pay by an Electronic Funds Transfer via your bank, please make note of the information below, then click here to finalize your registration”
I think it would just be much more consistent and have the same feel as the previous pages?
Let me know if there is a way I can configure this myself?
I really do think users might miss that text since it does not even look like a link.
Much appreciated.
|
|
Josh
|
January 10, 2013 at 3:29 pm
Hi Chantel,
This is possible by adding some custom CSS to your custom stylesheet.
the ID for that link for the bank transfer option is a#finalize_bank
Here is some example code derived from the CSS tricks button maker, which you can use to create your own button design:
a#finalize_bank {border-top: 1px solid #96d1f8;
background: #65a9d7;
background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
background: -moz-linear-gradient(top, #3e779d, #65a9d7);
background: -ms-linear-gradient(top, #3e779d, #65a9d7);
background: -o-linear-gradient(top, #3e779d, #65a9d7);
padding: 5px 10px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: white;
font-size: 14px;
font-family: Helvetica, Arial, Sans-Serif;
text-decoration: none;
vertical-align: middle;
}
a#finalize_bank:hover {
border-top-color: #28597a;
background: #28597a;
color: #ccc;
}
a#finalize_bank:active {
border-top-color: #1b435e;
background: #1b435e;
}
|
|
Chantel Botha
|
January 14, 2013 at 12:59 pm
Hello, I apologise for being an idiot, but I have absolutely no idea where to put this code. I went to the style.css file and tried it a couple of places?
Could you please help… I have 5 delegates registered on my new site but I can see that they are not finalising their registration after selecting the payment type – I only allow EFT payments!
Would really appreciate your help!
|
|
Josh
|
January 14, 2013 at 1:25 pm
Hi Chantel,
I’d recommend installing the my custom CSS plugin and copying your custom CSS directly into the editor that it provides.
|
|
Chantel Botha
|
January 14, 2013 at 1:36 pm
Wow! You are great! Last quick one! The button now spans two lines. any way I can put a page break in there to have the button on the next line?
Forever grateful!
|
|
Josh
|
January 14, 2013 at 2:05 pm
If you add display:block; to the style rules, that will make it display on its own line.
Example:
a#finalize_bank {display:block;}
|
|
Chantel Botha
|
January 14, 2013 at 2:15 pm
Great. Worked!
|
