Skip to main content

​
Khaime Cart Page

The [khaime_cart] shortcode renders a full Khaime-powered cart page. It shares the same cart state as the storefront’s slide-out drawer, so items stay in sync across both.
This shortcode ships inside the Khaime Storefront plugin (v2.0.0+). No separate install.

​
When you need this

By default the storefront uses an overlay drawer for the cart. Use the cart page when you want:
  • A standalone /cart page that shoppers can bookmark or link to.
  • A pre-checkout review step instead of the drawer.

​
Basic Usage

​
Wiring it to the storefront

The cart page only becomes the destination of the cart icon when the storefront is configured to use it. Set Cart display in Settings → Khaime (or pass cart_display on [khaime_storefront]) to one of:
page mode requires a published page containing [khaime_cart] at the configured Cart Page URL — otherwise clicking the cart icon 404s.
The legacy both mode was retired in v2.0.0. Stores still set to both are automatically mapped to page on save.

​
Setup

  1. Create a WordPress page with slug cart (URL: /cart).
  2. Paste [khaime_cart] into the page content.
  3. In Settings → Khaime, set Cart display to page.
  4. Ensure Cart Page URL matches the page slug (default /cart).

​
Full Example

​
Attributes

Theme is inherited from your merchant bootstrap config. There’s no per-shortcode theme override — styling stays consistent with the storefront.

​
Behavior

  • Live sync — items added/removed anywhere (drawer, storefront product cards, cart page) update everywhere the cart is visible.
  • Empty state — shows the empty_message with a “Continue shopping” link routing to continue_url.
  • Checkout — “Proceed to checkout” opens the same checkout modal used by the drawer.

​
CSS Customization

Cart surfaces use ks-cart-* class names: