Skip to product information
Heart Sneakers
  • Heart Sneakers
  • Heart Sneakers
Heart Sneakers

Heart Sneakers

£800.00

Dev details for Order Goal PDP Widget

1. Cart Updates

The widget listens to cart:update events from the theme. When the cart updates:

  • The progress bar is updated to reflect the new cart sub-total.
  • The tier messages are updated to reflect the new cart sub-total.

The progress bar updates' progress is relative to the tier that is currently being reached, resulting in a smoother progress bar animation that is more indicative of the actual progress towards the next tier.

2. Events Dispatched

This widget dispatches the following custom events:

Event: discount-kit:widget:mount

Fired when the widget is initialized and mounted to the DOM. Example payload:

{
  "detail": {
    "resource": {
      "widgetType": "order-goal-pdp",
      "widgetId": "order-goal-pdp-23830276202",
      "currentTier": {
        "tierLevel": 1,
        "minSpendCents": 10000,
        "discountAmount": 1000,
        "discountType": "percentage",
        "message": "10% off"
      },
      "cartTotalCents": 10000
    }
  }
}
Event: discount-kit:order-goal:tier-change

Fired when a tier is selected or changed. Includes both previous and current tier details. Example payload:

{
  "detail": {
    "resource": {
      "widgetId": "order-goal-pdp-23830276202",
      "widgetType": "order-goal-pdp",
      "previousTier": {
        "tierLevel": 1,
        "minSpendCents": 10000,
        "discountAmount": 10,
        "discountType": "percentage",
        "message": "10% off"
      },
      "currentTier": {
        "tierLevel": 2,
        "minSpendCents": 20000,
        "discountAmount": 20,
        "discountType": "percentage",
        "message": "20% off"
      },
      "cartTotalCents": 20000
    }
  }
}
Event: discount:update (Theme-level)

Fired for broader theme integrations. Same payload as tier-change above, but uses the theme's standard discount:update event name.

Event: discount-kit:widget:unmount

Fired when the widget is disconnected from the DOM. Same structure as widget:mount.

Note: All events bubble, so you can listen on document or any ancestor element.

Spend £100 more to save 10% on your order!

Save 10%
when you spend £100+
Save 20%
when you spend £200+

Introducing the Heart Sneakers, stylish footwear that offers comfort and support. With their unique heart design, these sneakers are sure to turn heads and show off your personal style while providing superior cushioning and durability. Perfect for any casual or sporty occasion.

You may also like