How to install checkout form

This guide explains how to install the VaocherApp checkout form on your website so customers can purchase gift vouchers online.

The checkout form is hosted by VaocherApp and embedded into your website using a small piece of code. No advanced development skills are required.

Before You Start

Before installing the checkout form, make sure:

• Your VaocherApp account is active
• You have created at least one gift voucher item
• Your preferred payment method is connected to your account (for example, Stripe)
• You have access to edit your website content (CMS or HTML)

If any of these steps are not completed, please set them up first to avoid issues during checkout.

Step 1: Get Your Checkout Embed Code

1. Log in to your VaocherApp dashboard
2. Go to Install Checkout Form
3. Choose your website platform to embed the VaocherApp checkout so customers stay on your website while purchasing a gift voucher

VaocherApp dashboard showing the checkout form embed code for installation

4. Alternatively, scroll down to copy the checkout link

The embed code and checkout link are unique to your account and connect your checkout form with your items and payment settings.

Copying the checkout link from the VaocherApp Install Checkout Form page

Step 2: Add the Embed Code to Your Website

Paste the embed code into the page where you want customers to purchase gift vouchers.

How you add the code depends on your website platform. Below are common examples.

WordPress

1. Edit the page where you want the checkout form to appear
2. Add a Custom HTML block
3. Paste the embed code
4. Save or publish the page

You can view the full WordPress guide here: https://www.vaocherapp.com/docs/wordpress-integration/

Shopify

1. Edit a page in Online Store
2. Switch to the HTML view
3. Paste the embed code where you want the form to appear
4. Save the page

Wix

1. Open your site editor
2. Add an Embed HTML element
3. Paste the embed code
4. Publish your site

Custom HTML Website

Paste the embed code directly into your page HTML at the desired location.

Adding the VaocherApp checkout embed code to a website page

Step 3: Test the Checkout Form

After adding the checkout form:

1. Open the page on your website
2. Select a voucher amount or item
3. Complete a test purchase
4. Confirm that payment, order creation, and email notifications are working correctly

We recommend using Stripe test mode before going live.

Step 4: Go Live

Once testing is successful:

• Switch your payment method to live mode
• Confirm item pricing and voucher settings
• Check that order and email notifications are working

Your checkout form is now ready to accept live orders.

VaocherApp checkout form live and accepting orders

Common Issues and Tips

• Checkout not displaying: Make sure the full embed code is pasted correctly
• No items shown: Check that your gift voucher items are active
• Payment issues: Confirm your payment method is connected and in the correct mode
• Layout issues: Some website themes may add extra spacing around embedded content