How can I set an order minimum for my store?

  • 0
  • 2
  • Question
  • Updated 5 years ago
  • Answered
Archived and Closed

This conversation is no longer open for comments or replies and is no longer visible to community members. The community moderator provided the following reason for archiving: Archived

Please note that while we offer this tutorial and it is tested and working at the time of creation, any customization of or support for these types of articles is outside of our scope of support.

We get a lot of questions about the ability to set a minimum order, which may be necessary in certain businesses. While you can set a minimum quantity per product in the Bigcommerce control panel, there is not currently a setting for a minimum order. This tutorial will step you through how to create one by hiding the checkout buttons until the user has reached your set minimum!
*Please note that the customer could technically still reach the checkout page by manually typing the exact URL. This workaround is simply a way to help prevent the vast majority (if not all) of your below-minimum orders from being completed.

What We'll Cover



Adjusting the stylesheet for your message.
1.)Log in to your BigCommerce Control Panel.
2.) Click on Design.

design2013-04-05_0949.png

3.) Choose the Template Files tab.

template_files2013-04-05_1006.png

4.) Scroll down to the Styles folder and expand it by clicking the plus sign.

stylesfolder2013-04-09_2133.png

5.) Once expanded, find the styles.css file and click edit.

stylesfile2013-05-19_2227.png

6.) Copy the following code to your clipboard:

.CartTotalMessage { color: #F70A16; font-size: 1.2em; font-weight: bold }
>
*The font color, size, and style can be modified to suit your needs. The above settings are simply examples.

7.) Paste the contents of your clipboard to the bottom of the file. 

cssadd2013-05-19_2153.png
8.) Save.

Back to top

Hiding checkout buttons in the cart based on total.
1.) Back in the Design section, find your cart.html file. 

cart2013-05-19_2225.png
2.) Click edit.

3.) Copy the following code to your clipboard:

<div class="CartTotalMessage"><p> Items in cart must be a total of $100 or more. Please add additional products to the cart to proceed. </p></div>
*We are using $100 minimum in this example, but you can change the value as necessary. This message will appear until the user's total reaches the set minimum, at which point the message will disappear.

4.) Paste the code you copied above the CartContent Panel (line 13 in this example, but this can vary by template).

cartmessage2013-05-19_2151.png

5.) Copy the following code to your clipboard:

<script type="text/javascript">
jQuery(document).ready(function(){
var CartTotal = '%%GLOBAL_CartItemTotal%%';
CartTotal= CartTotal.replace('$', '');
CartTotal= CartTotal.replace(',', '');
if(CartTotal >= 100.0) {
$('.CartTotalMessage').hide();
}
else {
$('.ProceedToCheckout').hide();
$('.PayPalExpressCheckout').hide();
$('.GoogleCheckout').hide();
$('#CartHeader h2 img').hide();
}
});
</script>

*We are using $100 minimum in this example, but you can change the value as necessary.

6.) Paste the contents of your clipboard after the body tag. 

cartscript2013-05-19_2159.png
7.) Save.

Back to top

Hiding checkout buttons in your pop-up based on total.
If you have the add to cart pop-up enabled, you will want to set your order minimum in the pop-up as well.

1.) Back in the Design section, find your Snippets folder and click the plus sign to expand it. 

snippets2013-04-05_09502.png
2.) Find the FastCartThickboxContent.html file and click edit.

fastcart2013-05-19_2226.png

3.) Copy the following code to your clipboard:

<script type="text/javascript">
jQuery(document).ready(function(){
var CartTotal = '%%GLOBAL_CartItemTotal%%';
CartTotal= CartTotal.replace('$', '');
CartTotal= CartTotal.replace(',', '');
if(CartTotal >= 100.0) {
$('.CartTotalMessage').hide();
}
else {
$('.ProceedToCheckout').hide();
$('.PayPalExpressCheckout').hide();
$('.GoogleCheckout').hide();
$('#CartHeader h2 img').hide();
}
});
</script>

*We are using $100 minimum in this example, but you can change the value as necessary.

4.) Paste the code you copied above at the bottom of this file.

fastcart2013-05-19_2212.png

5.) Save.

Back to top

That's it! Now you will only see the proceed to checkout buttons once the order total reaches $100 or more.

popup2013-05-19_2218.png

cartunder2013-05-19_2219.png

cartover2013-05-19_2221.png

Back to top

Photo of Drew N

Drew N, Community Manager

  • 257,406 Points 100k badge 2x thumb

Posted 5 years ago

  • 0
  • 2
Photo of Diane3938

Diane3938

  • 112 Points 100 badge 2x thumb
This reply was created from a merged topic originally titled
How do I set up a 3-item minimum order in BigCommerce?.


Selling specialty food item in 20+ flavors withing 4 categories. Want to set up a minimum 3-item order. How do I set this up and adjust shipping for multiple item orders?
Photo of Diane3938

Diane3938

  • 112 Points 100 badge 2x thumb
Thanks for your reply but not able to make this work.

The styles.css file for template brownstore lists code up to line # 1762. Your example shows that the .cartTotalMessage is found at lines #3377 to 3381.

What am I doing wrong here?
Photo of Drew N

Drew N, Community Manager

  • 257,406 Points 100k badge 2x thumb
Sorry, the line numbers vary by design. it is the .cartTotalMessage you need to find.

Drew
Photo of Diane3938

Diane3938

  • 112 Points 100 badge 2x thumb
There is no .cartTotalMessage in the styles.css file for brownstore. There is a message that displays that says there are no panels or snippets for this file. Is this preventing me from making the changes to this specific template?
Photo of Drew N

Drew N, Community Manager

  • 257,406 Points 100k badge 2x thumb
I sent you an email.
Photo of Diane3938

Diane3938

  • 112 Points 100 badge 2x thumb
Replied to email. Added as requested.
Photo of Drew N

Drew N, Community Manager

  • 257,406 Points 100k badge 2x thumb
I got it. Thank you. I will get a look at it shortly.

Drew

This conversation is no longer open for comments or replies.