How to change the checkout layout of checkout page for google pay and apple pay

This topic has 7 replies, 4 voices, and was last updated 3 years, 4 months ago ago by Rose Tyler

  • Avatar: Xie_Roy
    Xie Roy
    Participant
    February 23, 2021 at 12:55

    adjust the layout of the checkout page as per google pay’s requirement

    Please, contact administrator
    for this information.
    6 Answers
    Avatar: Muhammad Zaki
    Muhammad Zaki
    Support staff
    February 23, 2021 at 20:24

    Hello!

    Please use the below CSS code for the button alignment and styling. You just have to add it to the custom css section of theme options

    button#ckocom_googlePay {
        background-color: #c62828 !important;
        color: #fff !important;
        padding-top: .95rem !important;
        padding-bottom: .95rem !important;
        border-radius: 30px;
        width: 100%;
        height: 42px;
    }

    Please use below css code for the google pay checkbox.

    li.wc_payment_method.payment_method_wc_checkout_com_google_pay {
        padding-top: 10px;
    }

    Please let me know if you see any issues.

    Thank you!

    Avatar: Xie_Roy
    Xie Roy
    Participant
    March 2, 2021 at 10:39

    how to get the entrance to customize the code?

    Avatar: Xie_Roy
    Xie Roy
    Participant
    March 2, 2021 at 11:17

    could u pls show me the path?thx!

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    March 2, 2021 at 15:46

    Hello,

    Are you looking area to add the mentioned custom? Go to Theme Options > Custom CSS.

    Regards

    Avatar: Xie_Roy
    Xie Roy
    Participant
    March 3, 2021 at 09:17

    thanks for ur help

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 3, 2021 at 09:23

    Hello,

    You’re welcome!

    Regards

  • Viewing 7 results - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.