Creating custom Shopify Checkout experiences with Checkout UI extensions

Workshops

55 minutes remaining

1Before you begin2Prerequisites3Create a Shopify App4What are Checkout UI Extensions5Generating your Checkout UI Extension6Choose your extension point7Add a TextField Component with Checkout UI Component Library8Saving Data to Metafields9Validation and Controlling Checkout Navigation10Conclusion

Before you begin

In this workshop you will learn many of the core concepts of building a custom Shopify Checkout experiences with Checkout UI Extensions. Checkout UI extensions let you add custom workflows and functionality at defined points of the checkout process. They're built into apps using extension point APIs and UI components. You will learn by implementing a common Checkout customization, adding a custom field to collect a Resident ID. The concepts that this workshop will cover are:

  • Generating a new extension with the Shopify CLI
  • Checkout UI extension configuration
  • The different types of extension points
  • Deploying your extension to Shopify
  • Using Checkout UI extension components
  • Saving data to metafields
  • Controlling the Checkout flow

resident-id-extension