Front page split into 2 tables....

[DJRoppolo]

www.webhostingtalk.com is the example i am referring too.. is there an easy way to edit the html and have a navigation bar on the side of the main forum like that? I'm pretty good with html and already have my navigation bar built, but I cant seem to get it split correctly. Any advice is much appreciated.

[Sinecure]

Its very simple, want the column on the left, place it in your header template, want it on the right, place it in your footer ;)

[DJRoppolo]

I tried placing it as the LAST thing my header template, but it showed up BEFORE all my site info (registered users, posts, threads), and totally threw the alignment of the page off...

[Ikram]

Originally posted by Sinecure
Its very simple, want the column on the left, place it in your header template, want it on the right, place it in your footer ;)

Sinecure, can you kindly post some example code which I can paste in my header so I can have a column on the l;eft where I can put some links? - My board totally cocks up when I try aswell :(

Thanks in advance!

[Sinecure]

This is a very bare bones example, just to show you. Nothing terribly fancy here :)

Place the following in your header template:


<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="18%" bgcolor="#DDDDDD"></td>
<td width="82%" bgcolor="#CCCCCC">


Place the following in your footer template:


</td>
</tr>
</table>

[DJRoppolo]

Ok sin... that helped alot, but where would i place the following code, to make it left justified in reference to my 'main' table? Everytime i put this code in there somewhere, it gets stuck on TOP of the main table this is just a basic table with a heading, which i made as an example....


<table border="1" cellpadding="0" cellspacing="0" width="100">
<tr>
<td align="center" bgcolor="#000000"><font size="2" color="#FFFFFF" face="Arial">Navigation</font></td>
</tr>
<tr>
<td align="center">&nbsp;</td>
</tr>
</table>

[Sinecure]

OK, so you want your table on the left or right side? The code has to be split between the header and footer templates because vb automatcily inserts between the header and footer.

[DJRoppolo]

Originally posted by Sinecure
OK, so you want your table on the left or right side? The code has to be split between the header and footer templates because vb automatcily inserts between the header and footer.

Navigation table on left, main table on right...

[Sinecure]

ok, so place this in your header:


<table border="1" cellpadding="0" cellspacing="0" width="100">
<tr>
<td align="center" bgcolor="#000000"><font size="2" color="#FFFFFF" face="Arial">Navigation</font></td>
</tr>
<tr>
<td align="center">


and this in your footer:


</td>
</tr>
</table>


Should work, copied it striaght from the code you placed above :)

NOTE: If you want your NAV table to alighn left, simply change the first align="center" to align="left".
If you want the MAIN vb table to be aligned left, just change the second align="center" to align="left"

[DJRoppolo]

Nope.. this made the 'navigation' frame surround and enclose the entire page, however, it was all left justified... im putting the header code at the END of the header section, and the FOOTER stuff at the beginning of the footer section.. i also changed the first alignment to 'left', as you said...

[Sinecure]

Try this: Header code


<table border="1" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" bgcolor="#000000" width="12%">&nbsp;</td>
<td align="center" bgcolor="#000000" width="82%"><font size="2" color="#FFFFFF" face="Arial">Navigation</font></td>
</tr>
<tr>
<td align="center" width="12%">
</td>
<td align="center" width="82%">


Footer code:


</td>
</tr>
</table>

[DJRoppolo]

yes, same results... perhaps the guy from webhostingtalk.com could give us some insight, if someone has his email address and username... he has the exact look that I am going for, only I want my navigation table on the left, rather than the right...

[c-prompt]

Here this is correct:

HEADER:


<!-- CONTENT TABLE BEGIN -->
<table border="1" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center"><smallfont>Navigation</smallfont></td>
<td align="center">


FOOTER:


</td>
</tr>
</table>
<!-- CONTENT TABLE END -->

[RHarbison]

I tried this modification, and it seems to work as expected. I get the 2 tables side by side.

