Creating buy one, get one promotions
Buy one, get one (BOGO) promotions commonly work by adding a free item to the cart in tandem with a subscription purchase. BOGO promotions are typically offered to promote specific products or to encourage the customer to sign up for recurring orders. This guide provides instructions for two methods to offer BOGO promotions.
- Recharge Checkout on Shopify
Before you start
- Implementing BOGO promotions requires advanced JavaScript, HTML, Shopify Liquid, and API knowledge. Advanced customizations of this nature are not supported by Recharge per our design and integration policy. If you do not have access to a developer, reach out to a Recharge Agency Partner.
- This guide provides an example using the Shopify Minimal Theme. While many themes are similar, the exact file names and location of code blocks may differ for your store's theme.
- This guide details a basic implementation of BOGO promotions. Any further customizations will require a developer or the assistance of a Recharge Agency Partner.
Method 1 - Add BOGO item to cart during checkout
You can use jQuery/Ajax to add a BOGO item to the cart during checkout by adding a hidden free item to the cart when a customer purchases a subscription product.
Step 1 - Set up products in Shopify
Create all of the products for the BOGO use case in Shopify. Ensure both the subscription and BOGO products are available in your Online Store sales channel.
Step 2 - Edit the product template file
In your Shopify theme files, you must customize the add-to-cart-button
to ensure both the subscription and BOGO products are added to the cart at checkout.
- In your Shopify Admin, click Themes. Select the Actions drop-down and click Edit code.
- Click Sections and open the
product-template.liquid
file. - Locate the
add-to-cart-button
and paste the Ajax code block directly after. The code block must layer on top of the existingadd-to-cart-button
for the add-to-cart functionality to work. - In the
function
element, update the cart data with the required Shopify Variant ID and quantity. Refer to Shopify's guide on finding a Shopify Variant ID. - Add a jQuery listener to the
add-to-cart-button
.
Full code:
<script>
$(document ).ready(function (){
$(document ).on( "click", "#add-to-cart-button",function(){
if ({{ product.id }} == <ORIGINAL_SHOPIFY_PRODUCT_ID>){
addItemToCart(<BOGO_ITEM_VARIANT_ID>, 1);
}
});
});
</script>
<script>
function addItemToCart(variant_id, qty) {
data = {
"id": variant_id,
"quantity": qty,
}
jQuery.ajax({
type: 'POST',
url: '/cart/add.js',
data: data,
success: function() {
window.location.href = '/cart';
}
}
</script>
Method 2 - Add BOGO item during subscription renewal
You can use Recharge’s API to add a hidden free item to the second order in a recurring schedule. The following example shows how to achieve this via Node as a Google Cloud Platform serverless function. You will need to adjust the code to fit your platform or service to consume the webhooks we create. We also use the request-promise package to handle the calls to the Recharge API.
Step 1 - Create a Recharge API token
You must create a Recharge API token to implement this method. Refer to Access API tokens for how to access and create your Recharge token. You must accept the Recharge API Terms of Service before you can create your first API token.
When generating the token, you will need to set permissions to specific Recharge objects. We recommend setting all of the permissions to Read/Write access, aside from "Store Information" which can currently only be set to Read access.
Step 2 - Create a function to handle adding the one-time item to the second charge
This function will trigger off of a Recharge webhook response and pass the address ID and next charge date as arguments.
- Define the next charge date value and restrict the received string to 10 characters.
- Make a POST call to the Recharge API with an address ID variable and the next charge date values.
- Dictate the body using JavaScript. In the body object, pass the next charge date, product title, price, quantity, Shopify Variant ID of the BOGO item, and any necessary property variables.
Step 3 - Create the main function
The main function executes the code and registers the webhook. It defines the required parameters and initiates the creation of the one-time item by calling its respective function.
- Open the function and pass the request and result as arguments.
- Define the body of the request and call the required parameters. Once you define the request body, define the Shopify Variant ID. In this step, use the Shopify Variant ID of the recurring subscription item.
- Look for the Shopify Variant ID via an "if" statement. If the qualifying item fits the Shopify Variant ID value, define the address ID, next charge date, and result values.
- Exit the function and return a 200 response to the webhook.
require('request');
var request = require('request-promise');
//ReCharge API Token
var rechargeApiToken = "<ReCharge API Token>",
//create one time bogo on future order
function createOneTimeBogo (addressID, nextChargeDate){
var oneTimeCharge = nextChargeDate.substring(0,10);
return request ({
"method": "POST",
"uri": "https://api.rechargeapps.com/onetimes/address/" + addressID,
"headers": {
"X-Recharge-Access-Token": rechargeApiToken,
"Accept":"application/json",
"Content-Type":"application/json"
},
"body": JSON.stringify({
"next_charge_scheduled_at": oneTimeCharge,
"product_title":"Standard Bogo",
"price":0,
"quantity":1,
"Shopify_variant_id":"<BOGO-VARIANT-ID>”,
"properties": []
}),
});
};
exports.main = (req, res) => {
var sub = req.body.subscription;
var ShopifyVariantID = sub.shopify_variant_id || null;
if (ShopifyVariantID == "<RECURRING-ITEM-VARIANT-ID>) {
var addressID = sub.address_id;
var nextChargeDate = sub.next_charge_scheduled_at;
var result = createOneTimeBogo(addressID, nextChargeDate);
console.log(result);
}
else {
console.log("No qualifying recurring item");
}
res.status(200).send("Webhook Received");
};
Step 4 - Register your webhook
Now that you have your function to add the one-time item to a future charge, you must register the webhooks that trigger the function. This implementation requires a registration to the "subscription/created" webhook because it is only triggered off of checkout and/or direct API-created subscriptions. Refer to the Recharge API Documentation for a description of these webhooks.
You can use the provided JavaScript script below as a template to create these webhooks, however, please use your own internal guidelines for registering webhooks if neeeded.
require('request');
var request = require('request-promise');
var rechargeApiToken = "<ReCharge API Token>",
request ({
"method": "POST",
"uri": "https://api.rechargeapps.com/webhooks",
"headers": {
"X-Recharge-Access-Token": rechargeApiToken,
"Accept":"application/json",
"Content-Type":"application/json"
},
"body": JSON.stringify({
"address": "insert trigger address",
"topic": "webhook looking to connect to"
}),
});