How to rezise the buy now button to as big as the add to cart button.

Isakeve08
New Member
8 0 0

How to struggling to rezise the "buy now button" to as big as the add to cart button. 

Skjermbilde 2024-04-09 223347.png

Replies 7 (7)

ThePrimeWeb
Shopify Partner
2138 614 487

Hey @Isakeve08,

 

Can you share the link to your store please? Thanks!

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
Isakeve08
New Member
8 0 0
Valorique.com
ThePrimeWeb
Shopify Partner
2138 614 487

Hey @Isakeve08,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.shopify-payment-button, 
.shopify-payment-button * {
    height: 100% !important;
}

.shopify-cleanslate {
    height: 0 !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1712762232024.jpeg

 

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
Isakeve08
New Member
8 0 0
On phone it looks fine but paypal on desktop is like this. [image:
image.png]
ThePrimeWeb
Shopify Partner
2138 614 487

*Edited*

 

Hey @Isakeve08,

 

Can you remove the previous code and replace it with this? The instructions are the same as shown above.

<style>
.shopify-payment-button, 
.shopify-payment-button * {
    height: 100% !important;
}

.shopify-cleanslate {
    height: 0 !important;
}

body:has(div[data-testid="PayPalInContext-button"]) button.shopify-payment-button__more-options.BUz42FHpSPncCPJ4Pr_f {
    position: absolute !important;
    height: fit-content !important;
}
body:has(div[data-testid="PayPalInContext-button"]) .shopify-payment-button {
    position: relative !important;
    
}

@media only screen and (max-width: 989px) {
    body:has(div[data-testid="PayPalInContext-button"]) .rbr-page-container {
        margin-top: 40px !important;
    }    
}
</style>
Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

PageFly-Richard
Shopify Partner
4322 980 1639

Hi @Isakeve08 

 

This is Richard from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
.shopify-payment-button__button {
    height: 60px;
}
</style>

PageFlyRichard_0-1712711595719.png

 

Hope this can help you solve the issue 

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Isakeve08
New Member
8 0 0
That didnt change anything.