Hide Mystery Box Components from Customers

Hiding Components from Customers for Mystery Boxes is Critical, as there won't be mystery left if customers can view the components before the package arrives.

Hiding components will be based upon your choice of Mystery Box Fulfillment. There are 3 Options for Mystery Box Fulfillment, Go to App Settings --> Mystery Box section, in the Order editing preference you should be able to see Regular Fulfillment, Shell Fulfillment and Create new Associated order.

Regular / Shell Fulfillment

Here you need to hide the components at individual surfaces, Now there are 2 main places where customers would know about mystery box components, one will be order status page. Customer can land here by clicking on view order button in the create new order mail sent by your store. To Hide bundles Components on Order Status Page

Navigate to the Settings page for your store.
Click on the Checkout section on the page.
Scroll down to the Order status page scripts section.
Add the following snippet to the Order status page scripts section

Next you need to hide the contents in the mails that are sent to the customers like Shipping Mail, Order Cancellation Mail, Order Refund Mail sent to the customers, To do this Follow these steps

Navigate to the Settings page in Shopify
Go to the Notifications section
Select the email from which you want to remove line items

There are 2 variations of code snippet based upon the email in which you need to hide, not all of these emails have to be updated, you can do a subset also based upon your store's requirement for example if you don't do local pick up or local delivery, those email templates don't need to be updated.

Shipping and Local Delivery emails

This code and instructions above applies to the emails listed below:

Shipping

Fulfillment request
Shipping confirmation
Shipping update
Out for delivery
Delivered

Local delivery

Out for delivery
Delivered
Missed delivery

In the email contents, look for the following code snippet:

{% for line in fulfillment.fulfillment_line_items %}

Right below the start of the for loop highlighted above, add the following liquid code snippet

Orders and Local pickup emails

This code and instructions above applies to the emails listed below:

Order

Order confirmation
Order edited
Order invoice
Order canceled
Order refund
Draft order invoice
Email cart from POS
Abandoned checkout
POS and mobile receipt

Local pickup

Ready for pickup
Picked up

In the email contents, look for the following code snippet:

{% for line in subtotal_line_items %}

Right below the start of the for loop highlighted above, add the following liquid code snippet

Limitations of Regular / Shell Mystery Box Fulfillment

Child Items need to be hidden at per surface using code snippets , if order comes from outside of your shopify storefront for example Shop app, we can't control how these 3rd party marketplaces show orders and modifying order status page on these 3rd party surfaces won't be possible.

Associated Order Fulfillment

If you select Associate Order Fulfillment for Mystery Box Fulfillment, What it does is, it won't touch your original order, it will create a new associated order with details like shipping and billing address, Shipping lines and a note pointing towards Original order number for reference from original order and add mystery box components at 0 price.