Home Forums Front-end Issues Add Class and ID to Tab Field Reply To: Add Class and ID to Tab Field

  • There are 2 parts to a tab field, the tab button and the tab field which is actually hidden. You can add a wrapper class and ID to the tab field using a filter.

      add_filter('acf/load_field/key=field_584024f7f7cfe', 'add_class_to_my_tab');
      function add_class_to_my_tab($field) {
        //echo '<pre>'; print_r($field); echo '</pre>';
        $field['wrapper'] = array(
          'width' => '',
          'class' => 'my-tab-class',
          'id' => 'my-tab-id'
        return $field;

    There isn’t any way to add a class or id to the tab button.

    The tab field is different from other fields because it is split into 2 parts, the tab button and the tab field.

    If you want to target the tab button for something like CSS or JS then you’d need to use a selector that looks something like


    You could also target the tab wrapper of the field itself with a selector like