Latest Websites

Die Kak Pot

Saffa Kakhuis, my alter ego, decided to start playlisting songs from SaffaTunes in the form of a podcast, to boost...>>read more.

SaffaTunes.com

SaffaTunes.com is my own hobby site, I have always been a huge fan of South African music, after having moved to London I was finding it difficult to stay up to date...>>read more.

My Blog

Web Design Strip

Google Update

Working on some search engine optimisation, to my surprise, google.....
read more.

Hacked Off by Cordi

I was busy at the computer last night, when I notice that my site is being viewed by persons in Indonesia, well visitors are visitors, oh by the.....
read more.

Tutorials Index

  1. 2

  2. Smarty Functions

    1. This URL Smarty Function

  3. Smarty Pagination Plugin

    1. Pagination Class
    2. Smarty Pager Function

  4. Build a scalable website/weblog/cms

    1. Getting Started
    2. Build the Foundations
    3. Dynamic SEO Friendly URL
    4. PHP Helper Classes

Tutorials Intro

These tutorials reflect personal projects while practicing of new tools, ideas, techniques and technologies. They can not be used on their own as a final solution for any website.

I will be using xHTML, CSS and PHP in most of the tutorials so a basic understanding of each will be ideal but not a requirement if you work each tutorial from the beginning. I will also be making use of the jQuery javascript API for effects, AJAX and loads more.

My personal favourite has got to be the versatile and highly scalable php Smarty Template Engine, so almost everything I build uses it. I'm not on my own in working with and trusting the smarty template engine, there are loads of large names out there using it, Jamroom, XOOPS CMS, Movable Type, WHMCS, Serendipity, CMS Drupal to name a few, go to Smarty's Resources page for more.

Getting Started


Tutorial:  Build a scalable website/weblog/cms

Skills:     xHTML, php, smarty

Goal:      Build site structure and create a template.

To start off, create an empty index.php file in the root or a subfolder of your website (I'll refer back to this folder as the root folder in future). Continue by creating subfolders in the root folder namely:

  • /includes/,
  • /lib/,
  • /templates/,
  • /templates_c/,
  • /configs/,
  • /cache/,
  • /scripts/,
  • /css/
  • /images/

In each folder create a blank index.html file.

The site's folder structure complete, we can now get started with downloading, unpacking and uploading the Smarty Template Engine from www.smarty.net/download.php (The latest stable release was Smarty v2.6.26, Smarty 3 was still in beta development.) In the includes/ folder create a subfolder named Smarty/ and upload the contents of the lib folder of the unpacked download into it. You will now have:

  • /includes/Smarty/,
  • /includes/Smarty/plugins/
  • /includes/Smarty/internals/

Set the file permisions of /templates_c/ and /cache/ to chmod 0777.

We are now ready to get started with developing a scalable website.


/index.php
<?php
//include our Smarty class file
require 'includes/Smarty/Smarty.class.php';
//create a new Smarty object
$smarty = new Smarty();
//assign a value to a variable for use in our template
//$smarty->assign('var','value');
$smarty->assign('title','Web Master Tutorials');
$smarty->assign('content','This is the the content that will be assigned to the $content variable in the .tpl file called with $smarty->display()');
//Now we tell the object to display a template
$smarty->display('index.tpl');
?>

/templates/index.tpl
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{$title}</title>
</head>
<body>
<h1>{$title}</h1>
<p>{$content}</p>
</body>
</html>

Save and upload your files and open the root folder in a web browser.