Custom Formatting
If you are knowledgeable with CSS, you can easily add some custom style to your conditional fields. Each field will be set with a unique CSS id that can be added to your theme’s style.css, or some other CSS plugin.
- Every field is wrapped in a
div
with#conditional_checkout_field_pro_XX
- Every Title is wrapped in a
div
tag, with classconditional_checkout_field_pro_field_title
. - Labels and input areas (text box, text area, etc.) are wrapped in a
p
tag with#conditional_field_XX-YY_field
. - Input areas have
#conditional_field_XX-YY
The XX
is a placeholder for the field ID, which can easily be identified by the number in the beginning of the row below.
The YY
is a placeholder for the repeat number of the field. For example, if the field repeats 3 times, the IDs would look like #conditional_field_1-1_field
, #conditional_field_1-2_field
, and #conditional_field_1-3_field
Alternatively, on your checkout page you can right click on a field and select “Inspect Element” in most browsers to get a closer look at the styles you can work with.