Source for Online payments
These sources are used for online payments through Smart Checkout, our plugins and our payment tools.
Add a payment source
To add a new payment source for Online payments, please follow the steps below:
1. log into Viva (either demo or live ) and select the relevant account
2. Click on Sales in the left navigation menu:
3. Navigate to Online payments > Websites/Apps:
4. Click on the Add Website/App button in the top right-hand corner:
5. You will see the New Payment Source dialog box displayed:
6. Complete the fields as follows:
Code – The four-digit number at the top-left of the dialog box is the ‘Source Code’ - the unique code of this payment source. This code is automatically generated, but you can choose a different value if preferred (for organisational purposes, for example). If you are utilising our Payment API, this code is passed within the
sourceCode
parameter when creating a payment orderSource Name – In addition to the Source Code, you can also give your payment source a name. This allows you to more easily recognise the source within your account and within reports (for example, the Sales Clearance report)
Linked account – Choose which account (wallet) to link this payment source to. When this payment source is used, funds will be deposited into the chosen account. You can link several different sources to one account, if desired
Protocol – If your e-commerce platform uses SSL on the checkout, select
https
. If your platform does not use SSL (as is the case with some development environments, for example), usehttp
Domain Name – Enter the domain to be associated with this payment source. You do not need to add the trailing slash (
\
) or the protocol (http://
orhttps://
). For example:- If your site uses
www
: www.yourdomain.com - If your site doesn’t use
www
: yourdomain.com
- If your site uses
Integration method – Leave this as Redirection/Native Checkout v2
Company Logo - Upload your company logo to be associated with this payment source, in Transparent PNG format up to 100KB in size (suggested: 128 x 128 pixels). This is an important step as the logo will be displayed on your payment page, helping customers identify and validate your company
If you are using one of our Plugins, the following Success & Failure URLs may need a specific value. Please refer to the Plugin URLs table below
Success URL – This is the URL of the page the customer will be directed to upon a successful payment. For example, you could use this to present a confirmation or ‘thank you’ page to the customer
Failure URL – This is the URL of the page the customer will be directed to upon an unsuccessful payment. For example, you could use this to return the customer to the final step of the checkout process so they may attempt the transaction again
Plugin URLs Plugin name Success URL Failure URL WooCommerce Smart Checkout index.php?wc-api=wc_vivawallet&vivawallet=success
index.php?wc-api=wc_vivawallet&vivawallet=fail
OpenCart Smart Checkout index.php?route=extension/payment/vivawallet/callback&success
index.php?route=extension/payment/vivawallet/callback&fail
Magento Smart Checkout vivapayments/viva/callback
vivapayments/viva/callback
7. Optional: review the ‘Advanced Configuration’ section and display ‘Cancel’ button:
The Advanced Configuration section (as shown below) provides the ability to display a Cancel
button on Smart Checkout and amend the names of the URL parameters that are appended to your Success/Failure URLs after a transaction is made:
In order to activate the Cancel button on Smart Checkout, toggle the Cancel Button option on. When the Cancel button is clicked, Smart Checkout will redirect to your failure URL with the cancel query parameter
Please note:
- Currently, the Cancel button is supported for direct Smart Checkout integrations, as well as specific functionality for our Shopify & PrestaShop plugins
- It is possible to get webhooks for order cancellation events. Please follow this guide to define a webhook for order cancellations.
The four configurable parameters are:
Parameter | Default Name |
---|---|
Cancellation status | cancel |
Order Code | s |
Transaction ID | t |
Language | lang |
It is recommended to leave these parameters with their default names, unless you specifically require different parameter names to align with your internal systems or processes
8. Finally, read the information against each of the checkboxes at the bottom of the screen. You will need to agree to these in order to create the payment source. Once you have checked all of these, click on the Create button to complete the process.
Get Support
If you would like to integrate with Viva, or if you have any queries about our products and solutions, please see our Contact & Support page to see how we can help!