How to Setup a Payment Gateway for Paytabs

Zumzum Financials Knowledge Base

    Before You Get Started

    Before you start with the setup fofa Payment Gateway, you need to ensure you have a number of items set up beforehand:

    1. Ensure you have a PayTabs account. Sign up here: https://www.paytabs.com/sign_up
    2. Ensure you have the Zumzum Financials Administrator permission set assigned to your user account in Salesforce. Follow this Salesforce help article to learn more about how to add permission sets.
    3. Registered your Salesforce Site Domain, Use this Salesforce article for how to setup you Salesforce Site

    Activate The Salesforce Remote Site

    The next step is to allow the Remote Site within Salesforce.  This Remote Site Setting is used to enable Salesforce to communicate with the PayTabs API  in a secure manner.  Here is how to enable the Remote Site Settings:

    1. From Setup, enter Remote Site Settings in the Quick Find box, then select Remote Site Settings.
    2. Click edit next to the ZumzumPayTabPaymentGateway remote site.
    3. Set the Active checkbox to true.
    4. Click Save.

    Setup and Publish a Salesforce Site

    When a user completes a PayTabs payment page, the data is captured and sent back to Zumzum Financials to process and store in Salesforce records.  You will create a Salesforce Site and enter the details into your PayTabs user account settings. This step will describe how to set up the IPN Handler link from Salesforce ready for entry into Paytabs:

    1. Go to Setup
    2. Search Sites in the quick find box and drill into the settings.
    3. Scroll down and Select New
    4. Enter a Site Label such as “PayTabs Site” – this can be as you wish.
    5. Click into the Site Name field, this should auto-fill the field.
    6. If you wish you can set a custom  Site Contact, or just leave it as the default (the user creating the record)
    7. In the Active Site Home Page field search PayTabsPaymentGatewayResponse and select the corresponding record.
    8. Tick the Active box.
    9. Select Save
    10. On the Sites page, you are redirected to, scroll down to the related list called Custom URL
    11. Copy the Sites Domain Name or make a note of it as you will need to enter this into your PayTabs account.
    12. Go to your Paytabs account to customise your settings in My Account, My Profile, and select Edit Profile
    13. Enter the Custom URL value to the IPN Listener URL field, please ensure you include the “http://” part of the whole domain name, e.g. http://cloudn.force.com/
    14. Enter the Custom URL value to the IPN Listener URL for Transaction Reports fields within PayTabs, please ensure you include the “http://” part of the whole domain name, e.g. http://cloudn.force.com/
    15. Confirm the changes with Submit button
    
    

    Setup a Payment Gateway for PayTabs

    Please note that before continuing you must have a PayTabs account. If you do not have a PayTabs account already, please go ahead and create one, here is a link to their page to create an account: https://www.paytabs.com/en/

    You will need to generate and have available your PayTabs Secret Key. To generate your Secret Key in your PayTabs account in your merchant dashboard. Go to your PayTabs Account and find the Secret Key link.

    Back in Zumzum Financials, you will need to add a new Payment Gateway to your company.

    1. Go to the Company you wish to add a Payment Gateway capability for.
    2. In the Payment Gateway, Related List select New
    3. Firstly Fill in Payment Gateway Name with any text value you wish.
    4. If you wish this payment gateway to be your first one to appear in the list for your users, select  Default Payment Gateway (this may only be selected for one gateway per company otherwise you will receive errors when saving)
    5. In the Type, field ensure Paytabs is selected
    6. Fill in the field Merchant’s Email with the email address linked to your PayTabs account
    7. Next Copy & Paste the Secret Key, generated in your PayTabs account, into the Client Secret field.
    8. In the Site URL ensure the value is exactly the same as the field “Site URL” on your PayTabs account
      • This will need to be the same top level domain name as the Redirect URL
    9. Fill out the Redirect URL with a page that you want the user to be redirected to upon completion of the payment
      • This will need to be the same top level domain name as the Site URL
    10. When you are ready, select Active to make available for use by your users.
    11. Save your settings

    Your users will now be able to select this payment gateway for Payment Gateway Transactions for this company.

    Optional: Capture Payment Method/Tokens and Store In Salesforce.

    Add an iFrame to Your Redirect Page

    Once your payment request is authorised through the PayTabs payment page, you are able to configure which web page your visitor will be redirected to.  You may decide to redirect to your own web site or any other web page as you wish.  Your decision will depend on how you wish to retain and continue to engage with your web visitor.

    You need to add an iFrame to the web-page that you want the user to be redirected to once the payment is complete. This step will be different depending on which service you use to host your website.   Contact your webmaster or consult your web content management tool manuals to ensure you are able to embed iFrames within your website or web hosting packages.

    Either enter the iFrame to one of your existing web pages or create a new dedicated web page for this use.

    Here is the code you will need to enter into your iFrame:

    NOTE: SITE_URL is the Domain Name URL of the Salesforce site you configured earlier.

    Replace the text in “ENTER YOUR SITE URL HERE” part of the script with your actual Salesforce Sites Domain Name URL.

    <noscript>
    <iframe src="ENTER YOUR SITE URL HERE" width="100%" height="10" type="text/html" frameborder="0" allowTransparency="true" style="border: 0"></iframe>
    </noscript>
    <script type="text/javascript">
    
    var form = 'SITE_URL';
    var params = window.location.search;
    var thisScript = document.scripts[document.scripts.length - 1];
    var iframe = document.createElement('iframe');
    
    iframe.setAttribute('src', form + params);
    iframe.setAttribute('width', '100%');
    iframe.setAttribute('height', 10);
    iframe.setAttribute('type', 'text/html');
    iframe.setAttribute('frameborder', 0);
    iframe.setAttribute('allowTransparency', 'true');
    iframe.style.border = '0';
    iframe.style.display = 'none'; /*This setting will will make iframe invisible*/
    
    thisScript.parentElement.replaceChild(iframe, thisScript);
    </script>

    in BankGetting StartedPayment GatewaySales Tags: Credit CardePaymentPayment