Solved

Hide dynamic checkout button on desktop only

JhordanMSUITE
Shopify Partner
125 1 40

Hello, can someone help me hide the "Shop Pay" dynamic checkout button on desktop? I would like to keep this button active on other devices.

 

Screenshot 2024-01-08 at 9.59.01 PM.png

 

https://2d26b3.myshopify.com/products/sample-product

PW: reishi

Accepted Solution (1)

Dan-From-Ryviu
Shopify Partner
7027 1329 1354

This is an accepted solution.

Go to your Online store > Themes > Edit code > open base.css file, add this code below at the very bottom, and save file 

@media (min-width: 990px) {
.shopify-payment-button { display: none !important; }
}

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 2 (2)

Dan-From-Ryviu
Shopify Partner
7027 1329 1354

This is an accepted solution.

Go to your Online store > Themes > Edit code > open base.css file, add this code below at the very bottom, and save file 

@media (min-width: 990px) {
.shopify-payment-button { display: none !important; }
}

- Helpful? Like or Accept solution, - Coffee Tips or Paypal Tips
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 1 month of Shopify for $1. Sign up now

PageFly-Richard
Shopify Partner
4079 913 1567

Hi @JhordanMSUITE 


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--branded{
	display: block;
}

@media (min-width: 1024px) {
.shopify-payment-button__button--branded{
	display: none;
}
}
</style>

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.