WooCommerce Smart Checkout plugin

Our WooCommerce Smart Checkout plugin allows you to accept payments via Viva Smart Checkout in your WooCommerce store.

Overview

This plugin uses our Smart Checkout solution. Please see our video overview of Smart Checkout’s main features and benefits:


Features

1 Please note: If offering installments, the value provided by the merchant is not the number of installments the customer will select, and it is not mandatory for the customer to select installments at all. The process is as follows:

  1. The merchant indicates the maximum number of installments they wish to offer to the customer
  2. It is then up to the customer whether they pay with or without installments
  3. If the customer decides to pay with installments, they are able to select the number of installments (up to the maximum specified by the merchant)

User experience

Screenshots

This plugin uses our Smart Checkout solution. Customers are redirected from your checkout page on your WooCommerce store to Viva Smart Checkout to pay, and after the customer pays, they are redirected automatically back to your WooCommerce store.

The below images show:
a) a demo checkout page on WooCommerce, and
b) a demo Viva Smart Checkout:

Shopify Checkout Page
Smart Checkout

Video

The below video shows the user experience from your checkout page to Viva Smart Checkout.

Supported payment methods

Smart Checkout supports a wide variety of payment methods, including:

Visa
Mastercard
American Express
Maestro
Bancontact
JCB
Discover
Diners Club
Apple Pay
Google Pay
Samsung Pay
PayPal
PayPal Pay Later
Viva Wallet
MobilePay Online
BANCOMAT Pay
BitPay
BLIK
EPS
Satispay
iDEAL
IRIS
Klarna
MULTIBANCO
MB WAY
P24
Payconiq
PayU
Swish
tbi bank
Trustly
WeChat Pay
SEPA Direct Debit
Pay By Bank
Payment Method Icon - Bluecode
Cash (Viva Spot)
Pay on Delivery

Please see our Payment Methods page for further information on all of our payment methods

Cross-border payments: You can accept payments from international customers for all payment methods except for local payment methods and Pay By Bank

Before you start

Step 1: Create Viva account

If you do not already have an account with Viva please create an account.

Step 2: Find account credentials

Step 3: Determine your payment methods

Determine which payment methods you want to offer to your customers.

Some of these payment methods are automatically activated for you by us (e.g. Apple Pay), other payment methods can only be activated by yourself (e.g. PayPal), for others you need to get in touch with us to activate them for you after a further review of your business.

Setup instructions

If you have any other Viva WooCommerce plugins installed on your system, please deactivate them before activating the Viva Smart Checkout plugin to ensure smooth functionality.

Adding the WooCommerce Smart Checkout plugin consists of the following steps.

Step 1: Add Viva Smart Checkout plugin to your WooCommerce store

Automatic Installation instructions

Add the Viva Smart Checkout plugin to your WooCommerce store by following the below steps:

  1. Log into your WooCommerce (Wordpress) account and navigate to Plugins > Add New:

    WooCommerce Dashboard

  2. In the Search Plugins bar, type viva.com to locate the Smart Checkout for WooCommerce plugin. Once found, click the Install button:

    WooCommerce Dashboard

  3. Once installed, click on the Activate Plugin button.

Manual Installation instructions

Add the Viva Smart Checkout plugin to your WooCommerce store by following the below steps:

  1. Download the WooCommerce Smart Checkout plugin (ZIP file) to your device.

  2. Log into your WooCommerce (Wordpress) account and navigate to Plugins > Add New:

    WooCommerce Dashboard

  3. Click on the Upload Plugin button at the top of the screen:

    WooCommerce Upload Plugin

  4. In the pop-up window, click choose file, browse to the ZIP file you downloaded in Step 1 and upload this file

  5. Click on the Choose button then Install Now. Wordpress will install the plugin in the background

  6. Once installed, click on the Activate Plugin button.

