Jsyte.com PHP Website Tutorial

Build a PHP Website

About this tutorial

This tutorial teaches you how to make a website using PHP. This assumes you have installed a web server (such as Apache) and PHP and that you have some basic knowledge with HTML.

Making a Site Structure

Your site structure is the backbone, or skeleton, of your web site. A poor structure will be confusing to look at when editing and can causing linking errors. Compare these two images: Bad and Good. You should have noticed how nicer the good one looked. The good layout also makes it easier for a group to work on a web site.

Your first step in making a good structure is to make the folders. Here is a list of some "required" folders:

Notes:

For each "section" (such as pictures, articles, files, etc.), create a different folder. Each folder should have an index.php [*] or index.html in it. Therefore, when you link to the section, you can have the link be <a href="/pictures/">, which would lead to the pictures folder's index.html or index.php file.

Includes

What are includes? Includes are files that are separate from the page, but are included in the final document. You use includes to save up writing the same code over and over. The header include file should contain the regular html tags (<html>, <head>, etc), all the way before you have the actual content. It could be as plain as just having <html><body>, or get as complex as having variables passed to it. See this site's headers' source for an example of the flexibility of the includes.

Your include file should start off with the DTD (e.g. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">), then have the html and head tags. The title tag should looks like this <title>Site name [divider] <?php echo($page);></title> where Site name is the name of your web site and [divider] is any type of divider to show that after that is the name of the current page. Some examples of dividers are ::, :, ,, | or whatever you can think of!

Next, link to the stylesheet. Although I have not yet covered this, put this to link to the stylesheet that we will create. The way you can link to the style sheet is by placing this bit of HTML between the <head> and </head>: <link rel="stylesheet" href="/css/site.css" type="text/css" />

Place the <body> tag to end off the header.php include file. Now lets start work on the footer. The footer doesn't contain php code (although you can add some), it just has some copyright stuff, some buttons, and the </body> and </html> tags. See this site's footers' source.

Cascading Style Sheets

Cascading Style Sheets (CSS) are used to add color and lay out your pages. Before CSS, you had to place <font> tags and use attributes to stylize pages. That has been deprecated (No longer recommended for use), and now CSS is used. With CSS, you can change the entire site's colors and layout just by changing one file.

Start off by planning your colors and layout. This tutorial will teach you one way to make a CSS, but search on Google for different ways of making the CSS.



* By default, Apache does not look for index.php when you type just the directory (e.g. /pictures/). To do so, edit your httpd.conf file or put a .htaccess file, and add index.php to the DirectoryIndex directive. It should look somewhat like this: DirectoryIndex index.php index.html index.htm index.html.var