在Drupal7窗体中创建垂直选项卡是一项简单的任务，但是为了满足设计需要，我们有时不得不使用不同的样式。
例如，可能需要水平选项卡。
对于购物车签出这样的页面来说，这一点更有意义。
其中需要在Drupal内核之外寻找解决方案，因为在core中水平标签并不容易获得。

但是contrib模块发挥作用来释放Drupal核心的限制。
在这篇博文中，我将揭示一种使用fieldgroupcontrib模块创建水平选项卡的Drupal方法。

注意，还有一个contrib模块具有类似的名称，它现在已经过时了。

这个模块以一种安静的方式提供了一种新的表单API类型，基本上是与字段(也称为CCK)一起使用的。
但是没有任何文档或者API引用来展示它的用法，以便在定制表单中利用它们。

经过一些代码演练&一些跟踪和错误的努力，我能够理解它的用法，它与core中的垂直选项卡非常相似。

下面的代码片段来自测验模块,

if (function_exists('userpoints_userpointsapi') && variable_get('quiz_has_userpoints', 1)) {
  $form['userpoints'] = array(
    '#type' => 'fieldset',
    '#title' => t('Userpoints'),
    '#collapsible' => TRUE,
    '#collapsed' => FALSE,
    '#group' => 'additional_settings',
  );
  $form['userpoints']['has_userpoints'] = array(
    '#type' => 'checkbox',
    '#default_value' => (isset($node->has_userpoints) ? $node->has_userpoints : 1),
    '#title' => t('Enable UserPoints Module Integration'),
    '#description' => t('If checked, marks scored in this @quiz will be credited to userpoints. For each correct answer 1 point will be added to user\'s point.', array('@quiz' => QUIZ_NAME)),
  );
  $form['userpoints']['userpoints_tid'] = array(
    '#type' => 'select',
    '#options' => _quiz_userpoints_type(),
    '#title' => t('Userpoints Category'),
    '#states' => array(
      'visible' => array(
        ':input[name=has_userpoints]' => array('checked' => TRUE),
      ),
    ),
    '#default_value' => isset($node->userpoints_tid) ? $node->userpoints_tid : 0,
    '#description' => t('Select the category to which user points to be added. To add new category see <a href="!url">admin/structure/taxonomy/userpoints</a>', array('!url' => url('admin/structure/taxonomy/userpoints'))),
  );
}

对于任何Drupal开发人员来说，这段代码都应该是不言自明的，但简单地说，如果启用了Userpoints模块，我们基本上是在测试节点表单中定义一个新的字段集。

键值"#group"=>"添加设置"将此字段集转换为垂直选项卡项。

这是它在节点窗体中的外观，

现在要将drupal7中的(CCK)字段转换为水平制表符样式，我们需要安装上述字段组模块，并在所需的内容类型中创建包装器字段类型。
例如，请参见下面的快照，

管理文章内容类型的字段页

字段组模块有足够的指针来处理字段。

更多的管理域页面快照可以在项目页面的"另外屏幕截图和视频"部分找到。

本模块的有趣之处在于将水平选项卡添加到自定义表单中，这可以通过使用字段组中定义的新表单api类型"Horizontal_tabs"来实现(但没有正确记录)。

请参见下面的代码以显示其用法，

<?php
$form = array();
$form['my_field'] = array(
  '#type' => 'horizontal_tabs',
  '#tree' => TRUE,
  '#prefix' => '<div id="unique-wrapper">',
  '#suffix' => '</div>',
);
$items = array(
  array(
    'nid' => 1,
    'name' => 'Item 1'
  ),
  array(
    'nid' => 2,
    'name' => 'Item 2'
  ),
  array(
    'nid' => 3,
    'name' => 'Item 3'
  ),
  array(
    'nid' => 4,
    'name' => 'Item 4'
  ),
);
$counter = 1;
foreach ($items as $item) {
  $nid = $item['nid'];
  $form['my_field']['stuff'][$nid] = array(
    '#type' => 'fieldset',
    '#title' => t('Item @no', array('@no' => $counter)),
    '#collapsible' => TRUE,
    '#collapsed' => TRUE,
  );
  $form['my_field']['stuff'][$nid]['form']['item_id'] = array(
    '#type' => 'value',
    '#value' => $item['nid'],
  );
  $form['my_field']['stuff'][$nid]['form']['item_name'] = array(
    '#type' => 'value',
    '#value' => $item['name'],
  );
  $form['my_field']['stuff'][$nid]['form']['remove'] = array(
      '#type' => 'checkbox',
      '#title' => t('Remove this item'),
      '#weight' => -51,
  );
  //more field definition
  $form['my_field']['stuff'][$nid]['form']['#tree'] = TRUE;
  $form['my_field']['stuff'][$nid]['form']['#parents'] = array('my_field', 'stuff', $nid, 'form');
  $counter++;
}

上面的代码片段试图提供一个实际的示例来利用方便的表单api类型。
代码应该是不言自明的，并且可以通过在任何formbuilder/formalter函数中复制粘贴来进行扩展。