Show Customization Image inside Checkout Page
Show design in Checkout Page

As of 2023, Shopify no longer use the file checkout.liquid to render the Checkout Page. Shopify has since been moved to Checkout Extensibility - a new foundation for checkout that is more secure, performant, upgrade-safe, and customized using apps.
Teeinblue is now compatible with this new flow as well.
You will have to be a Shopify Plus user to use the Checkout Extensibility feature.
If you are a Shopify Plus user, please navigate to Store Settings > Customization Images > find For Checkout page block > and click on Add app block button

After that, you will be then re-directed to your Theme's Checkout Page settings.
In this Page, under Order Summary section, please click on Add app block button, and select the Customization Image Preview

Once you're done, it will look like this:

When clicking on the Teeinblue block there, you can further modify the Order Summary section. For example, the button label, preview type, etc.

Once you are done, please review the result by adding a Teeinblue product to Cart and see how it goes!
You can view each Preview Type below:
Popover

Popup

Expansible

If you find difficult to follow this instruction, please contact us for further support.
Updated on: 05/09/2024
Thank you!