Setting Up Venmo/Similar payment methods

Hello, I was looking to add a custom payment method to my website, (Instapay, pretty much a regional counterpart to Venmo), and wanted to know if it was possible to set it up so;

as soon as Instapay is selected as a payment method, a QR code & link to payment account are displayed, and then (if user clicks next), a form of section appears where user can attach an image or transaction code for proof of transatction. I would then manually confirm these payments before shipping out the orders.

This is a rough idea of what I’m going for, but obviously needs work to actually accept attachment or proof of transaction, display the QR code, and integrate all of this seamlessly into my UI.

Prefereably, I would also like to have these options appear in order, as to avoid cluttering.

Hello @AdamEROA ,

You can set up a custom payment method like Instapay on Shopify, but since Shopify doesn’t natively support such custom methods, you’ll need to use a manual payment method combined with some custom code and possibly a form for uploading proof of payment. Here’s a high-level approach:

1. Enable Instapay as a Manual Payment Method- Go to: Shopify Admin > Settings > Payments.

  • Scroll to: Manual Payment Methods and click “Add manual payment method.”
  • Create a custom payment method: Name it “Instapay” and include instructions (like “Scan the QR code below and upload proof of payment”).
  • Save the method.

2. Display the QR Code for Instapay

Since you can’t fully customize Shopify’s locked-down checkout (unless you’re on Shopify Plus), you have a couple of options:

  • Option A: Additional Scripts in Checkout (Shopify Plus Only) If you’re on Shopify Plus, you can modify the checkout by adding custom JavaScript in the “Additional Scripts” section to display your QR code when Instapay is selected.

  • Option B: Customize the Order Confirmation/Thank You Page If you’re not on Plus, a workaround is to add a custom section on the Thank You page. For example, add code like this in the Additional Scripts area (or directly in your theme if possible):

Scan the QR Code to Pay with Instapay:

Instapay QR Code

3. Add a Proof of Payment Upload Field

Because Shopify’s checkout is not very flexible:

  • Use an External Form: You could link to a simple upload form (for example, built using Google Forms or a Shopify form app like Hulk Form Builder) in your payment instructions.
  • Embed on the Thank You Page: If possible, embed the form so that after payment, customers can attach an image or enter a transaction code as proof.

4. Process the Order Manually

Since this is a manual payment method:

  • Review Orders: Check your orders in Shopify, review the proof of payment submitted via your form, and manually mark the order as “Paid” and then fulfill it.

5. Clean Up the UI- To avoid clutter, you can use JavaScript or CSS to display the QR code and proof of payment form only when Instapay is selected.

  • This might involve toggling visibility based on user actions (like clicking “Next” after choosing Instapay).

In summary, while you can’t fully automate the entire process natively, you can set up a manual payment method with custom instructions, display a QR code, and collect payment proof via an embedded form. This solution will require some customization, so if you’re not comfortable with coding, you might want to collaborate with a developer experienced in Shopify theme customizations.

Hope this helps get you on track with your Instapay setup!

Best,
Carlos from Kudosi Reviews