Basic example of usage is this:

$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'tabs', // 'tabs' or 'pills'
        'tabs' => array(
            array(
                'label' => 'Home',
                'content' => 'Home Content',
                'active' => true
            ),
            array('label' => 'Profile', 'content' => 'Profile Content'),
            array('label' => 'Messages', 'content' => 'Messages Content'),
        ),
    )
);

Here's all configuration properties which you can set for TbTabs widget.

Basic pills

Just change its type property to pills instead:

$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'pills', // 'tabs' or 'pills'
        'tabs' => $tabs
    )
);

Stacked pills

<?php // Stacked pills
$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'pills',
        'stacked' => true,
        'tabs' => $tabs
    )
); 
?>
</div>

Justified tabs

$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'tabs',
        'justified' => true,
        'tabs' => $tabs
    )
); 
?>

Justified pills

$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'pills',
        'justified' => true,
        'tabs' => $tabs
    )
);
?>

Disabled state

For any nav component (tabs, pills, or list), add .disabled for gray links and no hover effects. Links will remain clickable, however, unless custom javascript is implemented to prevent those clicks.

$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'pills', // 'tabs', 'pills', or 'list'
        'tabs' => array(
            array('label' => 'Home', 'content' => 'Home Content'),
            array('label' => 'Profile', 'content' => 'Profile Content'),
            array(
                'label' => 'Messages',
                'content' => 'Messages Content',
                'itemOptions' => array('class' => 'disabled')
            ),
        ),
    )
);

Tabs with dropdowns

$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'tabs',
        'tabs' => array(
            array(
                'label' => 'Home',
                'content' => 'Home Content',
                'active' => true
            ),
            array('label' => 'Profile', 'content' => 'Profile Content'),
            array(
                'label' => 'DropDown',
                'items' => array(
                    array('label' => 'Item1', 'content' => 'Item1 Content'),
                    array('label' => 'Item2', 'content' => 'Item2 Content')
                )
            ),
        )
    )
);

Pills with dropdowns

$this->widget(
    'booster.widgets.TbTabs',
    array(
        'type' => 'pills',
        'tabs' => array(
            array(
                'label' => 'Home',
                'content' => 'Home Content',
                'active' => true
            ),
            array('label' => 'Profile', 'content' => 'Profile Content'),
            array(
                'label' => 'DropDown',
                'items' => array(
                    array('label' => 'Item1', 'content' => 'Item1 Content'),
                    array('label' => 'Item2', 'content' => 'Item2 Content')
                )
            ),
        )
    )
);

Different placement options

<div class="col-xs-12 col-md-6">
    <h3>Top Placement</h3>
    <?php $this->widget(
        'booster.widgets.TbTabs',
        array(
            'type' => 'tabs',
            'tabs' => $tabs
        )
    );?>
</div>

<div class="col-xs-12 col-md-6">
    <h3>Bottom Placement</h3>
    <?php $this->widget(
        'booster.widgets.TbTabs',
        array(
            'type' => 'tabs',
            'placement' => 'below',
            'tabs' => $tabs
        )
    );?>
</div>

<div class="clear"></div>

<div class="col-xs-12 col-md-6">
    <h3>Left Placement</h3>
    <?php $this->widget(
        'booster.widgets.TbTabs',
        array(
            'type' => 'tabs',
            'placement' => 'left',
            'tabs' => $tabs
        )
    );?>
</div>

<div class="col-xs-12 col-md-6">
    <h3>Right Placement</h3>
    <?php $this->widget(
        'booster.widgets.TbTabs',
        array(
            'type' => 'tabs',
            'placement' => 'right',
            'tabs' => $tabs
        )
    );?>
</div>