However, this changed not only the front page, but all of the pages. I only want two columns on the front page. How do I correct that problem? (I'm very new to this program, so I probably did something incorrectly)

[DJRoppolo]

Funny you should ask, as yesterday, i figured out how to do only the front page. The secret is to modify the forumhome template. That will affect only the front page. Take a look at my results. Still a little tweaking to do yet, but its working out nicely, i think.

http://www.sportsnimports.com/forums

[Mr. X]

^ thats exactly what I want to do on my forums, just make the tables appear on the right. But so far I just end up butchering my layout. How exactly did you do it? Im following the exact code Sinecure and C: have, but it either butchers the forums, or everything ends up on top or bottom.

[DJRoppolo]

Here's what I did.. I took this code, and opened up my forumhome template:


<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="20%">Part 1</td>
<td width="80%">Part 2</td>
</tr>
</table>
</center>
</div>


Part 1: Simply insert the html for your left tables here. I built mine on Front Page 2K, then cut and paste the html between <td width="20%"> and </td>

Part 2: Here is where you have to break this code apart. Cut the last part of the code out, starting with where i have Part 2 all the way down to </div>. Just after the <td width="80%"> should come this part of 'forumhome':

<!-- /text -->
<br>
<!-- main -->

and all the natural code after that. Now, the part you cut out:

</td>
</tr>
</table>
</center>
</div>

should be pasted down at the bottom of the forumhome template. This puts the entire forum list, inside of the 80% cell. Of course, I have my tables sized at 20% and 80%, but you could change that up to suit your style. Anymore questions, dont hesitate to ask!

[Mr. X]

Man I am so massively confused.


Here's what I did.. I took this code, and opened up my forumhome template:

Is that code in the template, or is that the custom code I need? If custom, then where do I put it (line wise)


Simply insert the html for your left tables here. I built mine on Front Page 2K, then cut and paste the html between <td width="20%"> and </td>

Ok, I have the custom table ready, so I copied the code and put where you said. (though Im trying to put it right instead of left, like WHT.com has it).


Here is where you have to break this code apart. Cut the last part of the code out, starting with where i have Part 2 all the way down to </div>. Just after the <td width="80%"> should come this part of 'forumhome':

I cut that part out, and pasted that code with my new table, just above the <--/text--> part. I then put the bottom code on top of $footer. My custom table looks fine, but it ends up on top, with a border that surrounds the forums.

Here is my forumhome template: (btw this template here is modified a bit)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<!-- no cache headers -->
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="no-cache">
<meta http-equiv="Expires" content="-1">
<meta http-equiv="Cache-Control" content="no-cache">
<!-- end no cache headers -->
<meta name="keywords" content="vbulletin,forum,bbs,discussion,jelsoft">
<meta name="description" content="$bbtitle is a discussion forum powered by vBulletin. To visit the forum, go to $bburl/ . To find out about vBulletin, go to http://www.vbulletin.com/ .">
<title>$bbtitle - powered by vBulletin</title>
$headinclude
</head>
<body>
$header

<!-- text -->


<!-- /text -->
<!-- welcomepanel -->
<table cellpadding="0" cellspacing="0" border="0" bgcolor="#555576" width="100%" align="center">
<tr>
<td>
<table cellpadding="4" cellspacing="1" border="0" width="100%">
<tr id="cat">
<td bgcolor="#606096" colspan="6"><smallfont color="#FFF788"><b>User Panel</b></smallfont></td>
</tr>
<tr>
<td bgcolor="#DFDFDF" align="center" valign="top" width="100">$avatarimage</td>
<td bgcolor="#F1F1F1">
<smallfont>
Welcome to our newest member, <a href="member.php?s=$session[sessionhash]&action=getinfo&userid=$newuserid">$newusername</a>

$welcometext<br>
<font color="#34567E">Members:</font> $numbermembers <font color="#34567E">Threads:</font> $totalthreads <font color="#34567E">Posts:</font> $totalposts<br>

You last visited: $bbuserinfo[lastvisitdate].<br>
<b>$newposts</b>
</smallfont>
</td>
<td bgcolor="#DFDFDF" align="center" valign="middle" width="300">
$logincode
</td>
</tr>

</table>
</td></tr></table>
<br>
<!-- /welcomepanel -->


<table cellpadding="0" cellspacing="0" border="0" bgcolor="#555576" width="100%" align="center"><tr><td>
<table cellpadding="4" cellspacing="1" border="0" width="100%">
<tr align="center">
<td bgcolor="#8080A6"><smallfont>&nbsp;</smallfont></td>
<td bgcolor="#8080A6" width="80%" align="left"><smallfont color="#EEEEFF"><b>Forum</b></smallfont></td>
<td bgcolor="#8080A6"><smallfont color="#EEEEFF"><b>Posts</b></smallfont></td>
<td bgcolor="#8080A6"><smallfont color="#EEEEFF"><b>Threads</b></smallfont></td>
<td bgcolor="#8080A6" nowrap><smallfont color="#EEEEFF"><b>Last Post</b></smallfont></td>
<td bgcolor="#8080A6" width="20%"><smallfont color="#EEEEFF"><b>Moderator</b></smallfont></td>
</tr>

$forumbits
$pminfo
$loggedinusers
</table>
</td></tr></table>
<!-- /main -->

<br>

<!-- timezone/login-->
<table cellpadding="2" cellspacing="0" border="0" width="100%" align="center">
<tr valign="top">
<td><smallfont>$timezone</smallfont></td>
<td align="right"></td>
</tr>
</table>
<!-- /timezone/login -->

<br>

<!-- icons -->
<table cellpadding="2" cellspacing="0" border="0" width="100%" align="center">
<tr>
<td align="center">
<img src="images/on.gif" border="0" alt="On" align="absmiddle">
<b><smallfont>New posts</smallfont></b>
&nbsp;&nbsp;
<img src="images/off.gif" border="0" alt="Off" align="absmiddle">
<b><smallfont>No new posts</smallfont></b>
&nbsp;&nbsp;
<img src="images/lock.gif" border="0" alt="Closed Forum" align="absmiddle">
<b><smallfont>A closed forum</smallfont></b>
</td>
</tr>
</table>
<!-- /icons -->



$footer
</body>
</html>

[/b]Here is the custom table I want to use:[/b]


<table width="198" cellspacing="0" bgcolor="#333333" align="left">
<tr>
<td>
<table width="100%" border="0" cellspacing="0" bgcolor="#CCCCCC">
<tr>
<td width="19%" bgcolor="#000000">&nbsp;</td>
<td width="81%" bgcolor="#003399">
<div align="right"><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"><b>Forum
Statistics</b></font></div>
</td>
</tr>
<tr bgcolor="#CCCCCC">
<td colspan="2"> <b><font size="1" face="Verdana, Arial, Helvetica, sans-serif">Members:</font></b></td>
</tr>
<tr bgcolor="#DDDDDD">
<td colspan="2"> <b><font size="1" face="Verdana, Arial, Helvetica, sans-serif">Currently
Online:</font></b></td>
</tr>
<tr bgcolor="#CCCCCC">
<td colspan="2">
<p><b><font size="1" face="Verdana, Arial, Helvetica, sans-serif">Record
Online:</font></b></p>
</td>
</tr>
<tr bgcolor="#DDDDDD">
<td colspan="2"> <b><font size="1" face="Verdana, Arial, Helvetica, sans-serif">Threads:</font></b></td>
</tr>
<tr bgcolor="#CCCCCC">
<td colspan="2"> <b><font size="1" face="Verdana, Arial, Helvetica, sans-serif">Posts:</font></b></td>
</tr>
</table>
</td>
</tr>
</table>


Please keep in mind Im still working out the look and stuff, I just wanna learn how to put the tables on the sides before I start really working on the look of the custom boxes :)

I *kinda* see where your going, but Im still confused. I'll keep trying and see if I can stumble on success.

[Mr. X]

bump

[jgrillone]

bump

[Mr. X]

up

[Automated]

Originally posted by Mr. X
up :confused:

[dawn]

Im new on this, and I would like to make a forum just like this one http://www.sportsnimports.com/forums

I need the left column for info.

thanks