SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    Get my greedy down dotJoon's Avatar
    Join Date
    Apr 2003
    Location
    daejeon, South Korea
    Posts
    2,223
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    php variable in css file

    Code:
    <?php
    $widthVariable=200;
    ?>
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <link href="widthVariable.css" rel="stylesheet" type="text/css">
        <title>widthVariable</title>
    <style type="text/css"> 
    .widthVariable {width:<?php echo $widthVariable ?>px;background-color:yellow}
    </style>
    </head>  
    <body>
    <div class="widthVariable">
    myDiv
    </div>
    </body>
    </html>
    In the code above, I can change the width of div by changing the $widthVariable.

    I like to remove the part below in the page above.
    Code:
    <style type="text/css"> 
    .widthVariable {width:<?php echo $widthVariable ?>px;background-color:yellow}
    </style>
    Instead of removing the code abvoe, I like to put the code below into the widthVariable.css.

    Code:
    .widthVariable {width:<?php echo $widthVariable ?>px;background-color:yellow}
    But the green part of the code in widthVariable.css doesn't work because it's PHP code in css file.

    Is there any way to make php code in a css file do work ?

  2. #2
    SitePoint Wizard wonshikee's Avatar
    Join Date
    Jan 2007
    Posts
    1,223
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    You would have to parse a non css file and do a replacement.

    Alternative is 3rd party CSS replacements software, like LESSC or SASS, which provides variables and other useful features.

    However if you're bent on not using those, you could do something like

    .widthVariable { width: {widthVariable}px;background-color:yellow }

    Then run the non-css file through PHP and str_replace {widthVariable} with an actual value, then the resulting data gets saved onto an actual css file.

    Hope that makes sense.

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,177
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Try putting double quotes around the variable:

    Code:
    .widthVariable {width:<?php echo "$widthVariable" ?>px;background-color:yellow}
    EDIT: this implies that this is in the HTML page itself, not in the CSS file.

  4. #4
    Get my greedy down dotJoon's Avatar
    Join Date
    Apr 2003
    Location
    daejeon, South Korea
    Posts
    2,223
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by wonshikee View Post
    You would have to parse a non css file and do a replacement.

    Alternative is 3rd party CSS replacements software, like LESSC or SASS, which provides variables and other useful features.

    However if you're bent on not using those, you could do something like

    .widthVariable { width: {widthVariable}px;background-color:yellow }

    Then run the non-css file through PHP and str_replace {widthVariable} with an actual value, then the resulting data gets saved onto an actual css file.

    Hope that makes sense.
    I have 2 files which are index.php and widthVariable.css.
    What is the non-css file between index.php and widthVariable.css?
    Do you mean index.php?

  5. #5
    SitePoint Wizard wonshikee's Avatar
    Join Date
    Jan 2007
    Posts
    1,223
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    You need a faux css file, that holds your unparsed CSS, then the real CSS file will be a parsed version. It could technically be a .css file as well, but the point is - it's not the one you serve w/ your website.

    This should illustrate it better:

    style.css.php:
    PHP Code:
    .widthVariable width: {widthVariable}px;background-color:yellow 
    index.php
    PHP Code:
    $css file_get_contents('style.css.php');
    $css parse_css($css); # function that swaps the tokens for real values
    file_put_contents('style.css'$css);
    # ... blah blah blah 
    Then you serve style.css, which isn't the raw data file. Does that clear it up a bit?

  6. #6
    SitePoint Mentor bronze trophy
    John_Betong's Avatar
    Join Date
    Aug 2005
    Location
    City of Angels
    Posts
    1,833
    Mentioned
    73 Post(s)
    Tagged
    6 Thread(s)
    Try this:

    #widthVariable.php
    PHP Code:
    <?php
      header
    ("Content-type: text/css;charset:UTF-8");
      
      
    $widthVariable '998px';
    ?>
    .widthVariable {width:<?php echo $widthVariable ?>px;background-color:yellow}

    #index.html
    HTML Code:
    <head>
      <meta charset="UTF-8">
      <link href="widthVariable.php" rel="stylesheet" type="text/css">
        <title>widthVariable</title>
    </head>
    <body>
    Last edited by John_Betong; Apr 15, 2012 at 00:03. Reason: corrected linked in file name
    Learn how to be ready for The New Move to Discourse

    How to make Make Money Now with a *NEW* look

    Be sure to congratulate Patche on earning Member of the Month for July 2014


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
  •