Use Preview Mode to test your Blackcart Try Before You Buy integration

What Is Preview Mode?

Use Cases:

• View the user experience end-to-end before you go live — shopping, checkout, emails, and returns experience
• Verify that Try Before You Buy (TBYB) elements are functioning, placed, and styled according to your guidelines
• Train your Customer Service team — understand what orders look like in the Merchant Portal, and in Shopify, throughout an order's life-cycle
• Preview changes to your (published or unpublished) storefront before activating Blackcart.
• Enable stakeholders who don’t have access to the merchant portal to preview the customer experience before launching live.

What does Preview Mode not test?

• Stripe integration
• EasyPost integration
• Shopify returns integration

Getting Started - How to use Preview Mode

Launching Preview Mode

1. To enter Preview Mode, you will need to first log into your merchant portal.
2. Once logged in, proceed to the Preview Mode section found on the left Navigation Bar.
3. Here on the Preview Mode page, use the drop-down menu to select the theme you would like to preview.
   • If the theme you select does not have a valid Blackcart integration, you will see an error. Check you have chosen the correct theme, and that the Blackcart SDK Javascript is being loaded correctly.
4. Once you have selected the correct theme, you will have the ability to launch Preview Mode, or copy the link and share it with colleagues.
   • Links are valid for up to seven days at which point they will expire and will require a new link.
5. Click the Launch Preview button to be directed to your storefront in Preview Mode: where you’ll be able to start reviewing the customer experience.

Storefront

1. Proceed to the product page of any item enabled for TBYB. Here you should be able to view the new TBYB CTA found on this page, and interact with it.
   • To learn more about enabling products for TBYB, visit this article.
2. Click the TBYB CTA to add the item to your cart.
3. Check your cart drawer (if available) and your cart page (if available) to ensure that the item is showing up labeled as Try Before You Buy and that all other cart elements such as item price, item total, and cart subtotals are showing up correctly here as well.
4. Add as many other items to your cart as desired, and when you are ready to test checkout, select the checkout button on your cart. You should then be directed to the Blackcart Checkout.

Blackcart Checkout

1. From the first page of checkout, enter a valid phone number, email address, and shipping address in order to proceed further.
2. You will be required to verify your phone number via SMS
3. After verification, you'll be directed to the second checkout page where you will enter payment information.

• Successful Card - Payment is successful, the customer will be redirected to the confirmation page
• Invalid Card - Customer entered an invalid card (postal code mismatch)
• Fraud Failure - Customer payment was flagged for Fraud and will be given the option to pay through the conventional checkout.

1. Enter the credit card number:
   • Choose which card to use from the Preview Mode toolbar, and click to Copy the card number to your clipboard
   • Paste the card number in the Card Number field
2. Expiration Date: Enter any future date
3. Name: Enter any name
4. CVV/CVC: Enter any three-digit number
5. Click the Place Order button

Order Confirmation

1. After a successful transaction, the customer will be directed to the checkout confirmation page.
   • From here, you can use the Preview Mode toolbar to take you directly to the Customer Portal to preview the keep and/or returns experience.
   • You will also receive an email notification from no-reply@blackcart.com with the following subject line “Your {merchant store name} order {order no} confirmation!”
2. The order will also be placed in your Shopify Order Admin as well as in the Blackcart Merchant Portal with a "Test Order" moniker to help identify what is a test order.
3. Also note the same Order Number found in your Shopify Admin. If you have an automated 3Pl, you may need to intervene as the order in Shopify will be marked as paid at some point.

Fraud Rejection

Customer Portal

1. You can access the Customer Portal through the link included in your order confirmation email or access the customer portal link within the order details page in the Merchant Portal.
2. The Preview Mode toolbar will be visible in the Customer Portal and will enable you to move the order through the full TBYB lifecycle.
3. When you have reviewed the Customer Portal proceed to select the action found on the toolbar to move the order status.
   • For more information on different order statuses, click here.
4. This action will trigger the email associated with the order status. The order status in the Merchant Portal should also update accordingly.
   • For more information on different transactional emails that will be sent through preview mode, click here.
5. Continue on through the various statuses to trigger the respective emails associated with the order status.
   • Note that you cannot move orders backward, only forwards, for example: You cannot move an order in Trial In Progress status back to Processing.