Function useNostoCheckout

useNostoCheckout(props?: NostoCheckoutProps): void

You can personalise your cart and checkout pages by using the useNostoCheckout hook.

Parameters

Optionalprops: NostoCheckoutProps

Returns void

Example: Basic cart page usage

import { useNostoCheckout } from '@nosto/nosto-react'

function CartPage() {
  useNostoCheckout({
    placements: ['cartpage-nosto-1', 'cartpage-cross-sell']
  })

  return (
    <div>
      <h1>Your Cart</h1>
      {/\* Cart items here */}
      <div id="cartpage-cross-sell" />
      <div id="cartpage-nosto-1" />
    </div>
  )
}

Example: Checkout page with recommendations

import { useNostoCheckout } from '@nosto/nosto-react'

function CheckoutPage() {
  useNostoCheckout({
    placements: ['checkout-upsell', 'checkout-last-chance']
  })

  return (
    <div>
      <h1>Checkout</h1>
      <div id="checkout-upsell" />
      {/\* Checkout form here */}
      <div id="checkout-last-chance" />
    </div>
  )
}