The code snippet below demonstrates how to use the Advanced Custom Fields (ACF) plugin to create a conditional field that shows or hides based on the value of another field.
function wpsnippets_acf_conditional_field() {
if ( function_exists( 'acf_add_local_field_group' ) ) {
acf_add_local_field_group( array(
'key' => 'group_5f7e6e3e4b8a1',
'title' => 'Conditional Field Group',
'fields' => array(
array(
'key' => 'field_5f7e6e4b8a1',
'label' => 'Show Field',
'name' => 'show_field',
'type' => 'true_false',
'instructions' => 'Check this box to show the conditional field.',
'required' => 0,
'conditional_logic' => 0,
'wrapper' => array(
'width' => '',
'class' => '',
'id' => '',
),
'message' => '',
'default_value' => 0,
'ui' => 0,
'ui_on_text' => '',
'ui_off_text' => '',
),
array(
'key' => 'field_5f7e6e4b8a2',
'label' => 'Conditional Field',
'name' => 'conditional_field',
'type' => 'text',
'instructions' => 'This field will be shown or hidden based on the value of the "Show Field" checkbox.',
'required' => 0,
'conditional_logic' => array(
array(
array(
'field' => 'field_5f7e6e4b8a1',
'operator' => '==',
'value' => '1',
),
),
),
'wrapper' => array(
'width' => '',
'class' => '',
'id' => '',
),
'default_value' => '',
'placeholder' => '',
'prepend' => '',
'append' => '',
'maxlength' => '',
),
),
'location' => array(
array(
array(
'param' => 'post_type',
'operator' => '==',
'value' => 'post',
),
),
),
'menu_order' => 0,
'position' => 'normal',
'style' => 'default',
'label_placement' => 'top',
'instruction_placement' => 'label',
'hide_on_screen' => '',
'active' => true,
'description' => '',
) );
}
}
add_action( 'acf/init', 'wpsnippets_acf_conditional_field' );
This code creates a conditional field group using the ACF acf_add_local_field_group function. The group contains two fields: “Show Field” and “Conditional Field”. The “Show Field” is a true/false checkbox that determines whether the “Conditional Field” should be shown or hidden. The conditional logic is set up so that the “Conditional Field” is only shown when the “Show Field” is checked.
This code can be useful when you want to create dynamic forms or settings pages where certain fields should only be displayed based on the value of other fields.
Examples
Example 1: ACF conditional field not hiding/showing
This use case demonstrates how to use the Advanced Custom Fields (ACF) plugin to create a conditional field that shows or hides based on the value of another field.
function wpsnippets_acf_conditional_field() {
if ( get_field( 'field_name' ) == 'value' ) {
// Show the conditional field
the_field( 'conditional_field_name' );
}
}
add_action( 'acf/render_field/name=field_name', 'wpsnippets_acf_conditional_field' );
In this example, we use the acf/render_field action hook to check the value of a field named field_name. If the value is equal to 'value', we display the conditional field named conditional_field_name. This code should be placed in your theme’s functions.php file or a custom plugin.
Example 2: ACF conditional field with multiple conditions
This use case demonstrates how to use multiple conditions to show or hide a conditional field using ACF.
function wpsnippets_acf_conditional_field() {
if ( get_field( 'field_name_1' ) == 'value_1' && get_field( 'field_name_2' ) == 'value_2' ) {
// Show the conditional field
the_field( 'conditional_field_name' );
}
}
add_action( 'acf/render_field/name=field_name_1', 'wpsnippets_acf_conditional_field' );
add_action( 'acf/render_field/name=field_name_2', 'wpsnippets_acf_conditional_field' );
In this example, we use two conditions to determine whether the conditional field should be shown or hidden. We check the values of field_name_1 and field_name_2, and if both values match the specified values, we display the conditional field named conditional_field_name.
Example 3: ACF conditional field with OR condition
This use case demonstrates how to use an OR condition to show or hide a conditional field using ACF.
function wpsnippets_acf_conditional_field() {
if ( get_field( 'field_name_1' ) == 'value_1' || get_field( 'field_name_2' ) == 'value_2' ) {
// Show the conditional field
the_field( 'conditional_field_name' );
}
}
add_action( 'acf/render_field/name=field_name_1', 'wpsnippets_acf_conditional_field' );
add_action( 'acf/render_field/name=field_name_2', 'wpsnippets_acf_conditional_field' );
In this example, we use an OR condition to determine whether the conditional field should be shown or hidden. We check the values of field_name_1 and field_name_2, and if either value matches the specified values, we display the conditional field named conditional_field_name.