Skip to content

<dpd-cart-button>

<dpd-cart-button> is a cart icon with a badge for the number of items in the cart. Clicking it opens the cart drawer. Most sites put one in the header.

<dpd-cart-button></dpd-cart-button>
<dpd-cart-button label="Cart"></dpd-cart-button>
Attribute
label Text to show beside the icon. Screen readers hear it with the item count (“Cart, Items: 2”).
store The store’s cart. See More than one store.

You can also put the label inside the element, like <dpd-cart-button>My bag</dpd-cart-button>, if you want markup in it.

Its parts are button and badge.