Help

2 min read

Cart

Last Updated - Platform 25.0 - SDK 20.0

The Cart is a core feature of most apps, built using the Cart API, which presents the user's cart.

Cart 

# Cart
cart
bag

Navigating to the cart will switch to the cart tab if the cart is a tab.

Set up

The Cart screen is automatically set up when linked to your app.

  1. Ensure the SDK and Platform are set up following the PoqSDK set up steps.
  2. Add the PoqCart framework to your project following these steps.

By default the Cart is presented as the middle tab but often clients will want to replace this with a more engaging feature such as Swipe to Like. To allow this you can configure the app to present the Cart button globally on the navigation bar.

CartNavigationButton

  1. Open your AppModule to the didAddToPlatform or setUpCart functions.
  2. Inject the CartNavigationButton as the app-wide navigation bar button.
Container.shared.views.navigationBarButtonItem.replace { .cart }

This button can be customised or moved anywhere within your app. See the navigation button customisation docs for further details.

Vouchers & Promotions

The Cart screen supports adding vouchers using the CartService so long as the BE can support this. Vouchers requires additional API to work.

To enable vouchers:

  1. Open your AppModule to the didAddToPlatform or setUpCart function.
  2. Set the vouchers setting to true at the start of the function.
Settings.Cart.showsVouchers = true

Express Checkout Widgets

Express checkout widgets require additional API or external platform configuration to work. To add an express checkout widget:

  1. Open your AppModule to the didAddToPlatform or setUpCart function.
  2. Inject the express checkout widgets you wish to use.
Container.shared.views.checkoutWidgets.replace {[
    Container.shared.views.applePayWidget(),
    Container.shared.views.payPalWidget()
]}

Shipment Levels

From v25, the Cart supports 2 shipment levels as part of the BOPIS work.

The .checkout level changes the Cart and PDP Cart Widget to present shipment availability banners. The app defaults to a BOPIS specific banner but this can be customised to present alternate shipping eligibility. With this level the user should expect to be able to change shipment type at checkout.

The .item level changes the Cart and PDP Cart Widget to present interactive shipment selection per item. The user is able to switch between available shipment options which updates the PDP stock focus. With this level the user should expect to be able to set different shipment types per cart item.

To switch shipment levels:

  1. Open your AppModule to the didAddToPlatform or setUpCart function.
  2. Set the shipment level setting to the desired setting at the start of the function.
Settings.Cart.shipmentLevel = .checkout

Add to Cart Widget

The CartWidget is a standalone component that can be added to any screen to allow the user to add a product to cart. See the cart widget documentation for more information.

History

  • 20.0 (v25): State architecture rewrite and BOPIS (shipment levels).
  • 17.0 (v22): Added support for Cart Vouchers & Promotions.

Next steps