Layout system using functions
By: Jool
Learn how to use functions in a layout system
This is a follow-up to my previous entry on custom functions. We will be using them a lot here so make sure you know what they are all about before continuing. This is a basic way to make your layout centralized, so when you want to change the layout of your entire site you only need to edit one file.
So, create a new .php file, I’ll call mine backend.php. What we are going to be doing is creating custom functions which echo our layout’s HTML code, which means in our pages all we need to do is call each function instead of typing out the whole code.
I have commented within the code below about what each part means.
<?php
function layout_head() { // This is for the opening portion of our page
echo ('
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="style.css" title="normal" />');
}
function end_head() { // End of head tags, notice <title> is excluded, you can add if you like
echo ('
</head>
<body>
');
}
function end_page() { // Copyright End This is the end of the page, closing tags of your HTML
echo ('
</body>
</html>
');
}
?>
So we have our basic html, when I mean basic this is about as simple as it gets. Obviously yours will be a lot longer, with all your images, navigation and footer, etc, etc. The title tags are excluded because that way you can have personalized title's for all pages instead of having the same page title all across your site, if you want the same title then just add it into the backend and remove it from below. Anyway, moving on, once we have these functions defined in our backend.php we can save it, and open up another .php page. In this onee, if you remember from earlier, all we have to do is included our backend file and then call our functions and voila, our pages is displayed.
<?php
require ("backend.php"); // Require our backend file, otherwise our functions won’t function
layout_head();
echo "<title>YOUR TITLE</title>"; // If you included <title> tags in your backend, then remove this
end_head();
?>
<h1 align="center">My content</h1>
<br />
As you can see this section isn't part of the php tags, this is to give more freedom when making your content, so you don't have to echo everything you can just put it in normally!
<br />
<?php
footer_end_page(); // Call the end of our html tags
?>
Save that as a .php, upload them both and go have a look. If you followed along your page should be working good. This is a very simple example of how to use this technique, you can have as many or as little functions as you like, it all depends on what you need to do. The major advantage of this is you can edit your entire site’s design by editing your backend, and your content will remain untouched. All in all, it is very useful, so be sure to play around with this as there are a multitude of possibilities and routes you can go to expand upon this basic tutorial.
|
