OPay Shopify Plugin

Running your business over Shopify store? Use our Shopify plugin and start accepting payments directly via OPay. OPay Shopify plugin gives your clients access to all supported payment options over your Shopify store. After following closely the steps explained in this tutorial, your Shopify store will be able to start accepting payments through OPay payment channels.

Before you start

OPay integration with Shopify plugin is an easy process where no advanced development skills are needed. However, you will need to make sure you meet the following criteria before you start:

  1. Make sure you have an active OPay account, or create account.
  2. Apply for a live account with OPay. Once we have reviewed and approved your documents, we will send you a contract with confirmation of the pricing and commercial terms. After the contract is signed, you will be able to access your account in live mode.

Currently, we provide three kinds of app installation module: OPay Payment Gateway(Public App),OPay Bank Card(Public App),OPay Reference Code(Public App),Opay Mobile Wallet(Public App) and OPay Custom Plugin(Custom App). We strongly recommend using Public app directly for installation, configuration and use. Public apps are more stable and can be found in Shopify App Marketplace. Custom app is still provided for some already existed merchants.

App Name App Type Download Link Feature
OPay Payment Gateway Public https://apps.shopify.com/opaypublicapp 1. This app contains seven payment methods, including Bank Card, Reference Code, Shahry, Valu, Mobile Wallet,OPay Now and Bank Installation.
2. This app is easy to install and configure. If you want to use different payment methods, it is recommended to install.
OPay Bank Card Public https://apps.shopify.com/opay-bankcard 1. This app only provides Bank Card payment method.
2. This app is easy to install and configure. If you only want to use the bank card payment method, please install it directly.
OPay Reference Code Public https://apps.shopify.com/opay-reference-code 1. OPay Reference Code only provides Reference Code payment method.
2. This app is easy to install and configure. If you only want to use the Reference Code payment method, please install it directly.
OPay Mobile Wallet Public https://apps.shopify.com/opay-mobile-wallet 1. OPay Mobile Wallet only provides Mobile Wallet payment method.
2. This app is easy to install and configure. If you only want to use the Mobile Wallet payment method, please install it directly.
OPay Shahry Public https://apps.shopify.com/opay-shahry 1. OPay Shahry only provides Shahry payment method.
2. This app is easy to install and configure. If you only want to use the Shahry payment method, please install it directly.
OPay Custom Plugin Custom Please follow the detailed installation process below. The app provides all payment methods, but this method is not recommended for installation at this stage.

Installation and configuration process

Install the plugin

  1. Please enter the app link: https://apps.shopify.com/opaypublicapp , click the Add app button:
    2. Shopify Payments

  2. Open the authorized installation confirmation page and click Install
    3. Shopify Payments

  3. Fill in configuration information
    4. Shopify Payments

  4. After filling in, click Submit, and then return to the payment method configuration page. You can see that the OPay payment method is ready. Click Activate OPay.
    5. Shopify Payments

  5. So far, OPay plugin has been installed and configured in Shopify store

Using plugin

  1. Open Shopify store and select products to purchase
  2. Select the products to purchase and enter the information page
    3. Shopify Payments

  3. On the checkout page, you can see the payment method of OPay and click Complete order
    4. Shopify Payments

  4. Jump to our cashier page and choose a method to complete the payment.
    5. Shopify Payments

  5. After payment, you will jump to the order completion page:
    6. Shopify Payments

  6. At this time, the newly generated order can be seen in the background of the store:
    7. Shopify Payments

  7. So far, the payment process has been completed.

Install the plugin

  1. Please enter the app link: https://apps.shopify.com/opay-bankcard , click the Add app button:
    2. Shopify Payments

  2. Open the authorized installation confirmation page and click Install
    3. Shopify Payments

  3. Fill in configuration information
    4. Shopify Payments

  4. After filling in, click Submit, and then return to the payment method configuration page. You can see that the OPay Bank card payment method is ready. Click Activate OPay Bank Card.
    5. Shopify Payments

  5. You could find OPay Bank Card payment method inPayments.
    6. Shopify Payments

  6. So far, OPay plugin has been installed and configured in Shopify store

