Return to previous page

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 4 years, 3 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.
    #275960 Copied Theme version: 7.2.3 WooCommerce version: 5.6.1
    6 Answers
    Avatar: Muhammad Zaki
    Muhammad Zaki
    Participant
    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!

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

    how to get the entrance to customize the code?

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

    could u pls show me the path?thx!

    #277288 Copied
    Avatar: Olga Barlow
    Olga Barlow
    Participant
    March 2, 2021 at 15:46

    Hello,

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

    Regards

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

    thanks for ur help

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

    Hello,

    You’re welcome!

    Regards

    #277476 Copied
  • Viewing 7 results - 1 through 7 (of 7 total)

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

Recent Community Activity

Helpful Topics

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder
Organic Cosmetics Store – WordPress WooCommerce Theme
lazy-placeholder
Electronics Store – WordPress WooCommerce Theme
lazy-placeholder
Hemp & CDB – WordPress WooCommerce Theme
lazy-placeholder
Phone Service – WordPress WooCommerce Theme
lazy-placeholder
Sushi Store – WordPress WooCommerce Theme
lazy-placeholder
Plants Store – WordPress WooCommerce Theme
lazy-placeholder
Meeting – WordPress Theme
lazy-placeholder
Flowers Store – WooCommerce Theme
lazy-placeholder
Onepage Store – WooCommerce Theme
lazy-placeholder
Medical – WordPress WooCommerce Theme

See All Templates

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