Do not sell or share my personal information Skip to content

Cart and Checkout – Checkout and place order button

The following Checkout and place order button filters are available:

  • proceedToCheckoutButtonLabel
  • proceedToCheckoutButtonLink
  • placeOrderButtonLabel

The following objects are shared between the filters:

  • Cart object
  • Cart Item object

proceedToCheckoutButtonLabel

Description

The proceedToCheckoutButtonLabel filter allows change the label of the “Proceed to checkout” button.

Parameters

  • defaultValue string (default: Proceed to Checkout) – The label of the “Proceed to checkout” button.
  • extensions object (default: {}) – The extensions object.
  • args object – The arguments object with the following keys:
    • cart object – The cart object from wc/store/cart, see Cart object.

Returns

  • string – The label of the “Proceed to checkout” button.

Code examples

Basic example

		const { registerCheckoutFilters } = window.wc.blocksCheckout;

const modifyProceedToCheckoutButtonLabel = (
	defaultValue,
	extensions,
	args
) => {
	if ( ! args?.cart.items ) {
		return defaultValue;
	}

	return 'Go to checkout';
};

registerCheckoutFilters( 'example-extension', {
	proceedToCheckoutButtonLabel: modifyProceedToCheckoutButtonLabel,
} );

	

Advanced example

		const { registerCheckoutFilters } = window.wc.blocksCheckout;

const modifyProceedToCheckoutButtonLabel = (
	defaultValue,
	extensions,
	args
) => {
	if ( ! args?.cart.items ) {
		return defaultValue;
	}

	const isSunglassesInCart = args?.cart.items.some(
		( item ) => item.name === 'Sunglasses'
	);

	if ( isSunglassesInCart ) {
		return '😎 Proceed to checkout 😎';
	}

	return defaultValue;
};

registerCheckoutFilters( 'example-extension', {
	proceedToCheckoutButtonLabel: modifyProceedToCheckoutButtonLabel,
} );

	

Filters can be also combined. See Combined filters for an example.

Screenshots

Before After
Before applying the Proceed To Checkout Button Label filter After applying the Item Name filter

proceedToCheckoutButtonLink

Description

The proceedToCheckoutButtonLink filter allows change the link of the “Proceed to checkout” button.

Parameters

  • defaultValue string (default: /checkout) – The link of the “Proceed to checkout” button.
  • extensions object (default: {}) – The extensions object.
  • args object – The arguments object with the following keys:
    • cart object – The cart object from wc/store/cart, see Cart object.

Returns

  • string – The link of the “Proceed to checkout” button.

Code examples

Basic example

		const { registerCheckoutFilters } = window.wc.blocksCheckout;

const modifyProceedToCheckoutButtonLink = (
	defaultValue,
	extensions,
	args
) => {
	if ( ! args?.cart.items ) {
		return defaultValue;
	}

	return '/custom-checkout';
};

registerCheckoutFilters( 'example-extension', {
	proceedToCheckoutButtonLink: modifyProceedToCheckoutButtonLink,
} );

	

Advanced example

		const { registerCheckoutFilters } = window.wc.blocksCheckout;

const modifyProceedToCheckoutButtonLink = (
	defaultValue,
	extensions,
	args
) => {
	if ( ! args?.cart.items ) {
		return defaultValue;
	}

	const isSunglassesInCart = args?.cart.items.some(
		( item ) => item.name === 'Sunglasses'
	);

	if ( isSunglassesInCart ) {
		return '/custom-checkout';
	}

	return defaultValue;
};

registerCheckoutFilters( 'example-extension', {
	proceedToCheckoutButtonLink: modifyProceedToCheckoutButtonLink,
} );

	

Filters can be also combined. See Combined filters for an example.

Screenshots

Before After
Before applying the Proceed To Checkout Button Link filter After applying the Proceed To Checkout Button Link filter

placeOrderButtonLabel

Description

The placeOrderButtonLabel filter allows change the label of the “Place order” button.

Parameters

  • defaultValue (type: string, default: Place order) – The label of the “Place order” button.
  • extensions object (default: {}) – The extensions object.

Returns

  • string – The label of the “Place order” button.

Code example

		const { registerCheckoutFilters } = window.wc.blocksCheckout;

const modifyPlaceOrderButtonLabel = ( defaultValue, extensions ) => {
	return '😎 Pay now 😎';
};

registerCheckoutFilters( 'example-extension', {
	placeOrderButtonLabel: modifyPlaceOrderButtonLabel,
} );

	

Filters can be also combined. See Combined filters for an example.

Screenshots

