Joomla Templates Club 406,261 posts

[ascent_hosting Friend ascent_hostingJoin date: March 2009Posts: 12Downloads:0Uploads:2 Thanks: 5]

#146712

I would like any advice on how to mirror the default home page layout so that the sidebars are effectively swapped.

Note I have removed content from the logo and login modules that sit directly above the home page slideshow module.

The attached diagrams show what I am trying to achieve. Diagram d1 shows the current layout I have, diagram d2 show what I want to achieve.

Thanks.

(Joomla 1.5.x, Helio template)

---

Attachments:

1. 
2. 

[Css Magician Friend Css MagicianJoin date: October 2014Posts: 741Downloads:43Uploads:53 Thanks: 114 Thanked: 366 times in 263 posts]

#326330

Dear ascent_hosting,

Thank you for contacting,
Please open file template.css and edit as follow:

at lines 516 , change


#ja-mainbody {
float: left;
width:75%;


to


#ja-mainbody {
float: right;
width: 75%;


at lines 546 , change


#ja-col2 {
background: url(../images/col-center.gif) repeat-y 20px 0;
float: right;
overflow:hidden;
width:25%;
}


to


#ja-col2 {
background: url(../images/col-center.gif) repeat-y 200px 0;
float: left;
overflow:hidden;
width:25%;
}


at lines 557, change


#ja-col2-bot {
background:url(../images/col-bot.gif) no-repeat 200px bottom;
padding :0 0 0 40px;
}


to


#ja-col2-bot {
background:url(../images/col-bot.gif) no-repeat 200px bottom;
padding :0 40px 0 0;
}


at lines 553, change


#ja-col2-top {
background: url(../images/col-top.gif) no-repeat 20px 0;
}


to:


#ja-col2-top {
background: url(../images/col-top.gif) no-repeat 200px 0;
}


at lines 523, change


#ja-content {
clear:both;
display:block;
float: right;
width:69%;
}


to :


#ja-content {
clear:both;
display:block;
float: left;
width: 69%;


and at lines 536, change


#ja-col1 {
float: left;
overflow:hidden;
width: 27%;
}


to :


#ja-col1 {
float: right;
overflow: hidden;
width: 27%;


After that, open file templatesja_helioindex.php and edit as follow:

at lines 165, change
[PHP]
<?php if ($ja_left) { ?>
<!– BEGIN: LEFT COLUMN –>
<div id=”ja-col1″>
<div class=”ja-innerpad”>
<jdoc:include type=”modules” name=”left” style=”rounded” />
</div>
</div><br />
<!– END: LEFT COLUMN –>
<?php } ?>
[/PHP]

to :

[PHP]
<?php if ($ja_right) { ?>
<!– BEGIN: RIGHT COLUMN –>
<div id=”ja-col1″>
<div class=”ja-innerpad”>
<jdoc:include type=”modules” name=”right” style=”rounded” />
</div>
</div><br />
<!– END: RIGHT COLUMN –>
<?php } ?>
[/PHP]

and at lines 177, change

[PHP]
<?php if ($ja_right) { ?>
<!– BEGIN: RIGHT COLUMN –>
<div id=”ja-col2″><div id=”ja-col2-top”><div id=”ja-col2-bot” class=”clearfix”>

<?php if ($hasSubnav) { ?>
<div id=”ja-subnav” class=”moduletable-hilite”>
<h3>On this page</h3>
<?php $jamenu->genMenu (1,1); ?>
</div>
<?php } ?>

<jdoc:include type=”modules” name=”right” style=”xhtml” />
</div></div></div>
<!– END: RIGHT COLUMN –>
<?php } ?>
[/PHP]

to :

[PHP]
<?php if ($ja_left) { ?>
<!– BEGIN: LEFT COLUMN –>
<div id=”ja-col2″><div id=”ja-col2-top”><div id=”ja-col2-bot” class=”clearfix”>

<?php if ($hasSubnav) { ?>
<div id=”ja-subnav” class=”moduletable-hilite”>
<h3>On this page</h3>
<?php $jamenu->genMenu (1,1); ?>
</div>
<?php } ?>

<jdoc:include type=”modules” name=”left” style=”xhtml” />
</div></div></div>
<!– END: LEFT COLUMN –>
<?php } ?>
[/PHP]

Please feel free to contact us if we are of any further assistance.

1 user says Thank You to Css Magician for this useful post

1. JA Developer

[ascent_hosting Friend ascent_hostingJoin date: March 2009Posts: 12Downloads:0Uploads:2 Thanks: 5]

#326332

WOW thank you for your very thorough directions, I will try ALL that and let you know how I go.

[Css Magician Friend Css MagicianJoin date: October 2014Posts: 741Downloads:43Uploads:53 Thanks: 114 Thanked: 366 times in 263 posts]

#326571

Dear ascent_hosting,

I fixed all your problems in your site, please check again.

[ascent_hosting Friend ascent_hostingJoin date: March 2009Posts: 12Downloads:0Uploads:2 Thanks: 5]

#326572

Quick response yet again!! Thanks

The home page is great but now all the inside pages in IE now have the left sidebar forced to the bottom. ANy ideas why this might occur?

Thanks for your help.

[Css Magician Friend Css MagicianJoin date: October 2014Posts: 741Downloads:43Uploads:53 Thanks: 114 Thanked: 366 times in 263 posts]

#326585

Dear ascent_hosting,

I am sorry about this problems :p, but I think it has been solved. Please check again, and tell me about this 😉

1 user says Thank You to Css Magician for this useful post

1. ascent_hosting

[ascent_hosting Friend ascent_hostingJoin date: March 2009Posts: 12Downloads:0Uploads:2 Thanks: 5]

#326588

That’s done the trick the columns are where they should be.

But for some reason the main logo at the top odf the left sidebar left is blurred and ugly in IE compared to how it diplays in FF. Is this a IE CSS bug do you think?

[Author]

Posts