Home arrow Perl Programming arrow Page 2 - Building a Complete Website using the Template Toolkit

A “Hello World” HTML Template - Perl

See how the Template Toolkit simplifies the process of building and managing web site content. Examples illustrate the use of template variables and template components that allow web content to be constructed in a modular fashion. Other topics include managing the site structure, generating menus and other navigation components, and defining and using complex data. (From Perl Template Toolkit, Darren Chamberlain, Dave Cross, and Andy Wardley, O'Reilly Media, 2004, ISBN: 0596004761.)

TABLE OF CONTENTS:
  1. Building a Complete Website using the Template Toolkit
  2. A “Hello World” HTML Template
  3. Benefits of Modularity
  4. Loading the Configuration Template
  5. Creating a Project Directory
  6. A Place for Everything, and Everything in Its Place
  7. Adding Headers and Footers Automatically
  8. More Template Components
  9. Setting Default Values
  10. Wrapper and Layout Templates
  11. Using Layout Templates
  12. Menu Components
  13. Structured Configuration Templates
  14. Layered Configuration Templates
  15. Assessment
By: O'Reilly Media
Rating: starstarstarstarstar / 33
September 15, 2004

print this article
SEARCH DEV SHED

TOOLS YOU CAN USE

advertisement

We can address these issues by applying the basic principles of template processing. Rather than creating the HTML page directly, we write a template for generating the HTML page. In this document, we use template variables to store these values instead of hardcoding them.

Example 2-2 shows a source template for the HTML page in Example 2-1. The author’s name, page title, background color, and year have been replaced by the variables author, title, bgcol, and year, respectively.

Example 2-2. hello.tt

<html>
  <head>
    <title>[% author %]: [% title %]</title>
  </head>

  <body bgcolor="[% bgcol %]">
    <h1>[% title %]</h1>

    <p>
      Hello World!
    </p>
 
    <hr />

    <div align="middle">
      &copy; Copyright [% year %] [% author %]
    </div>
  </body>
</html>
 

Processing Templates with tpage

Of course, a template isn’t something a browser can make sense of. We need to process the template to generate HTML to send to the browser. Let’s use the tpage command we met in Chapter 1:

$ tpage --define author="Arthur Dent" \
>       --define title="Greet the Planet" \
>       --define bgcol="#FF6600" \
>       --define year=2003 \
>       hello.tt > hello.html

The hello.html now contains the same HTML that we saw in Example 2-1. This time, however, it has been generated from a template. The benefit of this approach is that we easily change any of these variable values and generate a new HTML page, simply by invoking tpage with a different set of parameters.

Template Components

Example 2-2 shows a template for generating a complete HTML page. We refer to this kind of template as a page template to distinguish it from the other kind of template that we’re now going to introduce: the template component.

We use the term “template component” to help us identify those smaller templates that contain a reusable chunk of text, markup, or other content, but don’t constitute complete pages in their own right. Template components are no different from page templates as far as the Template Toolkit is concerned—they’re all just text files with embedded directives that need processing and get treated equally. Examples of typical template components include headers, footers, menus, and other user interface elements that you will typically want to use and reuse in different page templates across the site.

When we start using ttree a little later in this chapter, we will need to be more careful about storing our page templates separately from any template components. For now, however, we can keep them all in the same directory, simplifying matters for the purpose of our examples. As a general naming convention, we use a .tt or .html file extension for page templates (e.g., hello.tt), and no extension for component templates (e.g., header), but this is entirely arbitrary. If you want to give them an extension (e.g., header.ttc), that’s fine.

Headers  and Footers

Our first components can be created easily. Extract the header and footer blocks from Example 2-2 and save them in their own header and footer template files, as in Examples 2-3 and 2-4.

Example 2-3. header

<html>
  <head>
    <title>[% author %]: [% title %]</title>
  </head>

  <body bgcolor="[% bgcol %]">
    <h1>[% title %]</h1>


Example 2-4. footer

    <hr />

    <div align="middle">
      &copy; Copyright [% year %] [% author %]
    </div>
  </body>
</html>

The PROCESS directive

We can now load these template components into a page template using the PROCESS directive. Example 2-5 shows this in action.

Example 2-5. goodbye.tt

[% PROCESS header %]
  <p>
    Goodbye World.
  </p>
[% PROCESS footer %]

When the Template Toolkit encounters a PROCESS directive, it loads the template from the file named immediately after the PROCESS keyword (header and footer are the two templates in this example), processes it to resolve any embedded directives, and then inserts the generated output into the calling template in place of the original directive.

We can use tpage to process the goodbye.tt template and save the generated output to goodbye.html:

$ tpage --define author="Arthur Dent" \
>       --define title="We'll Meet Again" \
>       --define bgcol="#FF6600" \
>       --define year=2003 \
>       goodbye.tt > goodbye.html

The output generated, shown in Example 2-6, shows how the header and footer have been processed into place and the variable references within them correctly resolved

Example 2-6. goodbye.html.

<html>
  <head>
    <title>Arthur Dent: We'll Meet Again</title>
  </head>
 
  <body bgcolor="#FF6600">
    <h1>We'll Meet Again</h1>

    <p>
      Goodbye World.
    </p>

    <hr />

    <div align="middle">
      &copy; Copyright 2003 Arthur Dent
    </div>
  </body>
</html>

The INSERT directive

The Template Toolkit provides a number of different directives for loading external template components. The INSERT directive, for example, inserts the contents of a template, but without processing any directives that may be embedded in it:

[% INSERT footer %]

INSERT is faster than PROCESS because there’s much less work involved in inserting a file than there is in processing it as a template. It’s not going to work for us in our current example because of the year and author variables in the footer that need resolving. If we INSERT the footer as it is, we’ll see the [% year %] and [% author %] directives passed through as literal text.

However, we can hardcode the variables in the footer to make it a fixed block of text that we can then load using INSERT . For example:

    <hr />
    
    <div align="middle">
      &copy; Copyright 2003 Arthur Dent
    </div>
  </body>
</html>

Although we’ve no longer got the benefit of using variables or other template direc tives, we are still defining the footer in one place where we can easily make changes, should we ever need to.

In most day-to-day applications, the difference in speed between INSERT and PROCESS isn’t going to be noticeable unless you really go looking for it. You’re generally better off using whatever is most convenient for you, the template author. Worry about performance only if and when it ever becomes an issue. With this in mind, we’ll leave our variables in the footer and continue to use PROCESS .

The other directives for loading templates are INCLUDE and WRAPPER , which we’ll be looking at shortly.

Buy the book!If you've enjoyed what you've seen here, or to get more information, click on the "Buy the book!" graphic. Pick up a copy today!

Visit the O'Reilly Network http://www.oreillynet.com for more online content.



 
 
>>> More Perl Programming Articles          >>> More By O'Reilly Media
 

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort
   

PERL PROGRAMMING ARTICLES

- Perl Turns 25
- Lists and Arguments in Perl
- Variables and Arguments in Perl
- Understanding Scope and Packages in Perl
- Arguments and Return Values in Perl
- Invoking Perl Subroutines and Functions
- Subroutines and Functions in Perl
- Perl Basics: Writing and Debugging Programs
- Structure and Statements in Perl
- First Steps in Perl
- Completing Regular Expression Basics
- Modifiers, Boundaries, and Regular Expressio...
- Quantifiers and Other Regular Expression Bas...
- Parsing and Regular Expression Basics
- Hash Functions

Developer Shed Affiliates

 


Dev Shed Tutorial Topics: