|
BG
|
September 10, 2015 at 1:17 pm
Hello I am looking to restyle the checkout page on our event espresso website, but I don’t know where to start/look to change the code.
View a picture with instructions on how I want the page to display – http://theukweddingevent.co.uk/wp-content/uploads/2015/09/checkouttwo.jpg
The link below shows how it currently looks:
http://theukweddingevent.co.uk/registration-checkout/
If anyone could offer some guidance on how to achieve the finish I am after, I would be most grateful.
|
|
Josh
|
September 11, 2015 at 9:57 am
Hi BG,
I can give you some general guidance on how to style the elements with CSS. You can hide the steps section with:
#spco-steps-display-dv,
#spco-steps-big-hdr {
display: none;
}
You can re-style the promo code input field with something like this:
#ee-spco-payment_options-reg-step-form-payment-options-before-payment-options .ee-promo-combo-submit {
background-color: #fff !important;
color: #EA5B74 !important;
padding-left: 20px;
padding-right: 20px;
margin-top: 45px;
margin-right: 18px;
}
#ee-promotion-code-input-lbl h4{
display: none;
}
#ee-spco-payment_options-reg-step-form-payment-options-before-payment-options .ee-promo-combo-input {
float: right;
position: relative;
}
In order to display the PayPal button, you’ll need to remove its div (shown below in bold) from your styles where you’re setting it to display none:
#ee-single-page-checkout-dv .spco-steps-big-hdr, #ee-single-page-checkout-dv #spco-steps-display-dv, #spco-available-methods-of-payment-dv #method-of-payment-hdr, #spco-available-methods-of-payment-dv #ee-available-payment-method-inputs {
display: none !important;
}
|
