Understanding common front-end functionality

Understand the common frontend functionality, and what to expect from each page on the frontend.

There are key points in the customer journey, where specific information is displayed on the front-end. When building a custom solution, it's important to understand these pages and the data displayed there.

📘

Platform

  • Custom

Common frontend functionality

Type

Front-end page

Data displayed

Functionality

Product

Product page

Purchase option selector (Subscribe and one-time, subscription only, or prepaid)
Subscription frequency
Subscription discount

Add to cart functionality for the subscription

Cart

Cart pop-up after the customer adds a product to the cart

Subscription frequency
Product subscription with the discounted price listed (if applicable)
Cart subtotal with discounted prices (if applicable)

Subscription checkout button

Cart

Cart preview

Product subscription discounted price a subscribe and save discount is present

Subscription checkout button

Cart

View cart summary

Subscription frequency by product (This is only shown if a discount is not applied. If a discount is applied, the Subscribe and Save option is visible)
Price: The product subscription price (with the discount listed if applicable)
Estimated total: The product line items total (with discounts accounted for if applicable)
Subtotal: The cart subtotal (with discounts accounted for if applicable)
Estimated grand total: The total including tax (which is hidden from the cart summary), including subscribe and save discounts

Subscription checkout button

Checkout

Subscription checkout button

Product
Order quantity
Option to checkout or view cart

If subscription items are preset, customers are redirected to the Recharge Checkout
Call your platform's API endpoint to retrieve the contents of the cart
Call local storage for subscription information before posting the combined cart data to Recharge

Customer portal

Account - Manage subscriptions

List of active subscriptions and subscription details
Customer account information including shipping address, and contact information

Link to Recharge-hosted cutomer portal if the customer has subscriptions


Need Help? Contact Us