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

i want to use external css with html template in cgi perl programing how to use this. help

Replies are listed 'Best First'.
Re: Html Template CSS and CGI PERL
by Thilosophy (Curate) on Dec 28, 2004 at 08:59 UTC
    You can include a CSS file with a style tag from your HTML file. How you produce that HTML file (HTML::Template, Template Toolkit, manually, static file) makes no difference. All you have to make sure is that the URL path to the CSS file is correct and that the web browser can see it, maybe you have to use absolute paths. Including CSS works the same way as including images.

    And let me just add that using CSS is a very good idea. It can greatly simplify your HTML (templates) and you can make significant design changes without having to touch the templates (or your program) at all.

[reply]
      thanks for help but when i tried this it didnot work.I had put css file in link tag saved the template in html folder and called it through cgi script but the css was not implemented .Is this beacuse of mozilla ? or what else has to be done please help ana711
[reply]
        Can the browser load the CSS file? Just try to type the URL for the CSS file in the browser location bar. If not, the URL is maybe wrong. Do you get any File Not Found (404) errors in your web server log?

        Where did you put the CSS file? It has to be in the web server document root, which is probably not where you keep your HTML templates. Try to put it in the same folder as one of your images and use the same URL path as for that image.

[reply]

        In addition to Thilosophy's excellent advice, you might get more help if you posted some code, especially the css that is not being implemented.

        Anne

[reply]
Re: Html Template CSS and CGI PERL
by Anneq (Vicar) on Dec 28, 2004 at 14:35 UTC

    Put a link element in the header of your template file:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html>
<head>
    <title><TMPL_VAR NAME=TITLE></title>
    <base target="_self">
    <link rel="stylesheet" type="text/css" href="External.css">
</head>
<body>
    ....
</body>

    [download]

    You could go a step further and dynamically change your stylesheet by using a template variable for the sytlesheet filename.

    For even more flexibility, use template toolkit instead of HTML::template. This would give you the ability to put variables in a stylesheet file, which would be processed before rendering to the browser:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html>
<head>
    <title>$Page.title</title>
    <base target="_self"/>
    <style type="text/css">
        <!-- @import 'path/to/css/main.css'; 
             [% PROCESS "path/to/css/theme.css" %] 
             body { font-size: ${font_size}pt; }
             p { font-size: ${font_size}pt; }
        -->
    </style>
</head>
<body>
 ....
</body>
</html>

    [download]

    In the above example, the main stylesheet is imported, a stylesheet with variables (theme.css) is included, and then additional styles are explicitly added to override those in the first two stylesheets.

    A drawback with this method is that the styles from theme.css show up when a user looks at the page source, because those styles get embedded in the html document.

    Anne

[reply]
[d/l]
[select]
Re: Html Template CSS and CGI PERL
by bradcathey (Prior) on Dec 28, 2004 at 14:11 UTC

    I do this all day long—cgi, HTML::Template and CSS. All you need is the link tag. And it really has little or nothing to do with HTML::Template.

    <link rel="stylesheet" href="../admin.css" type="text/css" media="screen" />

    —Brad
    "Don't ever take a fence down until you know the reason it was put up." G. K. Chesterton
[reply]
[d/l]
[select]
Re: Html Template CSS and CGI PERL
by Xenograg (Scribe) on Dec 28, 2004 at 15:00 UTC
    You did not state whether or not you are using the CGI module. If so, declaring an external CSS sheet is documented:

    print $query->start_html( -style => {'src'=>'http://www.mystyle.com/styles/style.css'} );

    ---
    The harder I work, the luckier I get.
[reply]
[d/l]

      I do not think using CGI's HTML generation methods counts as a template. I suppose you could move all the HTML generating code into a module, and call it your template, but I'm still rather dubious of that. I think he meant something more along the lines of HTML::Template or Template-Toolkit.

[reply]
Re: Html Template CSS and CGI PERL
by injunjoel (Priest) on Dec 29, 2004 at 18:09 UTC
    Greetings all,
    Make sure the path that comes through from your HTML::Template generated page is the actual path to the CSS file. Sometimes I have found the developers designing the HTML templates use document relative paths to the CSS file in order to test their design. Once this is used in the CGI scripts via HTML::Template the paths all change. I would view source on your generated page and make sure that is the path you want. If not you will have to change it in your Template file to get it to work. Try making the path root relative, so instead of something like:
    <link rel="stylesheet" type="text/css" href="../css/your.css">
    try
    <link rel="stylesheet" type="text/css" href="/css/your.css">
    That way its the servers problem of finding it and not yours.
    Just a thought.

    -InjunJoel
    "I do not feel obliged to believe that the same God who endowed us with sense, reason and intellect has intended us to forego their use." -Galileo
[reply]
[d/l]
[select]

Back to Seekers of Perl Wisdom