1
Hi,
Ive been messing with a new theme for my site, nad have got a bit carried away in places! Its still work in progess and so far I have only worked on the positioning side and done nowt so far with the colourings.Also need to make it "IE proof"
I wanted to go for a DIV only theme and try to avoide using tables as much as possible.
I have made this theme for a simple left menu coloum and a main centre column, I think if I was to use a right column it may make what ive done ALOT more tricky
I have placed the center column content div first in the theme.html,then the header then the left menu bar, hopefully this may keep google bot happy, dont know if there will be a big difference but i cant see it doing any harm at all.
I've also stripped out the block html files and just placed the code in theme.html, since I will always use 2 columsn on my pages i again dont see this as being a big problem
Here is the theme.html (not copied and pasted the html .. as Ive not touched that
<body>
<div class="wrap">
<div class="centercolumn">
<{if $xoops_showcblock == 1}>
<{foreach item=block from=$xoops_ccblocks}>
<h2><{$block.title}>h2>
<div class="blockContent"><{$block.content}>div>
<br />
<{/foreach}>
<{/if}>
<div class="content"><{$xoops_contents}>div>
<div class="footer"><{$xoops_footer}>div>
div>
<div class="header">
<div class="logo"><img src="<{$xoops_imageurl}>logo.jpg" alt="<{$xoops_sitename}> - <{$xoops_pagetitle}>" />div>
<div class="add"><{$xoops_banner}>div>
div>
<div class="leftcolumn">
<{foreach item=block from=$xoops_lblocks}>
<h2><{$block.title}>h2>
<div class="blockContent"><{$block.content}>div>
<br />
<{/foreach}>
div>
div>
body>
html>
Here are the sections of css i've used for the positioning (need to double check this to make sure no "useless" code has slipped in)
div.wrap {position:absolute; top: 0;width:99%;margin-right:5px;margin-left:5px;margin-top:2px;padding:0px;text-align:left;}
div.header {position:absolute; width:99%;height 150px;text-align: center;margin-right:5px;margin-left:5px; }
div.footer {font-size: x-small; text-align: center;}
div.leftcolumn {position:absolute; margin-bottom: 3em;height: auto;padding: .5em; top: 165px; left: 0px; width: 155px; font-size: small;padding:0px;float:left; border-right: medium hidden;}
div.centercolumn {position:absolute; vertical-align: top; left: 160px; top: 165px;padding:0px;float:left; background-color:#ffffff; border-left: medium hidden;margin-right:5px;}
div.content {left: 160px;text-align:margin-right:5px; }
Have i gone mad? or are my ideas good ones? I'll upload my theme file to my site in a min so you can download it if you want