Hide cancellation buttons

By default, inStore shows the options to Cancel total order and Cancel order in the Order placed page. If you want to hide these buttons, you can change the display of cancellation options by editing the checkout-instore-custom.css file. Check out the How to customize inStore guide for further information on how to access this file.

Edit the checkout-instore-custom.css file

To customize which cancellation options inStore will display, you must declare the following IDs and properties in the checkout-instore-custom.css file.

In the UI display column below, you can see where the elements you can hide are rendered in the inStore UI. You can click on each image to enlarge it.

CSS ID selector name

Description

UI display

cancel-total-order

The ID selector you can use to style the Cancel full order button. This button enables total cancellation of orders.

cancel-full-ordercancel-full-order

cancel-order

The ID selector you can use to style the Cancel order of this package button. This button enables partial cancellation of orders, which means you can cancel individual packages.

cancel-order-packagecancel-order-package

If you want to hide one or both of these elements, you must use their respective ID selector and declare the display property with the value set as none, as exemplified below.

#cancel-total-order {
    display: none;
}

#cancel-order {
    display: none;
}

Did this page help you?