Robs Forum

12 Apr 2009 23.01
Creating Dynamic Websites

Websites fall into two main categories.
Fixed or static html designs that are meant to provide information or contact details and dynamic interactive sites that use a combination of web technologies.

HTML has been around a long time. Since the early days of Web Browsers HTML has had a few advances but remains much as it was since the concept of <tags> were invented. As new concepts were added to web browser releases the HTML web page became more powerful but still remained static.

By combining HTML with Java, ASP or PHP the web developer could use client or server side tools to make websites smarter. Discussion forums were born. Smart web tools gave us a third dimension to work with. Databases meant we could store and recall information like usernames and passwords.

The HTML web page can contain smart tools to make any basic site into a dynamic and useful place to visit. One of the great things about the PHP scripting language is its ability to live happily in an HTML page. Take standard HTML code, change its name from index.html to index.php and you have the start of a dynamic web page. Put the PHP start and finish tag name into the page and you're writing in PHP. Use the 'include' command in your PHP script and you can insert PHP from another page into your main page.

<!-- This is a comment tag. We use it when we want to explain something -->
<html> <!--always start with a html tag-->
<head> <!--this is the Head of the page-->
<title>The Webpage Title</title> <!--Title of the page-->
</head> <!--we end the Head-->
<body> <!--now we start the body-->
<table> <!--use a table to keep things organised-->
<tr> <!--a table row is like rows and columns in a spreadsheet-->
<td> <!--a table data tag is where we put our information-->
<img src="picture.jpg"> <!--this is a picture in our table data box called picture.jpg-->
</td> <!--now we close our table data tag-->
<td> <!--lets open another table data tag-->
<b>This is some bold text</b> <!--we put some bold text in our table data box-->
</td> <!--now we close this table data tag-->
</tr> <!--we also close our table row-->
</table> <!--we have finished with our table so we close it too-->
</body> <!--we close our body tag-->
</html> <!--and lastly we close our html tag-->

Well that looks pretty simple, right?
To make this a little easier to read we use indents so we can see our nesting of tags.

<html>
 <head>
  <title>The Webpage Title</title>
 </head>
 <body>
  <table>
   <tr>
    <td>
     <img src="picture.jpg">
    </td>
    <td>
     <b>This is some bold text</b>
    </td>
   </tr>
  </table>
 </body>
</html>

The opening tag <xxx> should usually be accompanied by its closing tag </xxx> although in some cases there are tags that dont have open and close tags like the <img> tag.

Lets add some PHP to our web page. That bold text inside the <b> and </b> tags is a good candidate for some dynamic magic. Lets replace it with a PHP tag. Dont forget to change the file name from index.html to index.php

<html>
 <head>
  <title>The Webpage Title</title>
 </head>
 <body>
  <table>
   <tr>
    <td>
     <img src="picture.jpg">
    </td>
    <td>
     <?php include("text.php"); ?>
    </td>
   </tr>
  </table>
 </body>
</html>

We have used the 'include' command to insert the contents of text.php into our page.
If text.php was a program for editing text you could use it to easily edit the information you want shown on your website. A great little PHP news management program is Easy News.
You log in to the News Editor and create your news items. The items are then displayed on your webpage where you used the 'include' PHP command.

To get more information on Easy News please visit http://code4fun.org/easynews/

I have created a website using the tools mentioned in this article. Please take a look at http://www.eternalmaiden.com to get an idea of how simple the process is.

Thanks,

Robert Arrowsmith.

- Robert

Reply to this post:
Subject:
Body:
Name:
Enter
E-Mail:
E-Mail followups
* Any word starting with http:// will be made clickable
[Back]


This site and design is copyright 2008 RobsWebsites.com