ShopSite Tip – Selling Products In Quantity Increments

Once in a while you may have a reason to sell a product in quantity increments.  Sure, you could make it a “Package of 5″ and sell them that way, but if you need to track inventory that’s not going to be the best solution.  ShopSite doesn’t have a feature for quantity increments but it’s easy to add with just a little JavaScript.

ShopSite Pro’s CheckIt Function

ShopSite has feature called “CheckIt” which is a javascript process which runs on the shopping cart and checkout pages.  It is used for validating data and with ShopSite Pro you can customize it with additional code.  This feature is required to use our Quantity Increment code, which will be placed in the “Javascript added at start of built-in CheckIt function” field on ShopSite’s Commerce Setup > Order System > Shopping Cart screen.

The Code

Below is the code to enter in that field:

var sku_regex = /^sku-test$|^sku-test2$/;
var input_match = new Array();
if (button == "8") {
  ss_jQuery(".cart_quantity input").each(function(count){
     var qnty = ss_jQuery(this).val();
        var p_name = ss_jQuery(this).parent().siblings("[class='cart_name']").html()
        if((ss_jQuery(this).val() % 5) > 0){
           error+= "You may only order product " + p_name +" in increments of 5, please adjust your quantity accordingly.\n";

There are just a couple changes to make in order to customize it for your store:

var sku_regex = /^sku-test$|^sku-test2$/;

Change that line to be a list of the SKUs which you want to limit.  You can add as many as you want, as long as they are in the same format.  For example if you want to limit SKUs “abc”, “123” and “xyz” the line would be:

var sku_regex = /^abc$|^123$|^xyz$/;

This line controls the increment that you want to use:

if((ss_jQuery(this).val() % 5) > 0){

Change the “5” in that line to the number you want the product to sell by.  Below that line is the “error” message which is displayed to the customer which also includes the number.  So be sure to also update that message with the correct number and feel free to change the message if you would like to adjust the wording.

That’s all there is to it.  Just be sure to test your store in a couple different browsers to make sure everything is working correctly and that the increments are working the way you want.

Let’s Try A Sample

To see a sample of what this looks like click on the link below to add a test product to our demo store.  This product sells only in increments of 5, so if you set the quantity to a value not evenly divisible by 5 you will see the error appear and you will not be able to checkout:

Add Test Product To Cart

Once you adjust the quantity to a valid number you will be able to continue to the checkout screen.

Advanced Options

If you end up needing many different increments for different products, the code above could be expanded with additional functionality.  For example you could use an extra product field to store the increment value and then modify the code above to loop through the products in the cart checking the value of the extra field.  If the value is greater than 0 it then runs the code to check the increment based off the field value, otherwise it skips over the product and moves on to the next one.


Looking for a web host that understands ecommerce and business hosting?
Check us out today!

Leave a Reply