Getting Started
Stripe via Credit CardThe Stripe Payment Gateway plugin for WooCommerce allows you to adjust the appearance of your Apple Pay button.
This article shows you how to change the size and color of your Apple Pay button that appears on your WooCommerce cart, cash register, and product pages.
Here’s how to get started.
First, add all styling attributes to the following tags on the cart page and checkout page.
You need to insert the entire code into the themeĀ style.css
Customizing the size of the Apple Pay button
Following is a screenshot of the default Apple Pay button on the cart page.
Letās say we want to reduce the width of the button to 50%. Add the following CSS code to your themeās style.css file, under the tag for the cart page (shown in the earlier section of this article).
Likewise, to customize the Apple Pay button at the checkout, upload the identical code below the checkout page’s tag of the same file.
Following is a screenshot of the default Apple Pay button at the checkout page.
The customized Apple Pay button on theĀ checkout page will be as shown in the screenshot below.
![Customizing the size of the Apple Pay button [Image3]](https://www.themehigh.com/docs/wp-content/uploads/2025/08/Screenshot-2025-08-04-at-1.35.10-PM.png)
Inverting Apple Pay button color and adding border
You can invert color and border color of the Apple Pay button. To do this, add the following code to your themeāsĀ style.cssĀ file, under the cart pageās tag.
In the same way, to customize color on the Checkout page, add the same code under the Checkout pageās tag of the same file.
Following is a screenshot of the customized Apple Pay button on the checkout page.
To know more about the product, check outĀ theĀ Stripe Payment Gateway Plugin for WooCommerce.