Installing dropins

Dropins are designed for the browser’s JavaScript run-time without the need for a bundler. But they can also be installed and executed in a build-time environment with bundlers like Webpack and Vite. The installation steps for both run-time and build-time environments are the same after the initial dropin package imports.

Why install dropins?

Installing dropins is essential for customizing and enhancing your Adobe Commerce storefront, especially if you choose not to start with the boilerplate template. It is a strategic choice for businesses looking to customize, optimize, and scale their Adobe Commerce storefronts effectively. This approach provides the flexibility and modularity needed to create a unique and high-performing online shopping experience.

If you have an existing storefront project and are not starting with the boilerplate template, you can install dropins individually to add the specific features that you need.

Workflow

The following diagram provides an overview of the steps necessary for installing a dropin:

The installation of all dropins follows the same pattern described in the workflow diagram above. Refer to the following resources for step-by-step instructions to install specific dropins:

• Product Details Page (PDP)
• Cart