Jump to content


Photo

Php Web Template


  • Please log in to reply
No replies to this topic

#1 thedesignstudent

thedesignstudent

    Family Friend

  • Members
  • PipPip
  • 31 posts

Posted 01 March 2008 - 03:09 AM

A Simple PHP Web Template
by David Alderson


This is to show you how easy it is to create a PHP enabled web site.
I'm including the basic html and php code here.
Plus I'm sharing my file structure for the web site I created this past hour.



Features
A header, a footer, a menu on the left and one on the right with content floating in the middle. There's also a sub-header I call a sales_menu because I'm using it for rotating sales banners on a daily or weekly basis.

Update 1,000's of web pages at once, by dragging and dropping a single file!


The Code

<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Web Site Title</title>
</head>

<body>
<?php include 'header.php'; ?>
<?php include 'sales_menu.php'; ?>
<div align="center">
<center>
<table border="0" cellpadding="10" cellspacing="0" style="border-collapse: collapse" bordercolor="#FFFFFF" width="85%" id="AutoNumber1" bgcolor="#FFFFFF">
<tr>
<td width="20%"><?php include 'left_menu.php'; ?></td>
<td width="53%">
<p align="left" style="margin-top: 0; margin-bottom: 0">content</td>
<td width="27%"><?php include 'right_menu.php'; ?></td>
</tr>
</table>
</center>
</div>
<?php include 'footer.php'; ?>
</body>

</html>


Where it says CONTENT - You place your page content. The rest is calling upon php files to create your header, footer and left and right sided menu's, similar to those on my site, found here.


File Structure

content_images
footer_images
header_images
htm_files
php_files
right_images
sales_images
left_images

This is what my file structure looks like in Front Page and what it could look like for you when you design your site.

When you copy and paste your images into the folder after you've built your footer or header or menu in the htm design view, Front Page points the html code to that folder without you having to do any manual pointing yourself.

It's neatly tucked away, so that way you drag and drop your entire folder in Coffee Cup Free FTP or a similar program, having all your images neatly organized for each php file.


HTM and PHP Files

I have created a folder for htm files and php files.

I do all of my editing in the htm view and then I copy the page into my php folder and change the htm extension to .php

This allows me to click on the htm file in Front Page and have it automatically pop up in design view for editing.

If you click on a php file, it opens a notepad style view for editing, rather than a Front Page design view, which I like.


My PHP Files
As noted above in the code.

header
sales_menu
left_menu
right_menu
footer

The Code
<?php include 'header.php'; ?>

Alter as needed.
header.php
footer.php
left_menu.php
right_menu.php
sales_menu.php






Clean Design

I find this method great for clean design.


BETA Testing and Added Benefits

What's great about this method of using PHP files is that I'm able to beta test a web site. I can create a sub-domain on my account and create active hyperlinks that work and publish the web.

I'm working on something right now that I'd like to purchase some server space and a domain name for.

This way I can get everything up and running and tested on a locked sub-domain on my existing account.

Rather than having to edit hundreds and maybe thousands of hyperlinks to point to the actual registered address, all I have to do now is change the links in the .htm footer, header, right_menu, left_menu and sales_menu. Copy them to my php folder in Front page and change the extension to .php and upload them to the server.

Now I've updated literally hundreds or possibly thousands of hyperlinks, and I can see my site live as it would be working tonight!


On Front Page
I have Dreamweaver MX and the latest Front Page, but I prefer Front Page.
Many people would argue Dreamweaver is a far superior program, but I preferred my latest greatest Front Page to Dreamweaver CS3 because I know so many of the hot keys and can create without letting my hands leave the keyboard, or with having my left hand always on the keys and my right hand always on the mouse for long periods of time.

For me, learning Dreamweaver MX is something I'm doing slowly, but Front Page is definitely my program, and now that I tonight learned how to create with basic PHP, you have no idea. I can apparently barely wait to get going, since I was ready for bed and 2 hours later had a new web site and a tutorial up and running.


Conclusions
I now have IE, Firefox, Safari, Opera and Camino all on my system, and it's amazing how different my pages look on each different browser. That's where I'm headed next. Creating flexible pages that look great on as many browsers as possible.

My site is supposed to float on a white background, but I've noticed how many different browsers show my automatic frame colors in black, when they should be in white, so I'm learning every hour of every day.

I hope this tutorial takes some of the intimidation out of PHP and puts the power in your hands immediately to start using it in your web sites today.
:(

see my other php tutorial here. php in 5 minutes or less.

Edited by thedesignstudent, 01 March 2008 - 03:37 AM.





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users