Using plugin

  1. Open Shopify store and select products to purchase
  2. Select the products to purchase and enter the information page
    3. Shopify Payments

  3. On the checkout page, you can see the payment method of OPay Bank Card and click Complete order
    4. Shopify Payments

  4. Jump to our cashier page and fill in the bank information.
    5. Shopify Payments

  5. After payment, you will jump to the order completion page:
    6. Shopify Payments

  6. At this time, the newly generated order can be seen in the background of the store:
    7. Shopify Payments

  7. So far, the payment process has been completed.

Install the plugin

  1. Please enter the app link: https://apps.shopify.com/opay-reference-code , click the Add app button:
    2. Shopify Payments

  2. Open the authorized installation confirmation page and click Install
    3. Shopify Payments

  3. Fill in configuration information
    4. Shopify Payments

  4. After filling in, click Submit, and then return to the payment method configuration page. You can see that the OPay Reference Code payment method is ready. Click Activate OPay Reference Code.
    5. Shopify Payments

  5. You could find OPay Reference Code payment method inPayments.
    6. Shopify Payments

  6. So far, OPay plugin has been installed and configured in Shopify store

Using plugin

  1. Open Shopify store and select products to purchase
  2. Select the products to purchase and enter the information page
    3. Shopify Payments

  3. On the checkout page, you can see the payment method of OPay Reference Code and click Complete order
    4. Shopify Payments

  4. Jump to our cashier page and fill in the customer info
    5. Shopify Payments

  5. You could receive the Reference Code at jump page
    6. Shopify Payments

  6. You could enter Click here to find the offline store via map
    7. Shopify Payments

  7. When you finish the offline verification, you will return to the payment success page.
    8. Shopify Payments

  8. At this time, the newly generated order can be seen in the background of the store:
    9. Shopify Payments

  9. So far, the payment process has been completed.

Install the plugin

  1. Please enter the app link: https://apps.shopify.com/opay-mobile-wallet , click the Add app button:
    2. Shopify Payments

  2. Open the authorized installation confirmation page and click Install
    3. Shopify Payments

  3. Fill in configuration information
    4. Shopify Payments

  4. After filling in, click Submit, and then return to the payment method configuration page. You can see that the OPay Mobile Wallet payment method is ready. Click Activate OPay Mobile Wallet.
    5. Shopify Payments

  5. You could find OPay Mobile Wallet payment method inPayments.
    6. Shopify Payments

  6. So far, OPay plugin has been installed and configured in Shopify store

Using plugin

  1. Open Shopify store and select products to purchase
  2. Select the products to purchase and enter the information page
    3. Shopify Payments

  3. On the checkout page, you can see the payment method of OPay Mobile Wallet and click Complete order
    4. Shopify Payments

  4. Jump to our cashier page and fill in the mobile number.
    5. Shopify Payments

  5. When you click submit, you will jump to QR scan page.Please scan the code via your mobile wallet
    6. Shopify Payments

  6. When you finish the payment, you will return to the payment success page.
    7. Shopify Payments

  7. At this time, the newly generated order can be seen in the background of the store:
    8. Shopify Payments

  8. So far, the payment process has been completed.

Install the plugin

  1. Please enter the app link: https://apps.shopify.com/opay-shahry , click the Add app button:
    2. Shopify Payments

  2. Open the authorized installation confirmation page and click Install
    3. Shopify Payments

  3. Fill in configuration information
    4. Shopify Payments

  4. After filling in, click Submit, and then return to the payment method configuration page. You can see that the OPay Mobile Wallet payment method is ready. Click Activate OPay Shahry.
    5. Shopify Payments

  5. You could find OPay Shahry payment method inPayments.
    6. Shopify Payments

  6. So far, OPay plugin has been installed and configured in Shopify store

Using plugin

  1. Open Shopify store and select products to purchase
  2. Select the products to purchase and enter the information page
    3. Shopify Payments

  3. On the checkout page, you can see the payment method of OPay Shahry and click Complete order
    4. Shopify Payments

  4. Jump to our cashier page and fill in the shahry id.
    5. Shopify Payments

  5. When you finish the payment, you will return to the payment success page.
    6. Shopify Payments

  6. At this time, the newly generated order can be seen in the background of the store:
    7. Shopify Payments

  7. So far, the payment process has been completed.

Installation

