Tutorial: Custom Discount Trigger Service Plugin

Wix service plugins (formerly SPIs and custom extensions) allow you to implement custom logic to change how your site displays and behaves. For example, with Wix Stores or Wix Restaurants your site can set up discounts that apply automatically for specific products or based on specific conditions, such as a minimum quantity of items or a minimum order subtotal. This service plugin allows you to implement your own custom conditions that will trigger a discount for a customer.

Read more information on how to implement a service plugin.

With the Custom Discount Trigger service plugin you can define which conditions will trigger an automatic discount. Possible custom triggers could apply discounts on the following:

  • For members only.
  • A restaurant's menu based on the time of day.
  • Digital products.
  • Specific items based on size or color.
  • A bundle of related items in a cart.

Introduction

This tutorial explains how to set up and implement a custom discount trigger plugin on your site using Velo. We created an example to demonstrate how you can use service plugins to create custom triggers that apply automatic discounts for your customers. We use the example of a restaurant that wants to offer a 25% off discount on all menu items between the hours of 4-6 pm.

The process has 4 steps:

  1. Create a new custom discount trigger plugin on your site.
  2. Implement your plugin with custom code.
  3. Create a new discount and assign the custom trigger that triggers it.
  4. Deploy the plugin.

Step 1: Create a new custom discount trigger plugin

The first step in setting up your new plugin is to add it to your site. This process creates a new folder in the /src/backend/spi section of the Wix IDE Explorer (Wix Studio), which contains the files for your code, or the Service Plugins section of the Velo sidebar (Wix Editor).

  1. Add the Wix Restaurants app to your site.

  2. Enable coding:

    • Wix Studio: If necessary, click and then Start Coding.
    • Wix Editor: Enable Velo Dev Mode, and then click the Public & Backend tab in the Velo sidebar.

  3. Go to the Service Plugins section:

    • Wix Studio: Click Public & Backend.
    • Wix Editor: Scroll down to the Service Plugins panel at the bottom of the sidebar.

  4. Next to Service Plugins, click , then click Custom Discount. (In Wix Editor you need to hover over Service Plugins.)

  5. Follow the prompts to add the plugin and accept any terms and conditions that display.

  6. Enter a name for your integration and click Add & Edit Code. The name can't contain spaces or special characters. In this example, we named it custom-triggers.

  7. Wix Studio: Open the Wix IDE, and go to /src/backend/spi/ecom-discounts-trigger. If your service plugin doesn't appear, try refreshing both the Studio Editor and the Wix IDE.

  8. Publish your site.

Step 2: Implement the plugin

The procedure in the previous step creates a folder in the Wix IDE's Explorer (Wix Studio), or in the service plugins section of the Velo sidebar (Wix Editor). The name of the folder is based on the plugin you chose. Inside this is another folder with the name of the plugin you set up. This folder contains 2 files, custom-triggers-config.js and custom-triggers.js. We implement the custom code for our plugin in these files.

custom-triggers-config.js

This file is where we write the code for setting up the plugin's configuration.

The code in this file defines a function named getConfig() that returns an object containing the configuration of your custom discount trigger plugin.

Currently no configurations are available for this plugin, so set getConfig() to return an empty object.

Copy

custom-triggers.js

This file is where we write the custom code that determines whether or not to trigger a discount. In our example, we want to trigger a 25% discount on all menu items if the customer is making the order between 4-6 pm.

The code in this file creates a custom trigger with the listTriggers() function by returning an object with an _id and a name. Then, with the getEligibleTriggers() function we define the custom logic for when to apply the trigger we created.

Copy

Lines 1-4: First we import the eCom custom triggers module. Then we export the listTriggers() function where we define any custom triggers we want to create.
Lines 6-11: We return an array of customTriggers, giving each one an _id and a name.
Line 16: Then we export the getEligibleTriggers() function where we define the custom logic to determine whether or not to apply the custom trigger.
Lines 18-21: We declare our variables.
Line 24: We check if the current time is between 4-6pm.
Lines 26-31: If so, then the trigger we created in listTriggers() function is eligible and should trigger the applicable discount.
Lines 33-37: If not, then eligibleTriggers is an empty array as there are no eligible triggers to apply.

Optional: Add files to the plugin

If you don't want to keep all of your code in the main files, you can add files to the plugin's folder and import functions and objects into the main files.

  • Wix Studio: Create a new file in the plugin's folder.

To import from these files to the main files, use the following syntax:

Copy
  • Wix Editor:
    1. Hover over the plugin folder's name and click Show More .
    2. Select the New.js file.

Step 3: Create a new discount and assign the custom trigger

Create an automatic discount with the Discount Rules API, or by using the dashboard and set the custom trigger using the name of the custom trigger we created in our listTriggers() function. In our example, "Happy Hour Custom Trigger".

Optional: Test the plugin

Once the discount is created and connected to your custom trigger, you can test your plugin before publishing your site in the Wix Editor using functional testing like you would with any backend Velo code. Make sure your getEligibleTriggers() function's return values are properly formatted.

You can test your plugin after deploying for both Wix Editor and Wix Studio. To test your plugin after deploying, add console logs to your code. The results appear in the Site Events log.

Step 4: Deploy the plugin

When your code files are ready, you can publish your site and then try it out for yourself to see the custom discount trigger in action.

  1. Once your code files are ready, click Save. Then publish your site.
  2. After your service plugins are published, visit your site.

If you visit your site between 4-6pm you should see the 25% discount applied to all menu items.

Remove the plugin

To remove the plugin from your site, follow these steps:

  • Wix Studio: Right-click on the plugin's folder and select Delete Permanently.

  • Wix Editor:

    1. In the Public & Backend section of the Velo sidebar, under Service Plugins, hover over the plugin's folder and click Show More .
    2. Select Remove.
    3. Click Remove.
Did this help?