Configuring the WooCommerce Viva Smart Checkout Plugin
  1. Navigate to Settings from the WooCommerce menu in the left navigation

  2. Click on the Payments tab at the top of the page to display the WooCommerce Payment Methods list

  3. Find the Viva.com Smart Checkout plugin and click on it.

  4. Ensure that the Viva.com Smart Checkout plugin toggle is enabled and click on the Finish SET UP button to configure the Smart Checkout plugin settings.

    WooCommerce Configure Plugin

  5. A Viva-specific settings page will be displayed. Please fill out the fields as follows:

    WooCommerce Configure Plugin

    • Enable Viva.com Smart Checkout: Check this box to enable the plugin

    • Demo mode: When checked, the plugin will connect to the Viva demo environment. In that case, use the credentials from your demo account. When unchecked, use the credentials from your live account

    • Live Client ID: Enter the ClientId within from WooCommerce credentials section. Check out this page for more details on how to locate your WooCommerce Credentials

    • Live Client Secret: Enter the Secret within from WooCommerce credentials section. Check out this pagefor more details on how to locate your WooCommerce Credentials

    • Preauthorized Payments: Select this option to enable preauthorized payments. When selected, all transactions will initially be created with a “preauthorize” status. You must capture the payments manually. Please note, you can capture them directly from the order details page within your WooCommerce system.

    • Advance settings: Check the box to access the advanced configuration settings. WooCommerce Configure Plugin

    • Title: Enter the title to display to customers on the Checkout screen. For example “Viva Smart Checkout”

    • Description: Enter the description to display to customers on the Checkout screen. For example “Make a fully secure payment”

    • Installments: This is an optional field, only applicable to Greek merchants – you can set the maximum allowed payment card installments and their corresponding order values

    • Live Source Code List: The source code for your plugin will appear here. The plugin will automatically generate the source code.

    • Show logo on checkout page: Enable this option to display the Viva.com logo in the Smart Checkout payment methods section.

    • Order status: Select the order status in WooCommerce for successful payments. You can choose either “Processing” or “Completed.” Please note that preauthorized payments will remain in “On hold” status until captured. Ensure that preauthorized payments are captured within 5 days.

  6. When complete, click on the Save changes button at the bottom of the screen and the Viva payment option will be available in your checkout

An example of how the Title and the Description are displayed on the checkout page

WooCommerce Smart Checkout Title and Description

Once you have configured the WooCommerce Smart Checkout plugin, it will automatically generate a source code for you. You can then locate the source code in your self-care portal and upload your preferred logo.

We would highly recommend you show your company logo on your payment pages in order to increase customer recognition and trust, thus improving conversion. You can insert your company logo while creating the payment source as outlined above.

You can also change or update this logo at any time. To do this,

  1. Locate the source code used by your WooCommerce Smart Checkout plugin. To do this, navigate to Plugin Settings from the Payments tab under WooCommerce menu in the left navigation. Locate Source Code on WooCommerce

  2. Log in to Viva Self Care and go to SALES -> ONLINE PAYMENTS -> WEBSITE/APPS. Find the source code used by your plugin. Find the Source Code on Viva

  3. Click on the source code and upload your logo (please do not make any other changes). Once uploaded, accept the terms and save the source code. Update Source Code

For more details about source code configurations, you may see our adding your brand logo tutorial.

Upgrading the plugin

Keeping the plugin up to date help improve user experience with the addition of new features as well as improvement of existing features.

Update automatically

Auto-update feature is one way to update the plugin with no effort required from you. To be able to activate auto-updates,

  1. Log in to your Wordpress admin panel, go to Plugins page and search for Viva Smart Checkout.

  2. Click Enable auto-updates link to automatically upgrade the plugin in the future. Viva Smart Checkout Plugin Configure

Update manually

  1. To update the WooCommerce Smart Checkout plugin, log in to your Wordpress admin panel, go to Plugins page and search for Viva Smart Checkout. Viva Smart Checkout Plugins

  2. If Update Now link is visible, click it to upgrade the plugin.

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!