Laravel eCommerce Tabby Payment Gateway

1. Bagisto: v2.5.0
2. Currency: AED, SAR or KWD enabled on the sales channel
3. Cache: a shared store such as Redis or the database when the store runs on more than one server

1. The admin enables or disables the payment method.
2. The admin sets the title, the description and the logo of the payment method.
3. Admins pick which of AED, SAR and KWD the store accepts.
4. The admin enters separate keys for the sandbox and for the live mode.
5. Customers pay in four interest-free installments on the Tabby hosted page.
6. The admin registers the Tabby webhook from the admin panel.
7. The store places the order even when the customer never returns from Tabby.
8. Each payment is captured once, so Tabby never charges a customer twice.
9. Each paid order gets an invoice and a transaction under Sales>Transactions.
10. The store sends the customer back to the cart when Tabby cannot capture the payment.
11. A refund created in the admin panel goes to Tabby automatically.
12. Product pages, the cart page and the checkout show the installment plan.
13. The store sends the buyer and order history to Tabby for the approval decision.
14. The admin turns on Mock Mode to test the whole flow without calling Tabby.

First, unzip the extension and merge the packages folder into the project root.

Next, open the bootstrap/providers.php file and add the following line under Provider:

use Webkul\TabbyPayment\Providers\TabbyPaymentServiceProvider;

return [
    TabbyPaymentServiceProvider::class,
]

After that, open the composer.json file and add the following line under ‘psr-4‘:

"Webkul\\TabbyPayment\\": "packages/Webkul/TabbyPayment/src"

Then run these commands to complete the setup:

composer dump-autoload

php artisan bagisto-tabby:install

The install command runs the module migrations, publishes the payment logo and clears the cache.

Configure the payment method

After the install, go to Configure>Sales>Payment Methods>Tabby Payment Gateway.

Here, the admin sets the following options:

• Title: the name customers see for the payment method at checkout.
• Description: the text customers see under the title.
• Accepted currencies: the currency codes Tabby may accept, separated by commas. The default is AED,SAR,KWD.
• Logo: the image beside the payment method. The recommended size is 55 x 45 pixels.
• Merchant Code: the code that Tabby gives your store.
• Live Mode: switches between the sandbox and the live environment.
• Public Key and Secret Key: the live keys from the Tabby dashboard.
• Test Public Key and Test Secret Key: the sandbox keys for testing.
• Status: enables or disables the payment method.
• Sort: sets the position of the payment method on the checkout page.

Finally, click the Save button.

Register the webhook

Tabby only notifies webhooks that you register through the store. So go to Settings>Tabby Webhook and click Generate Webhook.

The page then lists each webhook with its ID, URL and type. The webhook lets the store place the order even when the customer closes the tab after paying.

Alternatively, run this command to register the webhook:

php artisan tabby:webhook

Test with Mock Mode

Mock Mode simulates Tabby, so you can test the checkout without keys. Turn it on in the payment method settings. The store ignores it while Live Mode is on.

Next, the mock checkout page lets you pick the result: approved, rejected, cancelled, or a notification that never arrives. You can also choose how the store delivers the webhook.

However, never keep Mock Mode on in a live store.

Orders, transactions and refunds

The admin sees the Tabby orders under Sales>Orders. Each paid order also has an invoice and a transaction under Sales>Transactions.

To refund a payment, the admin creates a refund on the order. Then the store sends the refund to Tabby, and the admin does not need to open the Tabby dashboard.

Place an order with Tabby

First, the customer adds a product to the cart and clicks the Continue to Checkout button.

Then the customer selects the shipping address and clicks Confirm.

After that, the customer selects the Tabby payment method. The card below it shows the installment plan.

Next, the customer clicks Place Order. The store sends the customer to the Tabby page, where the customer picks a plan and pays.

After the payment, the customer returns to the store and sees the order confirmation with the order ID.

If Tabby cannot approve the purchase, the customer sees a message and can pick another payment method. If the capture fails, the store returns the customer to the cart and places no order.

Order history and installment widgets

Customers also check the order status and the payment method in their order history.

Besides that, the product page and the cart page show the Tabby installment plan. So customers see each installment before they check out.