How to add 'Add to Wallet' button to website to add coupons to Apple Wallet and Google Pay accounts

There's two different processes for both pass types:

Apple Wallet

Creating an Apple Wallet pass is described here: Apple Docs. You edit the pass.json describing your pass, then you can sign it using Apple's signpass tool after you have registered a pass type identifier and found your Team ID.

If you want to update the pass to display the information to customers, you would need a server that implements the web service API.

The "Add to Apple Wallet" button would be a image with a link to the .pkpass file you've generated for your customer. There are a few open source tools to create passes on the fly with your language of choice (e.g here).

Google Pay

Here is the docs for creating Google Pay passes. There's an initial bit of signing up to do, then you need to register credentials but after that initial pain, you can create passes and there are a few quick start applications to do so.

Once your pass (in Google terms it's Objects and Classes) is created, how you link the pass is different than Apple and requires embedding a snippet with a signed JWT for the "Save to Google Pay" button to appear, described better here.

If you want to update the pass to display the information to customers, you can interact with a REST API. Here are it's reference docs.

It looks like there are plenty of third party services

As you can see, it's quite the pain to do all this so it makes sense for companies to try to improve the developer experience. At PassNinja we're focusing on making a unified API to make this a lot easier, especially for NFC enabled passes.