Before After
Before applying the Place Order Button Label filter After applying the Place Order Button Label filter

Cart object

The Cart object of the filters above has the following keys:

  • billingAddress object – The billing address object with the following keys:
    • address_1 string – The first line of the address.
    • address_2 string – The second line of the address.
    • city string – The city of the address.
    • company string – The company of the address.
    • country string – The country of the address.
    • email string – The email of the address.
    • first_name string – The first name of the address.
    • last_name string – The last name of the address.
    • phone string – The phone of the address.
    • postcode string – The postcode of the address.
    • state string – The state of the address.
  • coupons array – The coupons array.
  • crossSells array – The cross sell items array.
  • errors array – The errors array.
  • extensions object (default: {}) – The extensions object.
  • fees array – The fees array.
  • hasCalculatedShipping boolean – Whether the cart has calculated shipping.
  • items array – The cart items array with cart item objects, see Cart Item object.
  • itemsCount number – The number of items in the cart.
  • itemsWeight number – The total weight of the cart items.
  • needsPayment boolean – Whether the cart needs payment.
  • needsShipping boolean – Whether the cart needs shipping.
  • paymentMethods array – The payment methods array.
  • paymentRequirements array – The payment requirements array.
  • shippingAddress object – The shipping address object with the same keys as the billing address object.
  • shippingRates array – The shipping rates array.
  • totals object – The totals object with the following keys:
    • currency_code string – The currency code.
    • currency_decimal_separator string – The currency decimal separator.
    • currency_minor_unit number – The currency minor unit.
    • currency_prefix string – The currency prefix.
    • currency_suffix string – The currency suffix.
    • currency_symbol string – The currency symbol.
    • currency_thousand_separator string – The currency thousand separator.
    • tax_lines array – The tax lines array of objects with the following keys:
      • name string – The tax name.
      • price string – The tax price.
      • rate string – The tax rate.
    • total_discount string – The total discount.
    • total_discount_tax string – The total discount tax.
    • total_fee string – The total fee.
    • total_fee_tax string – The total fee tax.
    • total_items string – The total items.
    • total_items_tax string – The total items tax.
    • total_price string – The total price.
    • total_shipping string – The total shipping.
    • total_shipping_tax string – The total shipping tax.
    • total_tax string – The total tax.

Cart Item object

The Cart Item object of the filters above has the following keys:

  • backorders_allowed boolean – Whether backorders are allowed.
  • catalog_visibility string – The catalog visibility.
  • decsription string – The cart item description.
  • extensions object (default: {}) – The extensions object.
  • id number – The item ID.
  • images array – The item images array.
  • item_data array – The item data array.
  • key string – The item key.
  • low_stock_remaining number – The low stock remaining.
  • name string – The item name.
  • permalink string – The item permalink.
  • prices object – The item prices object with the following keys:
    • currency_code string – The currency code.
    • currency_decimal_separator string – The currency decimal separator.
    • currency_minor_unit number – The currency minor unit.
    • currency_prefix string – The currency prefix.
    • currency_suffix string – The currency suffix.
    • currency_symbol string – The currency symbol.
    • currency_thousand_separator string – The currency thousand separator.
    • price string – The price.
    • price_range string – The price range.
    • raw_prices object – The raw prices object with the following keys:
      • precision number – The precision.
      • price number – The price.
      • regular_price number – The regular price.
      • sale_price number – The sale price.
    • regular_price string – The regular price.
    • sale_price string – The sale price.
  • quantity number – The item quantity.
  • quantity_limits object – The item quantity limits object with the following keys:
    • editable boolean – Whether the quantity is editable.
    • maximum number – The maximum quantity.
    • minimum number – The minimum quantity.
    • multiple_of number – The multiple of quantity.
  • short_description string – The item short description.
  • show_backorder_badge boolean – Whether to show the backorder badge.
  • sku string – The item SKU.
  • sold_individually boolean – Whether the item is sold individually.
  • totals object – The item totals object with the following keys:
    • currency_code string – The currency code.
    • currency_decimal_separator string – The currency decimal separator.
    • currency_minor_unit number – The currency minor unit.
    • currency_prefix string – The currency prefix.
    • currency_suffix string – The currency suffix.
    • currency_symbol string – The currency symbol.
    • currency_thousand_separator string – The currency thousand separator.
    • line_subtotal string – The line subtotal.
    • line_subtotal_tax string – The line subtotal tax.
    • line_total string – The line total.
    • line_total_tax string – The line total tax.
  • type string – The item type.
  • variation array – The item variation array.

Last updated: July 10, 2024