Here is a quick solution for you. You will still need to add padding as necessary to adjust which ever module you are going to use in these positions.
Here is how it looks. I ve just added black background and white font color for demo purposes using custom html module.
http://i48.tinypic.com/2s1lp4j.jpgModule Positions are headertop1,headertop2,headertop3. So make necessary changes in templateDetails.xml or change the names to your requirement.
Find File: \templates\gk_finance_business\layouts\blocks\nav.php
Find Lines: 50 to 60 which is below
- Code: Select all
<?php if((GK_REGISTER || GK_LOGIN) && !GK_COM_USERS) : ?>
<div id="gkButtons">
<?php if(GK_LOGIN) : ?>
<a href="<?php echo $this->URLbase(); ?>index.php?option=com_users&view=login" id="btnLogin"><?php echo ($userID > 0) ? JText::_('TPL_GK_LANG_LOGOUT') : JText::_('TPL_GK_LANG_LOGIN'); ?></a>
<?php endif; ?>
<?php if(GK_REGISTER) : ?>
<a href="<?php echo $this->URLbase(); ?>index.php?option=com_users&view=registration" id="btnRegister"><?php echo JText::_('TPL_GK_LANG_REGISTER'); ?></a>
<?php endif; ?>
</div>
<?php endif; ?>
Replace with below
- Code: Select all
<?php if($this->modules('headertop1') || ('headertop2') || ('headertop3')) : ?>
<div id="gkHeaderTop">
<?php if($this->modules('headertop1')) : ?>
<div class="gkheadertop1">
<jdoc:include type="modules" name="headertop1" style="<?php echo $this->module_styles['none']; ?>" />
</div>
<?php endif; ?>
<?php if($this->modules('headertop2')) : ?>
<div class="gkheadertop2">
<jdoc:include type="modules" name="headertop2" style="<?php echo $this->module_styles['none']; ?>" />
</div>
<?php endif; ?>
<?php if($this->modules('headertop3')) : ?>
<div class="gkheadertop3">
<jdoc:include type="modules" name="headertop3" style="<?php echo $this->module_styles['none']; ?>" />
</div>
<?php endif; ?>
</div>
<?php endif; ?>
Add following css in override.css file and enable it in template advanced settings.
- Code: Select all
#gkHeaderTop { float:right; height:68px; width: 650px; margin-top: 33px;}
.gkheadertop1,
.gkheadertop2,
.gkheadertop3 { display: inline-block; padding-left: 10px; background:#000; color:#fff; width:31%;}
gkHeaderTop - Main container.
.gkheadertop1,.gkheadertop2,.gkheadertop3 are boxes inside in case you want to set other css properties.
You do not have to use background and color or width so change those to your requirements.
See you around...