New Shopify integration
This guide is for merchants that want to integrate the new Safepay payment gateway on their Shopify store. This guide explains how you can easily integrate Safepay into your Shopify store so that your customers can pay you securely and easily through your website.
If you have integrated Safepay on your Shopify store previously, please make sure you uninstall the old Safepay payment gateway so that your new integration works smoothly and does not confuse your customers at checkout. You can learn how to uninstall your previous Safepay integration from your Shopify store at the end of this guide.
Before installing the new plugin for Shopify please make sure you have gone through our guide on how to set up Safepay and have completed the following steps:
- Created your Sandbox Account and know how to find your Public API Key and Sandbox Secret Key, read this guide.
- Created your Production Account and know how to find your Public API Key and Production Secret Key, read this guide.
- Activate your Webhook Secret Key. To learn more about how to activate your Webhook Secret Key, read this guide.
Keep your Webhook Secret Key safe
Your Webhook Secret Key is used to sign all transactions to ensure that each payment is unique and valid. Never share this with anyone, not even with Safepay.
Installing the plugin
- Visit the Safepay Checkout Shopify app page from this link to install the app and click Add app as shown in the image below.
- You will be redirected to a Settings page where you can configure the plugin by setting your API keys.
- Once this is done, click Continue and you will be redirected to the Settings page for the Safepay app on your Shopify Admin Dashboard.
- You can manage the Safepay app status from the Settings page by clicking on Deactivate Safepay to disable Safepay checkout. for your store to process payments. Please note that your keys should remain configured for the plugin to work.
- You can also check the Enable Test Mode checkbox to use the plugin in test mode (use your test keys to process transactions. Remember, in test mode, no real money is used)
- You can untick Enable test mode button when you want to use App in live mode, this should only be done once your account is approved.
- To update/change your API keys, you can click on the Manage button and you will be redirected to the Settings page.
There are a few things to consider on this page:
- Account Information: Contact email@example.com if there is any issue while performing integration.
- Accepted Payments: This does not affect Safepay Checkout. Regardless of which options are checked and which ones aren’t, Safepay currently only supports Bank account transfers through Payfast and NIFT payment channels.
- Test Mode: If you enable test mode, transactions will be simulated using Safepay’s sandbox environment. No real money will be deducted from your or your customer's account and any orders placed while your store is on Test Mode should be treated as test orders.
When a customer places an order on your Shopify store and pays through Safepay, you should reconcile the payment with your Safepay dashboard. On your Shopify admin, when you go to view a specific order you will most likely see something like this:
- The first thing to notice is whether or not the order is a Production or Test order. If you have enabled Test Mode for Safepay, then all orders will be test orders and you will see a yellow notification on top.
- If you scroll down to the Order Timeline you will see something like this:
- If you click this line, it will expand to provide you with all the details Shopify collected for this order.
Test payments for test orders will show up on your Safepay sandbox dashboard while Live payments for live orders will show up on your Safepay production dashboard.
- The Payment unique reference can be found under the field Payment. This field is also shown as Order ID on your Safepay merchant dashboard
- If you have enabled Test Mode while integrating Safepay remember to disable this after you are done with the integration and are happy with this. You can see how to do this in the Installing the Plug-in section above.
- If you’ve made it this far then your store can now accept payments using Safepay.
- Click here to navigate to our demo Shopify store and make a test transaction
How to uninstall the old Safepay payment gateway
If you have the old payment gateway, you can deactivate this (and uninstall it if you wish) using the following steps:
1. Log in to your Shopify Admin Dashboard and click on Settings on the bottom-left of your screen
2. On the menu on the left side, click on Payments. Then under Supported Payment Methods, click on Add Payment Methods On the menu on the left side, click on Payments. Then under Supported Payment Methods, locate the old Safepay payment method
3. Click on the Manage button
4. On the menu on the left side, click on Payments. Then under Supported Payment Methods, click on Add Payment Methods At the bottom of the payment method information, click on the Deactivate Safepay button
5. After this is done, an Uninstall Safepay button shows up. You can also click on this if you wish to completely uninstall the old Safepay payment method.
Please note that deactivating the old gateway also removes it from your Shopify checkout, so your customers will not see it when they want to pay in your store.
Important to note
Safepay can only process payments in PKR so please make sure your store is configured to accept payments in only this currency.