1 • copy templates in your theme folder (from default theme) :- theme_blockcenter_c
- theme_blockcenter_l
- theme_blockcenter_r
- theme_blockleft.html
- theme_blockright.html
2 • theme.html modifications :a) HEAD part :
Erase (already called by <{$xoops_module_header}> if I'm not wrong):
<script type="text/javascript">
script>
Add (required to call blocks templates dynamically):
<{assign var=theme_name value=$xoTheme->folderName}>
b) BODY part
Replace old canvas code by /default theme.html code :
<{if $xoops_showlblock}>
<td id="leftcolumn">
<{foreach item=block from=$xoBlocks.canvas_left}>
<{includeq file="$theme_name/theme_blockleft.html"}>
<{/foreach}>
td>
<{/if}>
<td id="centercolumn">
<{if $xoBlocks.page_topleft or $xoBlocks.page_topcenter or $xoBlocks.page_topright}>
<table cellspacing="0">
<tr>
<td id="centerCcolumn" colspan="2">
<{foreach item=block from=$xoBlocks.page_topcenter}>
<{includeq file="$theme_name/theme_blockcenter_c.html"}>
<{/foreach}>
td>
tr>
<tr>
<td id="centerLcolumn">
<{foreach item=block from=$xoBlocks.page_topleft}>
<{includeq file="$theme_name/theme_blockcenter_l.html"}>
<{/foreach}>
td>
<td id="centerRcolumn">
<{foreach item=block from=$xoBlocks.page_topright}>
<{includeq file="$theme_name/theme_blockcenter_r.html"}>
<{/foreach}>
td>
tr>
table>
<{/if}>
<div id="content">
<{$xoops_contents}>
div>
<{if $xoBlocks.page_bottomleft or $xoBlocks.page_bottomright or $xoBlocks.page_bottomcenter}>
<table cellspacing="0">
<{if $xoBlocks.page_bottomcenter}>
<tr>
<td id="bottomCcolumn" colspan="2">
<{foreach from=$xoBlocks.page_bottomcenter item=block}>
<{include file="$theme_name/theme_blockcenter_c.html"}>
<{/foreach}>
td>
tr>
<{/if}>
<{if $xoBlocks.page_bottomleft or $xoBlocks.page_bottomright}>
<tr>
<td id="bottomLcolumn">
<{foreach from=$xoBlocks.page_bottomleft item=block}>
<{include file="$theme_name/theme_blockcenter_l.html"}>
<{/foreach}>
td>
<td id="bottomRcolumn">
<{foreach from=$xoBlocks.page_bottomright item=block}>
<{include file="$theme_name/theme_blockcenter_r.html"}>
<{/foreach}>
td>
tr>
<{/if}>
table>
<{/if}>
td>
<{if $xoops_showrblock}>
<td id="rightcolumn">
<{foreach item=block from=$xoBlocks.canvas_right}>
<{includeq file="$theme_name/theme_blockright.html"}>
<{/foreach}>
td>
<{/if}>
3 • templates modificationscenter blocks templates gets these tags (theme_blockcenter_c.html, theme_blockcenter_l.html and theme_blockcenter_r.html):
-
: erase it
-
: replace by
4 • Stylesheet modificationa) blocks
Duplicate styles for Top center blocks
td#centerCcolumn {padding: 0px;}
td#centerCcolumn div.blockTitle {padding: 10px 3px 3px 15px; color: #000000; font-weight: bold; margin-top: 0px; margin-right: 0px; margin-left: 0px;}
td#centerCcolumn div.blockContent {border-bottom: 1px solid #dddddd; padding: 5px 15px; margin-right: 0px; margin-left: 0px; margin-bottom: 3px; line-height: 130%;}
td#centerLcolumn {width: 50%; padding: 0px 3px 0px 0px;}
td#centerLcolumn div.blockTitle {padding: 10px 3px 3px 10px; color: #000000; font-weight: bold; margin-top: 0px;}
td#centerLcolumn div.blockContent {padding: 5px; margin-left: 0px; margin-right: 0px; margin-bottom: 2px; line-height: 120%;}
td#centerRcolumn {width: 50%; padding: 0px 3px 0px 0px;}
td#centerRcolumn div.blockTitle {padding: 10px 3px 3px 10px; color: #000000; font-weight: bold; margin-top: 0px;}
td#centerRcolumn div.blockContent {padding: 5px; margin-left: 0px; margin-right: 0px; margin-bottom: 2px; line-height: 120%;}
And replace "center" by "bottom" to apply same styles to bottom blocks.
Like this :
td#bottomCcolumn {padding: 0px;}
td#bottomCcolumn div.blockTitle {padding: 10px 3px 3px 15px; color: #000000; font-weight: bold; margin-top: 0px; margin-right: 0px; margin-left: 0px;}
td#bottomCcolumn div.blockContent {border-bottom: 1px solid #dddddd; padding: 5px 15px; margin-right: 0px; margin-left: 0px; margin-bottom: 3px; line-height: 130%;}
td#bottomLcolumn {width: 50%; padding: 0px 3px 0px 0px;}
td#bottomLcolumn div.blockTitle {padding: 10px 3px 3px 10px; color: #000000; font-weight: bold; margin-top: 0px;}
td#bottomLcolumn div.blockContent {padding: 5px; margin-left: 0px; margin-right: 0px; margin-bottom: 2px; line-height: 120%;}
td#bottomRcolumn {width: 50%; padding: 0px 3px 0px 0px;}
td#bottomRcolumn div.blockTitle {padding: 10px 3px 3px 10px; color: #000000; font-weight: bold; margin-top: 0px;}
td#bottomRcolumn div.blockContent {padding: 5px; margin-left: 0px; margin-right: 0px; margin-bottom: 2px; line-height: 120%;}
b) Main and user menus
To get nice menus, check display: block; instruction
Quote:
Quote:
#mainmenu a {display: block;}
#usermenu a {display: block;}
If you update an "old" theme it would be nice to put a download link in comment