Shop Components

The Subscription Add-on allows your customers to conveniently purchase your products as subscriptions to receive them on a regular, scheduled basis.

After defining the subscription options in the Panel, the Shop components will allow customers to create and manage their subscriptions. To integrate the subscription components into your shop, add them in the Panel via Storefront > Integrations > Subscriptions.

Product Detail Page

Based on the defined subscription options in the product attributes, the Product Detail Page will display a component that allows the customer to choose between a one-time delivery and subscribing to the product. If the customer opts for a subscription, they can choose the delivery interval and the preferred delivery date.

For the subscription component to be displayed on the Product Detail Page, the Subscription_Eligibility attribute of the product/variant needs to be set to true. The interval options displayed on the Product Detail Page are defined by the attributes in the Subscription_Available_Intervals attribute group that are set during the Configuration of the Add-on.

To ensure that the defined subscription (selected interval and selected delivery date) is displayed during the Checkout process, configure the displayData to include the subscriptionDefintion, see: Composable.

Account Area - Subscription Management

After configuring the Subscription web components in your Storefront (Storefront > Integrations > Subscriptions > Configuration), your customers can manage their subscription via a dedicated section in the account area.

The Overview page will show them a list of their existing subscriptions, the status of each subscription and an overview of the products included.

The Detail page for each subscription allows your customers to change the status of their subscription, switch to a different interval or move the delivery date of their next subscription order.

Cancellation Component

In addition to the Product Detail Page and the Account Area, the Add-on offers the option to the customer to cancel their subscription without logging into their account.

For the implementation of the cancellation component please follow the process outlined in Storefront > Integrations > Subscriptions. Once the component is ready and the cancellationPagePath has been set, the link to a cancellation page can be added in the footer of the shop.

Navigate to Shops > Storefront > Navigation and select Footer. Click + to add a new link to the footer of the shops. Fill in the required information and set the Target URL to the cancellationPagePath.

After the customer submits their name, email address and the Subscription Id of the subscription that should be cancelled and selects a cancellation reason, we validate that a subscription with this combination of email address and Subscription Id exists and inform the customer about the successful cancellation via email.