Conference Tickets

Pricing boxes for a category of ticket products, each with a quantity select and a live add-to-cart link. It is shown in the block inserter as Canvas Conference Tickets and registered as canvas-core/conference-tickets.

Select the block on a page and its own settings open in the sidebar, in the panels below:

Settings

Each setting is named exactly as the block editor names it, followed by what it does and what it starts as. Where a setting carries a Shown when line, it stays hidden until that condition is met, which is the usual reason a setting looks missing from the sidebar:

Query

• Product Category SlugDefaultEmpty

  Only products in this category are shown. Empty shows every product.

• TicketsDefault0

  0 shows every product in the category.

• Order ByDefaultMenu Order

  What decides the sequence tickets appear in: the order you arranged them in, the ticket name, or when each was published. Arranging them yourself is the usual choice, so the tiers read cheapest first.

  ChoicesMenu OrderTitlePublished Date

• OrderDefaultAscending

  Whether that sequence runs forwards or backwards.

  ChoicesAscendingDescending

Layout

• Row ClassesDefaultrow pricing align-items-center

  Style classes on the row that holds the pricing boxes.

• Column ClassesDefaultcol-lg-3 col-sm-6

  Style classes on the column each pricing box sits in. This is what decides how many boxes fit across the row at each screen width.

• Columns on Small ScreensDefault2

  Used to decide which cards need a stacking top margin.

• Columns on Large ScreensDefault4

  Used to decide which cards need a stacking top margin.

• Stacking Margin ClassDefaultmt-4

  Top margin added to every card that wraps onto a new row. Empty adds none.

Display

• Pricing Box ClassesDefaultpricing-box text-center

  Style classes on each pricing box, which is what draws the panel and centres everything inside it.

• Sold-Out Box ClassesDefaultdisabled

  Added to the box of a ticket that is out of stock.

• Title Block ClassesDefaultpricing-title title-sm

  Style classes on the band at the top of a pricing box that carries the ticket name and its note.

• Ticket Name TagDefaultH3

  Which heading level a ticket name uses, so the wall fits the outline of the page around it. The look is set by the classes below, not by this.

  ChoicesH2H3H4H5

• Ticket Name ClassesDefaulttext-transform-none ls-0

  Style classes on the ticket name. The default keeps it as typed rather than in capitals.

• Validity Note ClassesDefaulttext-transform-none

  Applied to the note beneath an available ticket name.

• Sold-Out Validity Note ClassesDefaultEmpty

  Applied instead when the ticket is out of stock, so a closed tier can read differently.

• Price ClassesDefaultpricing-price font-primary fw-bold

  Style classes on the price, which is what sets it large and bold in the heading typeface.

• Per-Ticket Price Class SuffixDefault-pricing

  Appended to each ticket slug to give its price its own class hook. Empty adds none.

• Currency Symbol ClassesDefaultprice-unit

  Style classes on the currency symbol in front of the price, which is what raises it and sets it smaller than the figure.

• Price DecimalsDefault0

  Decimal places shown on the ticket price.

Quantity

• Quantity Block ClassesDefaultpricing-persons

  Style classes on the block holding the how many control inside a pricing box.

• Quantity Select ClassesDefaultrequired form-select

  Style classes on the how many picker itself. The default styles it as a form control and marks it as one the visitor has to answer.

• Quantity Field Name BaseDefaultTicket slug

  Which name each quantity control is submitted under, so the receiving form can tell one ticket tier from another.

  ChoicesTicket slugTicket price class hook

• Quantity Field Name SuffixDefault-person

  Appended to each ticket slug to name its quantity control.

• Maximum QuantityDefault8

  The largest number a visitor can pick, and so how many choices the how many picker offers.

• Quantity Label (one)Default%d Person

  Use %d for the number.

• Quantity Label (many)Default%d Persons

  Use %d for the number.

Button

• Button Block ClassesDefaultpricing-action px-5

  Style classes on the block at the foot of a pricing box that holds the button.

• Button TextDefaultBuy Ticket

  Wording on the button while the ticket is available.

• Sold-Out Button TextDefaultBuy Ticket

  Wording on the button once the ticket is out of stock, so a closed tier can say so rather than still invite a purchase.

• Button ClassesDefaultbutton ls-1 text-uppercase fw-semibold button-large button-gradient w-100 m-0

  Style classes on the button, which is what makes it large, filled with the colour blend and the full width of the box.

Related

Every Canvas block also carries the Animation, Scroll Effects and Advanced panels, which are described in Controls every Canvas block has.

Other blocks in WooCommerce: Add to Cart, Cart Table, Cart Totals, Checkout Billing, Checkout Order Review, Cross-Sells.