Integrate Fatora With Shopify Store

You can integrate any shopify website with Fatora, follow this steps.

Step1: Access to admin dashboard

1. Go to your website and loginto your account

   

Step2: Create a custom manual payment method

1. From your Shopify admin, go to Settings > Payments.

   

2. In the Payment providers section, select Create custom payment method.

   

3. Fill the popup form controls with the following data:

   • Enter the title of payment method in Custom payment method name field e.g: Paying online using Fatora.
   • Enter information in Additional details field e.g: You can pay after completing your order In thanks page you will find button cal Pay Now use it to pay online.
   • Enter information in the Payment instructions field e.g: Just use your credit card to pay it's very easy.

   

4. Click the activate payment method button.

Step3: Editing the checkout form options

1. From your Shopify admin, go to Settings > Checkout.

   

2. In Order processing Find Additional scripts, then add the following code, then click save

<script  src="https://code.jquery.com/jquery-3.4.1.min.js"  integrity="sha256CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous">
  </script>
  <script>

  var api_key = "E4B73FEE-F492-4607-A38D-852B0EBC91C9";
  var payBtn = document.getElementById('gotopay');

  function paynow(){

  var order_id = ("{{ order_id }}").replace('#','');
  var amount = {{ total_price}} / 100;
  var client_name = "{{ customer.name }}";
  var client_phone = "{{ customer.default_address.phone }}";
  var client_email = "{{ email }}";
  var currency ="{{currency}}";
  var order_id = "{{order_id}}";

  var dataToPost = {
		"amount": amount,
		"currency": currency,
		"order_id":  order_id,
		"client" : {
		    "name" :  client_name,
		    "phone" : client_phone,
		    "email" : client_email,
		},
		"language": "en",
		"success_url" : "http://domain.com/payments/success",
		"failure_url" : "http://domain.com/payments/failure",
		"fcm_token" : "XXXXXXXXX",
		"save_token" : false,
		"note": "some note here",
		}

  $.ajax({
  url: 'https://api.fatora.io/v1/payments/checkout',
  data: JSON.stringify(dataToPost),
  type: "POST",
  "headers": {
      "Content-Type": "application/json",
      "api_key": api_key
    },
  success: function (response) {
    if (response.status == "SUCCESS"){
        var url = response.result.checkout_url ;
        window.location.href = url;
    }
    else {
        var error_code = response.error.error_code;
        var description = response.error.description;
        window.location.href = failure_url+ "?error_code="+error_code+"&description=" + description ;
    }
  },
  error: function (result) {
    console.log("error: " + result.responseText);
      }
  });

  };
  </script>
  <br/>
  <div style="text-align: center;">
  <button style="    background-color: #00a2ff; borderradius: 10px; padding: 15px 100px; margin: auto; text-align: center; color: #FFF; fontsize: 22px;" id="gotopay" onclick="paynow()" class="button__text">Pay Now </button>
  </div> <br>

Step4: Create Completation Page (success, failure) page

When your client completes the payment, Fatora gateway will redirect to the default Fatora success | failure page, If you pass success_url | failure_url at requesting Standard Checkout API, Fatora will redirect after 2 seconds to the (success | failure) page. In this step we will create the two pages to get the URL of the success and failure page.

1. From your Shopify admin, go to Online Store > Pages.

   

2. Click on the Add New Page button.

3. Enter the title of your page (success page) and its content.

4. Click on save.

5. Return the same steps to add the Failure page.

6. Provide your Fatora account with the URL of these two pages to redirect to one of them after payment completion.

Create Apps for your Shopify store

You can install Shopify apps to help you build your business, integrate with services, and add features to your Shopify admin. We create an app here to update order status after successful payment completion. Following these steps to do that:

1. From your Shopify setting, go to Apps and sales channels, then select the tab develop apps.

   

2. click on create new app.

   

3. In App details section:

   • Enter the title of private app name e.g: Fatora
   • Enter the emergency developer email e.g: [email protected]

   

4. Select Configure Admin API scopes section to give the app the right permissions for the orders.

   

5. Scroll down to order section and give read and write permission

   

6. Click save, then click install app

   

7. Keep access_token and your app name, you will need them for webhook setting in the next step.

   

To trigger webhook

You need to put the URL of webhook in your account

1. From your Fatora account, go to Integration, then go to Integrate with Fatora section.

   

2. Click on Settings, then put the webhook url exactly in this format:

   https://maktapp.credit/Pay/MarkedAsPaid/{shop}.myshopify.com/{accesstoken}
   e.g: https://maktapp.credit/Pay/MarkedAsPaid/appname.myshopify.com/shpat_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

3. Press Save changes