SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Enthusiast Gamblingharry's Avatar
    Join Date
    Apr 2003
    Location
    UK
    Posts
    83
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Server side coding in CSS

    Jus working on a new site, and found myself wondering if anyone has used PHP in .css files? I think it would be useful for storing stuff like colours, and maybe margin sizes etc.

    Would I be right in thinking you would just need to tell your server to process .css as PHP? or wouldnt that work?

  2. #2
    Ensure you finish what you sta bronze trophy John Colby's Avatar
    Join Date
    Aug 2003
    Location
    University of Central England, U.K.
    Posts
    487
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Gamblingharry
    Jus working on a new site, and found myself wondering if anyone has used PHP in .css files? I think it would be useful for storing stuff like colours, and maybe margin sizes etc.

    Would I be right in thinking you would just need to tell your server to process .css as PHP? or wouldnt that work?
    Won't work.

    The CSS (link or import) is processed at the browser, not on the server. It's the php that's processed on the server - you're looking for a php file extension. You'd be asking the php processor to concurrently process two files, one normal php and one css/php. When you consider the timing of the operation the browser may not make the call to the server at the correct time (too early) and the CSS may be being constructed, so you may not get the response you're expecting, unless you could look for installing some artificial delay, but that will impact on both server and client.

    If you want to generate included CSS files from php then this is possible, but I don't think 'on the fly' of separate files will be very successful. However you are not going to be able to take advantage of CSS cacheing as all your CSS will have to be downloaded every time.

    And of course the next post on this forum will prove that someone's done it.

    If you're going to construct CSS files from components, have you thought of the @import function at the head of the CSS file?
    John
    No electrons were harmed during the creation, transmission
    or reading of this posting. However, many were excited and
    some may have enjoyed the experience.

  3. #3
    SitePoint Enthusiast Gamblingharry's Avatar
    Join Date
    Apr 2003
    Location
    UK
    Posts
    83
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ah ok.

    I though that it could work like normal php maybe. I.e. when a users browser asks for a php file, the file is sent through the PHP processor first, then sent to the user. So with a css file, it could be sent through the PHP processor first, then on to the user, to be used for layout.

    Not quite sure how the PHP processor would be being asked to process to files at once though. Wouldnt the index.php be processed first, then sent to the browser, then the browser has to ask for style.css (cos it only knows to ask for this when it has received index.php). So then the .css file could be sent through the PHP processor.

    Anyway, Ill go check out this @import css thingy...

  4. #4
    Ensure you finish what you sta bronze trophy John Colby's Avatar
    Join Date
    Aug 2003
    Location
    University of Central England, U.K.
    Posts
    487
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's some code I use with importing a main.css into another.

    Code:
    @import url(main.css);
    body {
    background: #000;
    color: #ff0;
    }
    h1, h2, h3, h4, h5, h6, .essential, #footer, #prevnext {
    color: #ff0;
    }
    All it does is change colours - I use clientside scripting with cookies to control the change by request from the viewer - my main.css controls everything else.
    John
    No electrons were harmed during the creation, transmission
    or reading of this posting. However, many were excited and
    some may have enjoyed the experience.

  5. #5
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you CAN set up your webserver to process .css files through php. or you can just point to a .php file in your <link rel="stylesheet"> (making sure that the php send out the header for Content-Type: text/css). and yes, you can then generate css on the fly.
    as for the caching, if you want it to be cached, you may want to look into setting the Last-Modified etc in the header that php sends out).
    so yes, quite feasible.
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com

  6. #6
    Ensure you finish what you sta bronze trophy John Colby's Avatar
    Join Date
    Aug 2003
    Location
    University of Central England, U.K.
    Posts
    487
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by redux
    you CAN set up your webserver to process .css files through php. or you can just point to a .php file in your <link rel="stylesheet"> (making sure that the php send out the header for Content-Type: text/css). and yes, you can then generate css on the fly.
    as for the caching, if you want it to be cached, you may want to look into setting the Last-Modified etc in the header that php sends out).
    so yes, quite feasible.
    Have you proven it with timing issues over a public network? I'd be interested if you have - we'd always taking the timing issue to be crucial and for those servers that were not under our direct control difficult to administer.
    John
    No electrons were harmed during the creation, transmission
    or reading of this posting. However, many were excited and
    some may have enjoyed the experience.

  7. #7
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    john, the time it takes php to output a page and/or css file is infinitesimal, unless we're talking about a site that get hundreds of hits per second, the extra strain of creating a small css file is negligible, and the timing issue should be no different from the normal strain that apache and the filesystem are put under when a normal request for a page + a css file come in.
    of course, i wouldn't advise doing expensive operations such as large database queries etc in the php that generates the css file, as that might indeed cause some issues...

    anyway...see if there's any issues by hitting http://www.salford.ac.uk/stuff/colbytest.php as hard and often as you can

    and the stylesheet's rough and ready php code
    PHP Code:
    <?php
    // send correct header
    header("Content-type: text/css");
    // seed random number generator
    srand ((double) microtime() * 948625);
    // output css
    echo '/* css file generated via PHP at '.date('H:i:s')."*/

    body {
        background: #"
    ;
    // generate random background color
    for($i=0$i<3$i++) {
        echo 
    rand(0,9);
    }
    echo 
    ";
        color: #"
    ;
    // generate random foreground color
    for ($i=0$i<3$i++) {
        echo 
    rand(0,9);
    }
    echo 
    ";
    }
    "
    ;
    ?>
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com

  8. #8
    SitePoint Enthusiast Gamblingharry's Avatar
    Join Date
    Apr 2003
    Location
    UK
    Posts
    83
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Cool! Cheers redux, thats a great example! Think i will have a look into sorting this sort of thing for my site (not random colours tho )

  9. #9
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    an alternative approach would also be to just write styles within a <style type="text/css"> block in your document <head>.

    a good idea would be to only generate the styles that are truly user-definable, and still have a general, normal (i.e. non-script-generated, properly cached, etc) stylesheet there. so, for instance, you could have

    Code:
    <head>
    <title>your title</title>
    <link rel="stylesheet" href="/common/general.css" />
    <link rel="stylesheet" href="/common/user_defined.php" />
    </head>
    
    or
    
    <head>
    <title>your title</title>
    <link rel="stylesheet" href="/common/general.css" />
    <style type="text/css">
     [HERE YOUR PHP WRITES OUT THE USER SPECIFIC STYLES]
    </style>
    </head>
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com

  10. #10
    Starting to-digg-in ********* jamesxv7's Avatar
    Join Date
    Oct 2003
    Location
    Island of Puerto Rico @ the Caribbean
    Posts
    873
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Great trick! Does it have any disavantange?
    James: Ecodig - My Blog - My Gallery
    Validate your sites: CSS - HTML/XHTML
    Without faith you are lost.

  11. #11
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jamesxv7
    Great trick! Does it have any disavantange?
    as was mentioned before, caching (unless you take special care of it via specifically written Last-Modified headers in the generated css) and putting a tiny amount of extra strain on the server (which would get noticeable if you have huge traffic to the site)
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com

  12. #12
    Starting to-digg-in ********* jamesxv7's Avatar
    Join Date
    Oct 2003
    Location
    Island of Puerto Rico @ the Caribbean
    Posts
    873
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I will try to implement it.
    James: Ecodig - My Blog - My Gallery
    Validate your sites: CSS - HTML/XHTML
    Without faith you are lost.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •