Joomla bootstrap jdoc component width

Question

Building a Joomla template using bootstrap.

I use 3 grids as follows:

<div class="row">
<div id="leftbar" class="col-xs-3">
<jdoc:include type="modules" name="leftbar" />
</div>
<div id="middle-content" class="col-xs-6">
<jdoc:include type="component" />
</div>
<div id="rightbar" class="col-xs-3">
    <jdoc:include type="modules" name="rightbar" />
</div>

When a user presses on "Forum" on my website, they are taken to my Kunena forum. The issue is that said forum is loaded through the jdoc "component" which, even by hiding both leftbar and rightbar, is only "col-xs-6". I want it to stretch the entire site.

Is this something I can change in bootstrap, or is it a Joomla setting? The frontpage is 3-6-3 The forum is supposed to be 12

Answer 1

You should check if modules exist on each position using countModules() method before you display them.

The syntax is:

<?php if ($this->countModules( 'user1' )) : ?>
  <div class="user1">
    <jdoc:include type="modules" name="user1" style="rounded" />
  </div>
<?php endif; ?>

Modified your code adding one more block for main area width calculation.

<?php
$main_area_width = 12;
if($this->countModules( 'leftbar' )) {
  $main_area_width -= 3;
}
if($this->countModules( 'rightbar' )) {
  $main_area_width -= 3;
}
?>

<div class="row">
<?php if ($this->countModules( 'leftbar' )) : ?>
  <div id="leftbar" class="col-xs-3">
    <jdoc:include type="modules" name="leftbar" />
  </div>
<?php endif; ?>
<div id="middle-content" class="col-xs-<?php echo $main_area_width; ?>">
  <jdoc:include type="component" />
</div>
<?php if ($this->countModules( 'rightbar' )) : ?>
  <div id="rightbar" class="col-xs-3">
    <jdoc:include type="modules" name="rightbar" />
  </div>
<?php endif; ?>
</div>

Reference: JDocumentHTML/countModules