Beefy Boxes and Bandwidth Generously Provided by pair Networks
more useful options

Template Toolkit Question

by Perobl (Beadle)
on May 19, 2010 at 20:27 UTC ( #840781=perlquestion: print w/replies, xml ) Need Help??

Perobl has asked for the wisdom of the Perl Monks concerning the following question:

I am a TT2 newbie. I'm using TT2 to create dynamic web pages using CGI Perl. I have set up a simple site to test my configuration running locally on Apache2. For the most part, everything is working great.

However, my images and external CSS files can't be accessed by my dynamic pages. I have my image files saved to assets/images inside my site's root directory: /Users/mysilmaril/Sites/WIW/assets/images

Likewise, my CSS file is saved to /Users/mysilmaril/Sites/WIW/css

This is all very standard stuff. When I access my CGI script from an HTML page (via a form) it utilizes TT2 to generate a wrapper and then it generates some simple text inside the [% content %] directive. This part is working great.

The images and external CSS can't be found because the dynamic page is being generated by the CGI script in the cgi-bin directory. I could hard code relative paths into my wrapper to solve this problem, but this is not an idea solution for me.

I'm sure there is a way to solve this problem through TT2's configuration, but I can't figure out how to do it. I'm pasting my test CGI script below:

#!/usr/local/bin/perl use strict; use warnings; use Template; use CGI; my $cgi = CGI->new(); my $tt = Template->new({ INCLUDE_PATH => [ '/Users/mysilmaril/Sites/WIW/templates/src', '/Users/mysilmaril/Sites/WIW/templates/lib/site', '/Users/mysilmaril/Sites/WIW/templates/lib/config', '/Users/mysilmaril/Sites/WIW/cgi-bin', '.', ], WRAPPER => 'wrapper', }); my $input = ''; my $vars = { cgi => $cgi, }; print $cgi->header; $tt->process($input, $vars) || die $tt->error();
My template file:
<tr> <td colspan="2" align="center" height="200"> <ul> [% FOREACH p = cgi.param -%] <p><b>[% p %]:</b>&nbsp;[% cgi.param(p) %]</p> [% END -%] </ul> </td> </tr>
My wrapper is s standard HTML page (header, footer). I'll paste the HTML for my CSS here as an example:
<link rel="stylesheet" type="text/css" href="css/wiw.css" />
If I change href="wiw.css" to href="../css/wiw.css" it will load fine, but this is what I want to avoid doing. Can I configure this in TT2? Thanks!

Replies are listed 'Best First'.
Re: Template Toolkit Question
by almut (Canon) on May 19, 2010 at 20:43 UTC

    Maybe I'm misunderstanding, but I don't really see any involvement of TT2 here.  If you don't want relative URLs, why don't you use absolute ones? I.e.


    presuming the document root / is set up to correspond to the WIW directory.

      That might be an absolute path(?). But an absolute URI needs the server and protocol, no? href="/css/wiw.css" is relative to the server root.

        That might be an absolute path(?). But an absolute URI needs the server and protocol

        Sure, but I deliberately used "URL" to make it clear that we're not talking about directories on the server here, but rather what the path part of the URL maps to via the web server configuration.

        href="/css/wiw.css" is relative to the server root.

        Yes, but in this sense you could also say that a path like /usr/local is relative to the root of the file system :)

      I think absolute URLs are turned off by default in TT2. Isn't there a reason for this?

      Allow me to provide some additional information. I chose to use TT2 because I want to separate the code from the HTML as much as possible. Ideally, I'd like to give our web designers creative control of the HTML (they are not coders).

      They will be creating the HTML using Coda (an editor). All of the image links in the HTML are relative to the site's root directory (and this is fine by me). I would simply like to grab their HTML code and drop it into my TT2 wrapper whenever they make changes. I will then send my CGI generated output to the page using the [% content %] directive. Very clean solution for us.

      The only problem is, I haven't figured out a way to make the image links work (or the external CSS for that matter).

      I think I can use a TT2 config template, such as:

      [% root = '/Users/mysilmaril/Sites/WIW' images = '$root/assets/images" %]
      And then in my HTML image tags ... <img src="[% images %]/logo.jpg">

      However, this would still require us to hardcode the [% images %] TT2 variable into the HTML. I was hoping to avoid this, but maybe it isn't possible?

      Hope I'm not confusing everyone ...


        I think the easiest solution would be to have your designers type src="/images/logo.jpg"href="/css/wiw.css", etc. and then put the respective files in the directories

        /Users/mysilmaril/Sites/WIW/images /Users/mysilmaril/Sites/WIW/css

        (with /Users/mysilmaril/Sites/WIW/ being the webserver's configured document root)

        In this case, no additional mapping of path components like /images —> /assets/images would be required (via TT2 [% images %] or whatever).

        If you can't get your designers to type anything other than src="/logo.jpg", you could set up a RewriteRule to prepend /assets/images to any URI-path that ends in .jpg, .png, .gif, etc.

        P.S.: if you're going to use

        [% root = '/Users/mysilmaril/Sites/WIW' images = '$root/assets/images" %] ... <img src="[% images %]/logo.jpg">

        I'm pretty sure you don't want the /Users/mysilmaril/Sites/WIW part in there, as the image would then (most likely) be searched under

Re: Template Toolkit Question
by assemble (Friar) on May 21, 2010 at 13:06 UTC

    The way I do it, I put all my paths and configuration in a module or something like that, so I can access it in Perl. From there, you can make them available in TT by modifying your ->new call like this:

    my $tt = Template->new({ INCLUDE_PATH => [ .... '/Users/mysilmaril/Sites/WIW/cgi-bin', '.', ], WRAPPER => 'wrapper', VARIABLES => { IMAGE_URL = "/assets/images", CSS_URL = "/assets/css", STUFF = $Module::Stuff } });

    Then you can access them in your template like this:

    <html> <head> <link rel="stylesheet" type="text/css" href="[%CSS_URL%]/wiw.css" /> </head> <body> <p>blah blah <img src="[%IMAGE_URL%]/image.png" /> <p>blah blah <p>Something else: [%STUFF%] </body> </html>

Log In?

What's my password?
Create A New User
Domain Nodelet?
Node Status?
node history
Node Type: perlquestion [id://840781]
Approved by Corion
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others wandering the Monastery: (5)
As of 2021-09-25 03:34 GMT
Find Nodes?
    Voting Booth?

    No recent polls found