You could try adding a new banner position with some css styling.
For the following suggestion you would need to go to template parameters and set css overrides to 'on'
Create a new module position in the layouts/blocks/mainnav.php
Insert this and change 'new' (x3) to whatever you want to call the module position div id etc...
- Code: Select all
<?php if( $this->countModules('new')) : ?>
<div id="new" class="clear clearfix">
<jdoc:include type="modules" name="new" style="gavickpro" />
</div>
<?php endif; ?>
You should also add this position to the templateDetails.xml file, although you can manually enter the position in the module manager.
The new position can be added at around line 24 (this may vary depending on template version).
You should end up with something like this...
- Code: Select all
omitted code...
<div id="gk-nav" class="clearfix">
<div id="gk-mainnav" class="clearfix">
<?php if (($gkmenu = $this->loadMenu())) $gkmenu->genMenu ($this->getParam('startlevel',0), $this->getParam('endlevel',-1)); ?>
</div>
<?php if ($this->hasSubmenu() && ($gkmenu = $this->loadMenu())) : ?>
<div id="gk-subnav" class="clear">
<?php $gkmenu->genMenu(1); ?>
</div>
<?php endif;?>
</div>
<!-- start new position -->
<?php if( $this->countModules('new')) : ?>
<div id="new" class="clear clearfix">
<jdoc:include type="modules" name="new" style="gavickpro" />
</div>
<?php endif; ?>
<!-- end new position -->
<?php if( $this->countModules('banner1')) : ?>
<div id="banner1" class="clear clearfix">
<jdoc:include type="modules" name="banner1" style="gavickpro" />
</div>
<?php endif; ?>
</div>
omitted code...
Now you should have a shiny new position which requires some styling to suit your needs.
The best way to achieve template overrides or customization is by using the override.css file, which will make template upgrades easier in the future.
Edit the css/override.css file as follows...
- Code: Select all
/* new module position styling '#new' needs to be the same as the name you have given to the modules id */
#new {
width: 600px;
float: right;
margin-top: -20px;
}
You will need to play with the module css shown in the example above to get the style and position required.
Renaming the image files will cause unnecessary 404 errors.
You will find the background image styling in the css/template.css css/style1.css and css/style2.css files.
As there are two template styles it's probably easier to simply edit the styleX.css files directly.
Example css/style1.css around line 61
- Code: Select all
change this...
#bg-wrap2{ background:transparent url('../images/style1/bg_pattern.png') repeat 0 0; height:100%; }
to this...
#bg-wrap2{ background:transparent; }
Check your server log for 404 errors and ensure the renamed/missing files aren't causing any 404s.
There maybe be other solutions to your questions.