FROM CACHE - en_header

Redeeming 3rd Party Physical Gift Cards

JAS_Technology
Shopify Expert
80 0 47

Hi all,

Here is a good one. ValuTec is a 3rd party gift card provider. They simply generate 19 digit numbers, put them on a card, and manage the balance as these cards are redeemed. Would there be ANY WAY to integrate with Shopify in a way that these gift cards can be used to purchase products during a Shopify checkout. The best case scenario would be to create a custom payment method (like PayPal, BitCoin) which creates a payment service that can people can use to pay for orders with their gift card numbers. 

I thought about potentially using the GiftCard API to match ValuTec numbers with Shopify gift card numbers but then that creates problems as well. For example, once an order completes, how would ValuTec know to reduce the value on that specific card?

The fun things that come across our plates.... Any ideas?? 

Happy to hear about your crazy ideas.
Replies 31 (31)
Jordan
Shopify Staff
Shopify Staff
300 3 75

Hey Jonathan,

Yeah, that is a tricky one. At the top of my head, I would think that using the Hosted Payment SDK would be the best available solution, however, that would really only work if the customer were to pay for the checkout in full using the gift card as it wouldn't function effectively with partial payments. 

Using the GiftCard API would be more difficult and there would be various limitations. For example, currently there's no way to update the balance of an existing gift card via our API. This would cause various discrepancies if you were to use part of the gift card balance outside of Shopify. 

Those are my immediate thoughts. Though, if you or any other developers in this forum can think of other methods around these limitations, feel free to add them to this thread. I'd be very interested in hearing them!

 

- Jordan

 

Jordan | Developer Support @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

JAS_Technology
Shopify Expert
80 0 47

Hey Jordan,

Thanks so much for your thoughts. Here is the direction we are headed:

  • Customer will put products into cart and navigate to cart page
  • On cart page there will be a "redeem gift card" input
  • Customer puts in their 3rd party gift card number
  • We make ajax call to our code to verify/redeem the amount on the card based on the value in the cart.
  • Upon success we update the cart with information on this card and temporarily add a new item to the cart
  • Adding this temp item will trigger the execution of Shopify Scripts
  • The Shopify script will inspect line item attributes we've added and reduce line items by the redeemed value

This sounds a bit crazy but I really think it will work. A couple things I'm still investigating:

  • Shipping costs are applied during checkout so the customer still might have to pay for shipping.
  • Might watch for new order webhook to be the trigger to actually pull the value off the card. This will prevent customer service issues with redeemed cards and abandoned checkouts.

Do I get the mad scientist award??? 

Happy to hear about your crazy ideas.
leysian
Shopify Partner
4 0 0

Hello, we're looking to implement a solution for 3rd party gift cards as well.  Did you or anyone have success with this?

JAS_Technology
Shopify Expert
80 0 47

We went a bit a different route than above however it's working very smoothly now actually. What gift card provider are you using?

Happy to hear about your crazy ideas.
leysian
Shopify Partner
4 0 0

Great to hear!  We are using NCR Stored Value and have access to the API.  Could you share which route you ended up taking?  Jordan's Hosted Payment SDK approach seems to make sense too (https://help.shopify.com/api/sdks/hosted-payment-sdk/checkout-process).

Thanks!

JAS_Technology
Shopify Expert
80 0 47

The Hosted Payment SDK could get tricky with partial payments and discounts, etc... So we wanted to be as native as possible to not limit functionality. We ended up using some custom servier-side logic using the Gift Card API. Is the shop you are working with on Shopify Plus?

Happy to hear about your crazy ideas.
leysian
Shopify Partner
4 0 0

We were looking at the Gift Card API too, and I believe the shop would upgrade to Plus if needed.

So, in your setup I'm guessing you create a Shopify online gift card for every Valutec gift card that is created?  How do you keep the balances on Valuetec and Shopify in sync though?  Do you do a batch job every hour or something?  Thanks!

