Module in Form von Tabs auf definierten Modulpositionen mit Hilfe eines modChrome Style darstellen.

Das Twitter-Bootstrap Framework ist beliebt und wird unter anderem auch von vielen Joomla Templates eingesetzt. Mit Hilfe eines modChrome Styles können Module in Form von Tabs dargestellt werden, ganz nach dem Beispiel des modChrome_beezTabs welches vom Standart Beez-Template verwendet wird.
In unserem Beispiel wollen wir aber das Javascript und die HTML Struktur von Boostrap beibehalten um nicht noch weiter Dateien laden zu müssen.

Grundvoraussetzung: Bootstrap CSS und Bootstrap Tabs Javascript bereits im Template integriert.

Als ersten Schritt muss in deiner Joomla Installation unter: root/templates/deinTemplate/html/modules.php
das unten folgende modChrome eingefügt werden.

function modChrome_bootTabs($module, $params, $attribs) {

    echo '<div class="moduletable">';
    
    static $modulecount;
    static $modules;
    
    if ($modulecount < 1) {
        $modulecount = count(JModuleHelper::getModules($attribs['name']));
        $modules = array();
    }
    
    if ($modulecount == 1) {
        $temp = new stdClass();
        $temp->content = $module->content;
        $temp->title = $module->title;
        $temp->params = $module->params;
        $temp->id=$module->id;
        $modules[] = $temp;
    
    // module tab titles
    echo '<ul class="nav nav-tabs">';
    $active = ' class="active"';
    foreach($modules as $rendermodule) {
    $counter ++;
        echo '<li'.$active.'><a href="#'.$rendermodule->title.'" data-toggle="tab">'.$rendermodule->title.'</a></li>';
        $active = '';
    }
    echo '</ul>'; $counter=0;// module tab titles finish
    
    // module content
    echo '<div class="tab-content">';
    $active = ' in active';
    foreach($modules as $rendermodule) {
    $counter ++;
        echo '<div class="tab-pane fade' . $active .'" id="'.$rendermodule->title.'">';
        echo $rendermodule->content;            
        echo '</div>';
        $active = '';
    } $modulecount--;
        echo '</div>'; // module content finish
    } else {
        $temp = new stdClass();
        $temp->content = $module->content;
        $temp->params = $module->params;
        $temp->title = $module->title;
        $temp->id = $module->id;
        $modules[] = $temp;
        $modulecount--;
    }
        
        echo '</div>';
}

Als nächsten Schritt wird in root/templates/deinTemplate/index.php der Modulposition deiner Wahl dein Style bootTabs zugewiesen.
Dies sieht dann ungefähr so aus:

<jdoc:include name="Tableft" type="modules" style="bootTabs" />

Nun werden alle Module die der Position Tableft zugewiesen werden, in Form von Tabs dargestellt, vorausgesetzt, Bootstrap ist im Template richtig integriert.

Ein kleines Beispiel wie die Tabs aussehen unten:

• modChrome
• Eigenes modChrome