Quick pay won't load on product page

Store Design
1

When you click on a product page, on desktop or mobile, the apple pay / google pay / shop pay quick buy button won’t load under the add to cart button, unless I refresh the product page or click on and off a variant. I think it’s being triggered by a secondary action on the product page. It’s annoying as it misleads customers into thinking you can’t use apple pay and so on! Was wondering if anyone could help?

2

Hi @forrestlake ,

I hope you are doing well!

Can you please share the store URL so I can generate the issue? I’ll also need the collaborative code to fix it for you.

3
4

Hi @forrestlake ,
I’ve checked your issue and can confirm this is not a bug but rather related to your theme settings. The Quick Buy button will not display until a variant is selected. However, I also noticed a small issue with your Quick Buy button where it only becomes active after changing variants twice.

You can contact your theme developer to fix both issues. Alternatively, if you’d like a quick workaround, I can provide a small CSS tweak to make the Quick Buy button visible even before a variant is selected. Please let me know if you’d like me to implement that option

5

Heya, thank you, would you be able to provide

the small css tweak please?

6

you can fix it by following these two simple steps:

Step 1: Click on Customize (see screenshot)
Step 2: Add the following CSS code:

.variant-selection[variant=not-selected] ~ .product-form__cart-buttons .shopify-payment-button, .variant-selection[variant=not-selected] ~ .product-form__cart-buttons .surface-pick-up {
    display: block !important;
}

to the Custom CSS section (see screenshot), then save and check the result.

Let me know if this works for you or if you need further assistance!

Best,
Felix

7

Heya, thank you! It works on product pages with no variants, however the button still isn’t loading on product pages with variants.

8

I just checked one of your products with variants and can see that the CSS is working. Could you please double-check on your side and confirm if it’s now working for you as well?

9

Heya, thanks for your response! It’s not working for me. So the “buy with apple pay” button appears but you can’t click on it, it’s grey - unless you refresh the product page or click on a different variant. To clarify on product pages in which there are no variants, the “buy with apple pay” button does appear straightaway and is clickable. However, for some reason products with variants the button still can’t be click straightaway.

10

Hi @forrestlake ,

Sorry for the inconvenience! As I mentioned earlier, from my side, I can only provide a small CSS snippet to help display the Apple Pay button and let users know that your store supports Apple Pay.

However, for the issue you’re facing with the button not being clickable right away on product pages with variants, I recommend reaching out to your theme developer. It seems like a theme-related issue that they would be able to troubleshoot more effectively.

Let me know if you need any help with the CSS snippet or anything else!

Best,
Felix