Stock on back order

Once you've installed the app, you'll be able to control the products that can be purchased when out of stock, and the quantity that can be purchased (i.e. how negative the stock count for a product can go).

You can set global back order settings within your ShopWired account that are inherited by all products unless back order settings are specified for them individually.

1. Navigate to Products > Settings
2. Navigate to the Back order settings section
3. Use the Configure out of stock products to be setting to determine the default status of out of stock products:
   • Assumed to be purchasable means that all products, unless specified otherwise, are assumed to be purchasable when out of stock
   • Assumed not to be purchasable means that all products, unless specified otherwise, are assumed not to be purchasable when out of stock
4. Use the Global quantity limit for out of stock products setting to determine the quantity of a product that can be sold when out of stock:
   • Enter only a number in this field
   • For example, configuring a value of 10 means a product's stock can go to -10 before it can no longer be added to the basket
   • The global quantity limit setting applies to all products, unless specified for a product individually

You can override the global back order settings described above for each individual product, either when creating or editing the product or using the product import system.

When creating or editing the product:

1. Navigate to the product in your ShopWired account
2. Navigate to the Stock & delivery section
3. Select the Stock on back order options tab
4. Use the The product can be purchased when out of stock setting to determine whether the product can be purchased when out of stock:
   • Default means the product inherits the global setting
   • Yes means the product is purchasable when out of stock
   • No means the product is not purchasable when out of stock
5. Use the Out of stock quantity limit setting to determine the quantity of the product that can be sold when out of stock:
   • Enter only a number in this field
   • For example, configuring a value of 10 means the product's stock can go to -10 before it can no longer be added to the basket

On the product import/export system:

• Use the column Purchasable When Out Of Stock to set the back order status with values of either default, Yes or No
• Use the column Out Of Stock Quantity Limit to set the quantity limit

Code for this app needs to be added to your ShopWired theme:

• To change your theme's default behaviour which prevents out of stock products from being added to the basket
• To modify a visitor's quantity selection to ensure they do not attempt to add more to the basket than the quantity limit allows
• To modify the display of the back in stock notification request form
• To display additional messaging on product pages and your shopping basket page
• To inform visitors the product is out of stock and on back order
• To inform visitors of a lead time (when they can expect to receive the product)
• To add this information to both product pages and your shopping basket page

Returns true if the product can be purchased when out of stock.

Returns the stock quantity limit. When product.purchasable_when_out_of_stock is false, product.out_of_stock_quantity_limit returns 0.

Will return the current stock of the product, including a negative value.

Will return the current stock of the product variation, including a negative value.

The AJAX endpoint now includes a rawQuantity property for the product / selected variation.

Other variables from the product object can also be used.

1. Locate the product_form.twig template
2. Find the code that generates the display of the "add to basket" and "out of stock" buttons. The code will usually be in the following format:
   {% if product.in_stock %} {{ html.button('cart_button', '', gts.button_add_to_basket, 'button expanded button_add-basket product-add-button ' ~ softClass,'','','','data-nostock="' ~ gts.button_out_of_stock ~ '" data-text="' ~ gts.button_add_to_basket ~ '"') }} {% else %} {{ html.button('cart_button', '', gts.button_out_of_stock, 'button expanded button_add-basket product-add-button disabled ' ~ softClass,'','','','data-nostock="' ~ gts.button_out_of_stock ~ '" data-text="' ~ gts.button_add_to_basket ~ '"') }} {% endif %}
3. Surround this code with an if statement so that it only renders if the product is not purchasable when out of stock.
   {% if product.purchasable_when_out_of_stock %} {% else %} {% if product.in_stock %} {{ html.button('cart_button', '', gts.button_add_to_basket, 'button expanded button_add-basket product-add-button ' ~ softClass,'','','','data-nostock="' ~ gts.button_out_of_stock ~ '" data-text="' ~ gts.button_add_to_basket ~ '"') }} {% else %} {{ html.button('cart_button', '', gts.button_out_of_stock, 'button expanded button_add-basket product-add-button disabled ' ~ softClass,'','','','data-nostock="' ~ gts.button_out_of_stock ~ '" data-text="' ~ gts.button_add_to_basket ~ '"') }} {% endif %} {% endif %}
4. Next, add code that runs if the product is purchasable when out of stock. Copy the code that renders the "add to basket" button, and place it within the first if statement. Within this code, locate the product-add-button class and remove it.
   {% if product.purchasable_when_out_of_stock %} {{ html.button('cart_button', '', gts.button_add_to_basket, 'button expanded button_add-basket ' ~ softClass,'','','','data-nostock="' ~ gts.button_out_of_stock ~ '" data-text="' ~ gts.button_add_to_basket ~ '"') }} {% else %} {% if product.in_stock %} {{ html.button('cart_button', '', gts.button_add_to_basket, 'button expanded button_add-basket product-add-button ' ~ softClass,'','','','data-nostock="' ~ gts.button_out_of_stock ~ '" data-text="' ~ gts.button_add_to_basket ~ '"') }} {% else %} {{ html.button('cart_button', '', gts.button_out_of_stock, 'button expanded button_add-basket product-add-button disabled ' ~ softClass,'','','','data-nostock="' ~ gts.button_out_of_stock ~ '" data-text="' ~ gts.button_add_to_basket ~ '"') }} {% endif %} {% endif %}
5. By default, when a product (or variation) is out of stock, the quantity selection is hidden. The code that renders the quantity selection will be nearby to the "add to basket" button. Locate this code and find a class of product-quantity. Change this code so that the product-quantity class only renders if the product is not purchasable when out of stock.
6. Replace product-quantity with {{ product.purchasable_when_out_of_stock ? '' : 'product-quantity' }}.
7. If you have the "Back in Stock Notifications" app installed, it will render a form on the product page if the product or its variations are out of stock. Locate this code and surround it with an if statement so that it only renders if the product is not purchasable when out of stock.
   • For themes that render a button to click:
     {% if not product.purchasable_when_out_of_stock %} {% if global.features.extensions.back_in_stock and not modal %} {{ html.button('', '', gts.button_out_of_stock, 'button large advance expanded stock-requests-container' , '', 'button', '', 'data-open="stockRequestsModal"','button_out_of_stock') }} {% endif %} {% endif %}
   • For themes that render a form:
     {% if not product.purchasable_when_out_of_stock %} {% if global.features.extensions.back_in_stock %} <div class="stock-requests-container"> <label class="field-label">Your Name</label> <input type="text" name="stock_request_name" class="required"> <label class="field-label">Your Email Address</label> <input name="stock_request_email" type="email" class="required jsv_email"> <button class="button" name="stock_request" value="1" type="submit">Send Your Request</button> </div> {% endif %} {% endif %}

You can use the custom fields app to display messaging on your website about products on back order, for example to display a lead time for each product.

When adding custom field variables to the product page, ensure that the lead time only displays when a product is out of stock by using the product.in_stock variable (which returns true if the product is in stock).

It is also helpful to include messaging on the shopping basket page. The example code below (when placed just beneath {% for item in basket.items %}) sets a back_order variable to true if at least one product in the order is out of stock and therefore on 'back order'.

You can then reference this variable, and it will only return as true where at least one product in the basket is out of stock, e.g.