Unable to get Apple Pay to work

[wpmattuk]

Hi there

I'm trying to get Apple Pay to be an option for my customers, without success. The steps I have taken are as follows - 

Within WHMCS: Setup > Payments > Payment Gateways > Manage Existing Gateways > Allow Apple Pay is ticked
Within Stripe: Payments > Apple Pay > Domain entered and file hosted (confirmed correct by Stripe support)

When I create an ad-hoc invoice to myself (a test account/client in WHMCS) and view the invoice and proceed to checkout on either my Mac or iPhone with Safari I never see the prompt to use Apple Pay (it is setup and fully functioning on both devices).

Stripe support can only confirm that my setup with them is correct. I'm not sure else I need to do - despite doing numerous searches, I don't seem to find anything that suggests I need to make changes.

Can anyone help?

[Gagandeep Singh]

Hi Matt, 

I can help you to steup Apple Pay. Let's discuss over what's app at - +<Removed personal information>

 

thanks

Singh

[wpmattuk]

Imagine my delight when I see that someone has replied to my plea for help, only to discover that their reply is their only post to the community and it’s asking me to WhatsApp them, rather than help a community of WHMCS users 😞

I wonder if @brian! knows anything that’ll help?

[brian!]

13 hours ago, thisismatt said:

I wonder if @brian! knows anything that’ll help?

I don't use Apply Pay with WHMCS - have you tried opening a ticket with Support?

two things from the docs...

Quote

Warning: The Stripe gateway module is not compatible with the Modern or Boxes order form templates.

I assume you aren't using either Boxes or Modern as the cart template ?

Quote

An SSL Certificate is required to use Apple Pay

do you have a SSL cert for your WHMCS domain ?

[wpmattuk]

Thank you Brian! I hadn’t seen the point about it not working on those templates.

You are a star, thank you!

[malfunction]

The default dark ApplePay button is a rather overpowering and overshadows the other options in our template; how can we change to use the lighter options?

elements.create('paymentRequestButton', {
  paymentRequest: paymentRequest,
  style: {
    paymentRequestButton: {
      type: 'default' | 'donate' | 'buy', // default: 'default'
      theme: 'dark' | 'light' | 'light-outline', // default: 'dark'
      height: '64px', // default: '40px', the width is always '100%'
    },
  },
});

 

[wpmattuk]

So, despite having changed the order form template, the checkout page continues to not show Apple Pay as an option; just the option to use a saved credit/debit card or enter new details.

@malfunction, thanks for your response too; when I get to the point of actually having Apple Pay appear, I'll have a look at making those tweaks you've suggested. Presumably you do have AP working already, hence the comment, did you have to do anything special to get it working?

[brian!]

5 hours ago, thisismatt said:

So, despite having changed the order form template, the checkout page continues to not show Apple Pay as an option; just the option to use a saved credit/debit card or enter new details.

so you're now using Six & standard_cart ?

i'm slightly handicapped in not having an iPhone, Mac or Safari to test this - so unless another user has an idea, contacting Support is going to be your best bet.

9 hours ago, malfunction said:

The default dark ApplePay button is a rather overpowering and overshadows the other options in our template; how can we change to use the lighter options?

I think the style is defined in /modules/gateways/stripe/stripe.css

#applePayButton {
    display: block;
    background-color: black;
    background-image: -webkit-named-image(apple-pay-logo-white);
    background-size: 100% 100%;
    background-origin: content-box;
    background-repeat: no-repeat;
    width: 100%;
    height: 44px;
    padding: 10px 0;
    border-radius: 10px;
}

so my first thought would be to try to modify it using /templates/six (or custom)/css/custom.css - only if that fails, would I try to modify the style.css file directly (as I suspect any changes you make would be overwritten during a WHMCS update).

[wpmattuk]

8 minutes ago, brian! said:

so you're now using Six & standard_cart ?

I'm now using a customised template (I say customised, it's actually a child of Six), but yes to both.

I suspect you may well be right about contacting support; the suggestion certainly is that it should work 'out of the box' but it isn't for me. Shall get in touch now and update the thread with their response.

[brian!]

18 minutes ago, thisismatt said:

the suggestion certainly is that it should work 'out of the box' but it isn't for me.

I think the implication is that it should work with an unaltered Six/Standard_cart for your release... once you start customising, then it only needs the slightest missing file, corruption etc and features might not appear... and with everything being encrypted, it's difficult to know where to look... this is probably not the sort of error that would show anything in the logs, or on-screen either.

I assume in the product groups, Stripe is enabled as a payment option ?

[wpmattuk]

3 minutes ago, brian! said:

if you ran a clean version of Six/SC, this would still fail?

Just tried, it continues to fail.

 

4 minutes ago, brian! said:

I assume in the product groups, Stripe is enabled as a payment option ?

It sure is, yes.

I've raised to support; they've been fantastic with other queries I've raised to them, so I'm keeping my fingers crossed here!

[malfunction]

8 hours ago, thisismatt said:

 

@malfunction, thanks for your response too; when I get to the point of actually having Apple Pay appear, I'll have a look at making those tweaks you've suggested. Presumably you do have AP working already, hence the comment, did you have to do anything special to get it working?

I'm using a third party cart template and while I was prepared for problems as a result, yes, it worked right out of the box and I was successfully able to make an order and pay from my iPhone.  The only fiddly part was the Apple verification file thing, but everything else was just as expected.

My checkout is very light with soft gray tones and a big fat black ApplePay button right in the middle might lead folks to conclude that was the only thing available, so I'm going to have a play with the CSS (thanks @brian!) and see if I can get a 'White with Outline' look that's in line with Apple's style guide https://developer.apple.com/design/human-interface-guidelines/apple-pay/buttons-and-marks/buttons/   From the Stripe docs 

theme: 'dark' | 'light' | 'light-outline', // default: 'dark'

I had expected a simple theme switch somewhere to cope with different colored checkouts (WHMCS would have thought of that, right?) but I can hack the CSS if I need to.

[wpmattuk]

OK, so it turns out it's something REALLY simple!

The instructions in Stripe tell you to add just the domain (or any subdomain you'll be using) to their Dashboard, as per the attached screenshot. Well, sometimes you also need to add the www prefix too!

All sorted and working now, at last. Thanks everyone for their input.

@malfunction; thanks for the above - I'll have a look and see what to tweak to make it a little more fitting too.

[cmshosting]

@thisismatt ha my name as well, I see you got this issue resolved. I added the www. On stripe and still got the issue can you what apps ... just kidding but it’s been 1.5 years since you ran into this problem and I’m now facing same issue?