Standard Booking Form Field Shortcodes

This article explains how to use the standard booking form field shortcodes in Booking Calendar’s Advanced (CF7-style) form mode. These shortcodes define the fields users fill out when making a booking. You can customize them with parameters for default values, placeholder text, sizes, CSS styling, and more.

What’s inside

  1. Text field – [text]
  2. Textarea – [textarea]
  3. Select box – [selectbox]
  4. Checkbox – [checkbox]
  5. Radio buttons – [radio]
  6. Captcha – [captcha]
  7. Submit button – [submit]
  8. Additional field parameters
  9. Using “Content of booking fields data” form

1) Text field – [text]

Single-line text input.

Minimal example:

[text first_name ""]

Example with size, maxlength, placeholder, and CSS class:

[text firstname 10/30 id:fname class:input-lg placeholder:Your_name "John"]
  • 10 = size (optional)
  • 30 = maxlength (optional)
  • placeholder:Your_name — underscores replace spaces

2) Textarea – [textarea]

Multi-line text area.

Minimal example:

[textarea comments ""]

Example with columns, rows, placeholder:

[textarea details 40/5 placeholder:Enter_details_here]
  • 40 = columns (optional)
  • 5 = rows (optional)
  • placeholder:Enter_details_here — underscores replace spaces

3) Select box – [selectbox]

Dropdown menu for single choice.

Overview & option values (Title@@Value)

Each option has a display title and an optional stored value in Title@@Value format. If no

@@Value

is given, the title is used as value.

Minimal example:

[selectbox service "Cleaning" "Consultation" "Other"]

Example with default value and custom IDs/classes:

[selectbox service default:CONSULT id:svc class:input-md
"Cleaning@@CLEAN" "Consultation@@CONSULT" "Other@@OTHER"]

4) Checkbox – [checkbox]

Multiple selectable options (user can choose several).

Overview & option values (Title@@Value)

Same Title@@Value format as select boxes. Note: The default: parameter supports only a single value for checkboxes.

Minimal example:

[checkbox extras "WiFi" "Parking" "Breakfast"]

Example with default and stored values:

[checkbox extras default:opt_wifi
"WiFi@@opt_wifi" "Parking@@opt_parking" "Breakfast@@opt_breakfast"]

5) Radio buttons – [radio]

List of mutually exclusive options (user picks one).

Overview & option values (Title@@Value)

Same Title@@Value format as select boxes. Use default: with the stored value you want pre-selected.

Minimal example:

[radio gender "Male" "Female"]

Example with default and stored values:

[radio gender default:option_b "Option A@@option_a" "Option B@@option_b"]

6) Captcha – [captcha]

Generates a built-in anti-spam verification code.

Minimal example:

[captcha]

7) Submit button – [submit]

Button to send the booking form.

Minimal example:

[submit "Send Booking"]

Example with ID and class:

[submit id:submit-btn class:btn-primary "Book Now"]

8) Additional field parameters

  • id:HTMLID — custom HTML id attribute.
  • class:CSS_CLASS — custom CSS class for styling.
  • placeholder:Your_text — for text/textarea; use underscores for spaces.
  • use_label_element — wraps inputs in <label>.
  • label_first — shows label before input (for radio/checkbox).
  • Size & maxlength: size/maxlength for text; cols/rows for textarea.

9) Using “Content of booking fields data” form

This form is located at the bottom of WP Booking Calendar → Settings → Booking Form → Booking Form Fields (right after the booking form configuration form).

It defines how booking data appears in:

  • The “Booking Data” column on the booking listing page.
  • Email templates when you use the [content] shortcode.

Rules:

  • Use [field_name] to insert the value of a specific booking form field.
  • You can use HTML for formatting (e.g., <b>, <br>), but avoid heavy layouts.
  • Each [field_name] must match the field name from your booking form configuration above.

Example:

<div class="standard-content-form">
<b>First Name</b>: <f>[name]</f><br>
<b>Last Name</b>: <f>[secondname]</f><br>
<b>Email</b>: <f>[email]</f><br>
<b>Phone</b>: <f>[phone]</f><br>
<b>Adults</b>: <f>[visitors]</f><br>
<b>Children</b>: <f>[children]</f><br>
<b>Details</b>: <f>[details]</f>
</div>