How to Create Quantity Based Discounts in Shopify Using Shopify Functions

Step 1: Set Up Your Development Environment

Ensure you have Node.js and Shopify CLI installed.

Step 2: Install Shopify CLI

If you haven’t already installed Shopify CLI, you can do so using npm:

npm install -g @shopify/cli @shopify/theme

Step 3: Authenticate with Shopify

Log in to your Shopify Partner account using the CLI:

shopify login --store your-store-name.myshopify.com

Step 4: Create a New App

Use Shopify CLI to create a new app:

shopify app create node

Follow the prompts to:

• Enter a name for your app
• Select your partner organization
• Choose a development store (or create one)

Step 5: Navigate to Your App Directory

cd your-app-name

Step 6: Generate the Discount Function Extension

shopify app generate extension

Select Discount as the type of extension.

Step 7: Develop the Function Logic

Navigate to the extensions directory in your app, and open the discount function folder. Inside the src directory, modify index.js to include the logic for quantity-based discounts.

src/index.js

import { extend, DiscountApplicationStrategy } from '@shopify/checkout-ui-extensions';

extend('Checkout::Dynamic::Render', (root, { applyDiscount }) => {
  const quantityThresholds = [
    { quantity: 5, discount: 10 },
    { quantity: 10, discount: 15 },
    { quantity: 20, discount: 20 }
  ];

  let discount = 0;
  let message = '';

  const cart = root.querySelector('Cart');
  const totalQuantity = cart.items.reduce((sum, item) => sum + item.quantity, 0);

  for (const tier of quantityThresholds) {
    if (totalQuantity >= tier.quantity) {
      discount = tier.discount;
      message = `You have earned a ${discount}% discount for purchasing ${tier.quantity} or more items!`;
    }
  }

  if (discount > 0) {
    applyDiscount({
      percentage: discount,
      message,
      strategy: DiscountApplicationStrategy.First
    });
  }
});

Step 8: Configure the Extension

Modify shopify.extension.toml to configure your extension:

name = "Quantity Based Discounts"
type = "checkout_post_purchase"

Step 9: Deploy the Function

Deploy your app and function to Shopify using the following commands:

shopify app deploy
shopify app publish

Step 10: Enable the Discount Function

1. In your Shopify admin, navigate to Settings > Checkout > Discounts.
2. Enable the new discount extension and configure it as needed.

Step 11: Test Your App

Test the discount function by creating orders with different quantities of items and checking out to ensure the correct discounts are applied based on the quantity tiers.

Step 12: Secure Your Environment Variables

Ensure that any sensitive data (like API keys) used in your app is secured using environment variables. Update your .env file and load them using the dotenv package.

Example .env

SHOPIFY_API_KEY=your-api-key
SHOPIFY_API_SECRET=your-api-secret
HOST=https://your-ngrok-url

Load Environment Variables in server.js

require('dotenv').config();
const Shopify = require('shopify-api-node');

const shopify = new Shopify({
  shopName: process.env.SHOPIFY_SHOP_NAME,
  apiKey: process.env.SHOPIFY_API_KEY,
  password: process.env.SHOPIFY_PASSWORD
});

Summary

1. Set Up Environment: Install necessary tools and authenticate with Shopify.
2. Create App: Use Shopify CLI to create a new Node.js app.
3. Generate Extension: Create a discount function extension using Shopify CLI.
4. Develop Function: Implement logic for quantity-based discounts.
5. Deploy and Test: Deploy your app and function, enable it in Shopify admin, and test it.

This guide provides a foundation for creating a custom discount function in Shopify that applies quantity-based discounts. Customize and extend the logic as needed to fit your specific requirements.