Post by Andrew on Nov 21, 2006 18:27:49 GMT -5
Hey guys, Today I release my first template, You already saw most of it from the duel put now you can download and use yourself
Live Preview|Download
Well Hope you like it and enjoy.
Global Header:
Global Footer:
Main Header:
Main Footer:
In the main footer Ive also got the Advanced Category Spliter Which is From CD at Studio Zero
Code:
Enjoy
~Andrew
Live Preview|Download
Well Hope you like it and enjoy.
Global Header:
<script language=javascript>
<!--
var PMLogoCell = document.getElementsByTagName("TD")[1]; PMLogoCell.removeChild(PMLogoCell.lastChild)
document.getElementsByTagName('tr')[1].deleteCell(1);
-->
</script>
<style type="text/css">
<!--
body
{
scrollbar-arrow-color: #85b0c7;
scrollbar-track-color:#85b0c7;
scrollbar-3dlight-color:#0066FF;
scrollbar-highlight-color:#0066FF;
scrollbar-face-color:#85b0c7;
scrollbar-darkshadow-color:#85b0c7;
scrollbar-shadow-color:#0066FF;
}
-->
</style>
<style type="text/css">
<!--
}
.titlebg {background-image: url(CAT IMAGE HERE);); background-repeat: repeat;}
.catbg {background-image: url(CAT IMAGE HERE);background-repeat: repeat;}
.menubg {background-image: url(CAT IMAGE HERE);); background-repeat: repeat;
}
BODY {background-position:center top;background-repeat:repeat-y;}
-->
</style>
Global Footer:
<script language="JavaScript">
var boardwidth = document.getElementsByTagName('TABLE');
for(i=0;i<boardwidth.length;i++) {
if(boardwidth[i].width=="92%"){
boardwidth[i].width='700 px';}}
</script>
Main Header:
<center>
<table border="0" cellpadding="3" cellspacing="1" height="30" width="700" style="position: relative; top: 1px;" >
<tr>
<td width="100%" align="center" class="Head">
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="700" >
<tr>
<td width="100%" class="bordercolor">
<table border="0" cellpadding="0" cellspacing="1" width="100%">
<tr>
<td width="100%" class="titlebg" align="center" height="20" ><b>Welcome to my test board.</b></td>
</tr>
<td width="100%" height = "30" class = "windowbg">
<center><font size="1+">
<a href = "LINK HERE">TEXT HERE</a> |
<a href = "LINK HERE">TEXT HERE</a> |
<a href = "LINK HERE">TEXT HERE</a> |
<a href = "LINK HERE">TEXT HERE</a> |
<a href = "LINK HERE">TEXT HERE</a> |
</font></center>
</td>
<tr>
<td width="100%" class="titlebg" align="center" height="20" >
</tr>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table border="0" cellpadding="3" cellspacing="1" height="30" width="700" style="position: relative; bottom: 1px;" >
<tr><td class="Base">
</td>
</tr>
</td>
</tr>
</table>
</center><br>
Main Footer:
<script type="text/javascript">
<!--
/* Info Center Head/Base Image w/ Title on Head Image
By {XF}Äs$@§sîñ™, http://www.xf-clan.net
Code from http://www.utopiangfx.proboards56.com/index.cgi */
var infoHead = "YOUR HEAD IMAGE HERE"; // News Head Image
var infoHeadHeight = "35px" // Height of your head image
var infoPad = "8px" // Adjust the vertical alignment to suit the postioning of the title on your head image
var infoBase = "YOUR BASE IMAGE HERE"; // News Base Image
var table = document.getElementsByTagName("table");
if (location.href.match(/com\/?((index\.cgi)?\??(action=(home|logout))?(#\w+)?)?$/)) {
for (i=0; i<table.length; i++) {
if (table.item(i).width == "100%" && table.item(i).className == "bordercolor" && table.item(i).innerHTML.match(/Info\sCenter/i)) {
var headDiv = document.createElement("div");
with (headDiv) {
align = "center";
style.height = infoHeadHeight;
style.backgroundImage = 'url("' + infoHead + '")';
style.backgroundRepeat = "no-repeat";
}
var titleDiv = document.createElement("div");
titleDiv.style.paddingTop = infoPad;
var tabTitle = table.item(i+1).rows.item(0).cells.item(0).cloneNode(true).innerHTML;
table.item(i+1).rows.item(0).style.display = "none";
titleDiv.innerHTML = tabTitle;
headDiv.appendChild(titleDiv);
var baseDiv = document.createElement("div");
baseDiv.setAttribute("align", "center");
var baseImg = document.createElement("img");
baseImg.setAttribute("src", infoBase);
baseDiv.appendChild(baseImg);
table.item(i).parentNode.insertBefore(headDiv, table.item(i));
table.item(i).parentNode.insertBefore(baseDiv, table.item(i).nextSibling);
break;
}
}
}
// -->
</script>
<center>(C) 2006 Graphics and layout by ElseAndrew. All rights reserved</center>
In the main footer Ive also got the Advanced Category Spliter Which is From CD at Studio Zero
Code:
<script type="text/Javascript">
// Advanced Category Splitter v2.0 by CD
// Do not redistribute without permission
var head = ["YOUR HEAD IMAGE HERE","35px"]; // URL of Head image and height of said head image
var base = "YOUR BASE IMAGE HERE"; // URL of foot image
var gap = "15px"; // Gap between categories
var markAsRead = "Yes"; // Put "Yes" if you want MarkAsRead to be shown in the last category. Put "No" if not.
// No need to edit
var aTB = document.getElementsByTagName("TABLE");
if(location.href.match(/action=home/i) || !location.href.match(/action=/i)){
for(a=2;a<aTB.length;a++){
if(aTB[a].rows.length > 2 && aTB[a].rows[0].cells.length == 4){
var data = document.createElement("center");
if(document.all){
for(b=0;b<aTB[a].rows[0].cells.length;b++){
eval("var cell"+b+" = aTB["+a+"].rows[0].cells["+b+"].cloneNode(true);");
}
} else {
var mainRow = aTB[a].rows[0].cloneNode(true);
}
while(aTB[a].rows[0]){
if(aTB[a].rows[0].cells.length == 5){
var meh = tab2.insertRow(tab2.rows.length);
while(aTB[a].rows[0].cells[0]){
meh.appendChild(aTB[a].rows[0].cells[0]);
}
} else if(aTB[a].rows[0].cells[0].colSpan == 5 && aTB[a].rows[0].cells[0].getElementsByTagName("A")[0].name){
var tab = document.createElement("TABLE");
var meh = tab.insertRow(0).insertCell(0);
meh.innerHTML = aTB[a].rows[0].cells[0].innerHTML;
meh.className = "headImg";
tab.style.backgroundImage = "url("+head[0]+")";
tab.style.height = head[1];
tab.width = "100%";
tab.cellPadding = 0;
tab.cellSpacing = 0;
var tab2 = document.createElement("TABLE");
tab2.className = "bordercolor";
tab2.cellPadding = 4;
tab2.cellSpacing = 1;
if(document.all){
var row = tab2.insertRow(0);
row.appendChild(cell0.cloneNode(true));
row.appendChild(cell1.cloneNode(true));
row.appendChild(cell2.cloneNode(true));
row.appendChild(cell3.cloneNode(true));
} else {
tab2.appendChild(mainRow.cloneNode(true));
}
var img = document.createElement("IMG");
img.src = base;
var div = document.createElement("DIV");
div.style.height = gap;
data.appendChild(tab);
data.appendChild(tab2);
data.appendChild(img);
data.appendChild(div);
} else if(aTB[a].rows[0].cells[0].colSpan == 5 && aTB[a].rows[0].cells[0].getElementsByTagName("IMG")[0] && markAsRead == "Yes"){
var meh = tab2.insertRow(tab2.rows.length);
meh.appendChild(aTB[a].rows[0].cells[0]);
}
aTB[a].rows[0].parentNode.removeChild(aTB[a].rows[0]);
}
var aTB2 = aTB[a].parentNode.parentNode.parentNode.parentNode;
aTB2.style.display = "none";
aTB2.parentNode.insertBefore(data,aTB2);
break;
}
}
}
</script>
Enjoy
~Andrew