This document illustrates how our gateway can be integrated with Shopify plugin in simple and easy steps. Please follow the steps in order to integrate the OPay plugin with your Shopify store.

  1. First thing you need to do is to share your Shopify store URL with OPay technical team.
  2. OPay technical team will provide you with following information:
    • Merchant Installation link.
      •                             
                                https://your-store.myshopify.com/admin/oauth/install_custom_app?client_id=37c5001d47da504d6cc193e2345438bc&signature=eyJfcmFpbHMiOnsibWVzc2FnZSI6ImV5SmxlSEJwY21WelgyRjBJam94TmpJNU56a3hNRGN5TENKd1pYSnRZVzVsYm5SZlpHOXRZV2x1SWpvaWJXbHRiMk52WkdWekxXUmxkaTV0ZVhOb2IzQnBabmt1WTI5dElpd2lZMnhwWlc1MFgybGtJam9pTXpkak5UQXdNV1EwTjJSaE5UQTBaRFpqWXpFNU0yVXlZV1V3Tm1JNFltTWlMQ0p3ZFhKd2IzTmxJam9pWTNWemRHOXRYMkZ3Y0NKOSIsImV4cCI6IjIwMjEtMDgtMzFUMDc6NDQ6MzIuNTUwWiIsInB1ciI6bnVsbH19--f182b86e2dbf3d417e58616801bd08e236272302
    • API Key.
    • API Secret Key.
    • Order processing JavaScript code.
  3. Open the merchant install link in your browser. The link will redirect you to the application installation page.
    4. Shopify go to opay link
  4. Click on Install app to get the app installed to your shop.
  5. Under your Shopify admin panel got to Apps, you should see an application with name OPay.
    6. OPay Shopify App installed
  6. Well done, you have managed to install Shopify OPay plugin!

Setup and Configuration

Once you have installed OPay Shopify plugin under your store applications list, you need to enter your OPay merchant account details. Click on OPay application in your installed application list to got to the plugin configuration page.

OPay Shopify App installed
  • Within the "Configuration" page, please fill the fields as described in the following table:
    • field description example
    Application Name Set it as the installed OPay application name. OPay Payment
    API key API key you have received from OPay technical team. 37c5001d47da504d6cc193e2345438bc
    API Secret key API secret key you have received from OPay technical team. shpss_e8380a1aa76b3e8cbc3441f85610aewe
    Merchant ID (Sandbox) Your Sandbox merchant ID you should have received it after creating an account. 256612345678901
    Secret Key (Sandbox) Your Sandbox Secret key you should have received it after creating an account. Secret Key
    Public Key (Sandbox) Your Sandbox Public key you should have received it after creating an account. Public Key

    Additional Scripts

    1. In your Shopify store admin panel, click on Settings->Payments
      2. Shopify Payments
    2. Scroll down to the Manual Payment Methods section.
    3. Create Manual Payment Methods as follows:
      4. Shopify Payment Methods
    4. Again, from your Store admin panel, click on Settings->Checkout.
      5. Shopify Checkout
    5. Scroll down to the Order Processing section until you see the textarea of the additional scripts.
      6. Shopify Additional Scripts
    6. In the additional scripts area, you have to add the JavaScript Code received from OPay technical team during the on-boarding process.

    What's Next?

    Callback Notifications
    Learn how to set up Payment Notifications Callback.

    End-to-End Testing
    Test your integration using End-to-End Testing.
    Need help?

    User Profile 12 messages

    James Jones
    Application Developer
    jm@softplus.com
    My Profile
    Account settings and more update
    My Messages
    Inbox and tasks
    My Activities
    Logs and notifications
    My Tasks
    latest tasks and projects
    Recent Notifications
    Another purpose persuade Due in 2 Days
    +28%
    Would be to people Due in 2 Days
    +50%
    Purpose would be to persuade Due in 2 Days
    -27%
    The best product Due in 2 Days
    +8%
    System Messages
    Top Authors Most Successful Fellas
    +82$
    Popular Authors Most Successful Fellas
    +280$
    New Users Most Successful Fellas
    +4500$
    Active Customers Most Successful Fellas
    +4500$
    Bestseller Theme Most Successful Fellas
    +4500$
    Notifications
    Another purpose persuade Due in 2 Days
    +28%
    Would be to people Due in 2 Days
    +50%
    Purpose would be to persuade Due in 2 Days
    -27%
    The best product Due in 2 Days
    +8%
    Customer Care
    Reports
    Memebers