JAS_Technology
Shopify Expert
80 0 47

Right. So we:

  1. Call an AJAX script when somebody enters a gift card code in the gift card box on the checkout page
  2. Validate it with ValuTec and retrieve its balance
  3. Search for Gift Card with that code
  4. If none found, create it and return code (store the full code in the note field)
  5. If found and balance matches, return code
  6. If found and balance does not match, disable previous card and create a new one and return that code
  7. When script returns, re-populate text box with returned gift card code and then let Shopify continue to do its thing.
  8. We then subscribe to the orders/create webhook to look for order transactions that have a gift_card_id. Decrement transaction amount from ValuTec gift card matching the involved gift card code..

Magic!!!! 

Happy to hear about your crazy ideas.
leysian
Shopify Partner
4 0 0

Does seem pretty awesome.  When software works, it's magic!

Markus4xD
Shopify Partner
21 0 1

@jonathan

Would you need Shopify Plus to be able to implement this solution?

JAS_Technology
Shopify Expert
80 0 47

Hi there. Yes, since it makes use of the Gift Card API. 

Happy to hear about your crazy ideas.
JAS_Technology
Shopify Expert
80 0 47

And Mark, let me know if you need any guidance on the upgrade to Plus. jas@jastechnology.com

Happy to hear about your crazy ideas.
Matti1
Shopify Partner
2 0 0

Hey Jonathan,

You are not a mad scientist!  I'm attempting to do the exact same thing and have ran into the same walls.  My hope was to do pretty much what you have summarized.  My question is how did you add Javascript to the checkout in order to hook into the "Apply" button when a custome entered a gift card #?  I know this isn't part of the theme and that PCI compliance is at risk with doing any additional JS in the checkout.  I also tried setting up a webhook for the order/update event, but it does not attempt to apply any gift cards unless the gift card is a shopify issued gift card, so the event never triggers when I enter a 3rd party gift card #. 

Appreciate any help/advice you can provide.

Cheers,

Matti

Matekk_CS
Shopify Partner
6 0 0

Hi Matti and Jonathan,

Can you please help me with any solution on this?

"How did you add Javascript to the checkout in order to hook into the 'Apply' button when a customer enter a gift card? "

I wish to integrate Valutec Gift Cards to my checkout page via API.

I am a newbie in shopify, please help.

Thanks in advance!

JAS_Technology
Shopify Expert
80 0 47

Hi Matekk CS,

Adding this JavaScript requires the customization of the layouts/checkout.liquid code. The ability to edit this file is only available if you are on Shopify Plus. If that is possible, and is of interest to you, feel free to reach out to me and I can help with that.

jas@jastechnology.com

Happy to hear about your crazy ideas.
Matekk_CS
Shopify Partner
6 0 0

Hi there!

I am using Shopify Plus. Can you please help me how to call this ValuTec API on checkout page and rest functionality?

JAS_Technology
Shopify Expert
80 0 47

It's a fair amount of server-side and client-side code and the configuration of a private app. I'm happy to review a project to implement this feature for your site.

Happy to hear about your crazy ideas.
Matekk_CS
Shopify Partner
6 0 0

Hi Jonathan,

I have added the checkout.liquid page in layouts. 

My need is: If the user put in a Valutec giftcard and hit Apply in checkout page, I need to send the request to Valutec to validate the gift card value and remove the appropriate amount from the cart total. 

Can you please help me how can I trigger the Valutec API call when the user hit Apply button in checkout page.

Thanks in advance!

JAS_Technology
Shopify Expert
80 0 47

The checkout page has custom JS which calls to a private app running on a 3rd party server (Heroku/AWS/etc..) which handles the ValuTec/Shopify integration, which then responds back to the JavaScript whether or not the card is valid. The funds are not removed from the card at the time of checkout. Funds are removed via a Shopify webhook back to the private app code upon the final completion of the order.

Happy to hear about your crazy ideas.