WEB Page questions

Hi, I am making my own web page and I wanted to ask a few questions to try and help me get every thing done right and the way I want it.

My first question is how do you frame every thing like when you go to AO's home page every things is in a nice neet little box with the yellow hedding. how is that dose is it done with tables or something if some one could just point me in the right direction that would be great.

Yes, AO uses tables, just take a look at the source code :) you'll be able to see all the HTML but you won't be able to see the PHP code (For obvious reasons).

If you don't know what PHP is, it's a web-development programming language, you can get more information from http://php.net I learned in about 1-2 days, it's realtively easy if you ask me :)

Ok cool thaks for your reply and the link.

Don't know if you are already using vbulletin but if you are then this is what you would do..

Quote:

---

LEFT COLUMN

Admin CP -> Styles & Templates -> Style Manager -> Common Templates (in the menu)

Add the Blue code to the header:

Code:

---

<!-- /logo -->

<table width="$stylevar[outertablewidth]" border="0" cellpadding="0" cellspacing="0" align="center">
        <tr>

        <td width="150" valign="top" class="page" style="padding: $stylevar[cellpadding]px;">
                YOUR CONTENT HERE
        </td>

        <td valign="top">

<!-- content table -->
$spacer_open

$_phpinclude_output

---

...and add the blue code to the footer:

Code:

---

<br />
<div class="smallfont" align="center">$vbphrase[all_times_are_gmt_x_time_now_is_y]</div>
<br />

$spacer_close
<!-- /content area table -->


        </td>

        </tr>
</table>

<form action="$vboptions[forumhome].php" method="get">

---

RIGHT COLUMN


Admin CP -> Styles & Templates -> Style Manager -> Common Templates (in the menu)

Add the blue code to the header:

Code:

---

<!-- /logo -->

<table width="$stylevar[outertablewidth]" border="0" cellpadding="0" cellspacing="0" align="center">
        <tr>

        <td valign="top">

<!-- content table -->
$spacer_open

$_phpinclude_output

---

...and add the blue code to the footer:

Code:

---

<br />
<div class="smallfont" align="center">$vbphrase[all_times_are_gmt_x_time_now_is_y]</div>
<br />

$spacer_close
<!-- /content area table -->


        </td>

        <td width="150" valign="top" class="page" style="padding: $stylevar[cellpadding]px;">
                YOUR CONTENT HERE
        </td>

        </tr>
</table>

<form action="$vboptions[forumhome].php" method="get">

---

IN EITHER CASE...


Admin CP -> Styles & Templates -> Style Manager -> « » -> spacer_open

Replace the red code:

Code:

---

<!-- open content container -->
<if condition="$show['old_explorer']">
        <table cellpadding="0" cellspacing="0" border="0" width=" $stylevar[outertablewidth] " align="center"><tr><td class="page" style="padding:0px $stylevar[spacersize]px 0px $stylevar[spacersize]px">
<else />
        <div align="center">
                <div class="page" style="width:$stylevar[outerdivwidth] ; text-align:$stylevar[left]">
                        <div style="padding:0px $stylevar[spacersize]px 0px $stylevar[spacersize]px">
</if>

---

...with the blue code:

Code:

---

<!-- open content container -->
<if condition="$show['old_explorer']">
        <table cellpadding="0" cellspacing="0" border="0" width="100% " align="center"><tr><td class="page" style="padding:0px $stylevar[spacersize]px 0px $stylevar[spacersize]px">

<else />
        <div align="center">
                <div class="page" style="width: 100% ; text-align:$stylevar[left]">
                        <div style="padding:0px $stylevar[spacersize]px 0px $stylevar[spacersize]px">
</if>

---

---

This was obtained from VBulletin.com

Hoped it gives you some sort of idea on how they configure the front page.

cheers
front2back

Thanks for your post I am not using VBulletin but I will look at the code to see how it works.

Hi Riot


This site has an easy to read tut on web page design:

Arachnoid

thanks.