Bricks 2.4 Beta: Is it possible to apply styles for each {woo_order_status} state?

How To
1

Hi,

Is there a way to style {woo_order_status} based on the status? For example, a green style for “In Progress,” black for “Completed,” etc.?

3

Hi,
You can use separate status badge elements and show each one with an Element Condition.

For each status:

  1. Add a Text Basic element with {woo_order_status}.
  2. Style that element for that one status.
  3. Add an Element Condition using Dynamic data {woo_order_status:value} and compare it to the WooCommerce status slug, for example processing, completed, on-hold, cancelled, refunded, or failed.

Repeat the element for each status you want to style differently. The :value filter is important here because it compares against the raw WooCommerce status value instead of the displayed label.

Docs:

1 Like