Making A Simple Webpage Generator: Part 1 The Layout

This tutorial is based on a webpage generator I made (for my users with little or no HTML knowledge) after spending about 3 months collecting javascripts, code snippets, layouts, and all that other good stuff. Since this takes quite a few steps, and I'm dead tired, I'll be posting this tutorial in 3 parts:

Part 1- Create The Template

Part 2- Make The Form

Part 3- Fill The Template

The template will be the container for all the passed variables collected by the form. It doesn't have to be anything extravagant... The simpler the better! Now let's Get Started...

Step 1. Make a simple template with 6 sections. These sections will be for the header, the menu (3 links), news, an image, the main content , and the copyright. For the sake of the tutorial, I have uploaded one here.

Step 2. Fill these sections with a little bit of info, just to make sure everything will look okay in the end.

(example)

Step 3. Replace the info you entered with variables such as $title, $link1text, $link1url, $img, $news, $main, etc.

(example)

Step 4. Preview the page. You should see the template you created intact (take fixed and expanding widths into consideration... it could screw up your layout if too much or too little information is entered into the template) but with variables in place of your info.

You're 33% done! Now onto the form...