Biscuits Bundles frontend UI displaying a soldout variant grid item.
Customisation Guide
In this guide we will customise Biscuits Bundles App to re-order/hide sold out grid items.
What this custom code will change:
Add custom css to change the look/position of sold out grid items
By default Biscuits Bundles displays sold out products in their original order from the bundles admin, however they are greyed out and un-clickable.
If you would like to hide your sold out grid items follow these instructions:
If you would like to reorder your sold out grid items follow these instructions:
Hide sold out grid items
Biscuits Bundles admin UI hiding any soldout variant grid items.
1. Add the Custom CSS
We can use the CSS Variable --biscuits-soldout-display to tell Biscuits app block to hide all sold out grid items by setting it to none.
CUSTOM CSS CODE
#shopify-block-{{block.id}} .biscuits-bundle-form {
--biscuits-soldout-display: none;
}
To learn more about Biscuit Bundles CSS Variables visit
Paste your edited code into the custom CSS field in the biscuits bundle app block
If you need help finding where this is follow this guide.
Reorder sold out grid items to the end
Biscuits Bundles admin UI displaying a soldout variant grid item at the end of the steps slider.
1. Add the Custom CSS
We can use the CSS Variable --biscuits-soldout-order to tell Biscuits app block to order all sold out grid items to the end of the grid/slider.
CUSTOM CSS CODE
#shopify-block-{{block.id}} .biscuits-bundle-form {
--biscuits-soldout-order: 2;
}This uses flex box property order to move all sold out grid items to the end of the list.
To learn more about Biscuit Bundles CSS Variables visit
Paste your edited code into the custom CSS field in the biscuits bundle app block
If you need help finding where this is follow this guide.
Testing
Always thoroughly test your custom JS to ensure if behaves as expected across all supported browsers and devices.
Stuck or got questions?
Use the chat widget below, or reach out to us at [email protected]
Happy coding, and thanks for teaming up with Biscuits Bundles!