Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question How to Dynamically Load CSS file?

    Hi,
    My page consists of 3 different PHP files with their own template file. One is header, then body, then footer. Header and footer generally stay the same in every page, but the body one change. I want to load different CSS file for different body php/template files. But how? Can I load CSS file outside head tag?

    Many thanks.

  • #2
    New Coder
    Join Date
    Dec 2005
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    do u want the body css to load randomly? then you will have to make an array of css and print that variable randomly. this is more related to sripting in php. you post this in some php forum, they can even give the code to be used.

    http://codingforums.com/php/

  • #3
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    not randomly, for examples, I have different php files for the body. e.g. first.php, second.php, third.php. I want to use first.css, second.css, third.css accordingly.

    Quote Originally Posted by kalloo
    do u want the body css to load randomly? then you will have to make an array of css and print that variable randomly. this is more related to sripting in php. you post this in some php forum, they can even give the code to be used.

    http://www.codingforums.com/forumdisplay.php?f=6

  • #4
    New Coder
    Join Date
    Dec 2005
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok, its almost same. but you will have send a variable from first.php, second and third.

    here is the code (i hope i can put the php code in this section. if not i request the moderator to delete this, but dont kick me out of this forum)

    I suggest you to write or get a better code from PHP section for the same.

    <?php
    // Define array.
    $cssFile = array('css1.css', 'css1.css', 'css2.css');

    // use the variable sent from first.php. for example $css=1 and print that here.

    echo '<link rel="stylesheet" type="text/css" href="' . $cssFile[$css] . '" />';
    ?>

  • #5
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    I can do that inside the <head> tag of html? I thought that the <link> tag can only be used inside the <head> tag.

    Quote Originally Posted by kalloo
    ok, its almost same. but you will have send a variable from first.php, second and third.

    here is the code (i hope i can put the php code in this section. if not i request the moderator to delete this, but dont kick me out of this forum)

    I suggest you to write or get a better code from PHP section for the same.

    <?php
    // Define array.
    $cssFile = array('css1.css', 'css1.css', 'css2.css');

    // use the variable sent from first.php. for example $css=1 and print that here.

    echo '<link rel="stylesheet" type="text/css" href="' . $cssFile[$css] . '" />';
    ?>

  • #6
    Senior Coder
    Join Date
    Feb 2003
    Posts
    1,665
    Thanks
    0
    Thanked 27 Times in 25 Posts
    Rather than providing separate css files, how about setting all the permutations within a single stylesheet?

    It should be possible for you to set a dynamic id or class attribute for the body element (possibly from a random list if that's what you're after), so you should also be able to set up the possible permutations in your stylesheet.
    Setting a dynamic, section id for the body can be useful in pre-setting page-specific style declarations within a single, main stylesheet.

    e.g.

    css:
    Code:
    body#home #content {
    background: #f00;
    }
    
    body#work #content {
    background: #fcf;
    }
    
    body#contact #content {
    background: #fc3;
    }
    markup:
    Code:
    <body id="home">
    …
    
    <div id="content">
    …

    Anyhoo, just another way to skin that cat.

  • #7
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    I guess the main question is whether I can use php to change the css file dynamically inside the HEAD tag? Can HEAD tag handle php code?

    The reason I need to load css files dynamically is that each of my webpage has 3 section, header, body and footer in 3 different php files and 3 different templates. Header and footer virtually stay the same for all webpages, but the body changes. Some has tables, some don't, some has forms, some dont'. If I include all the styles of all these elements, it will be a huge css file for a body that has only one of those elements. So I think it's a waste.

  • #8
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    I have the a similar set up in my site: standard head, no footer and variable body, depending on what the purpose of the page is, though writtne in perl, not php.

    I have five different layouts so I used a variable div id. I take a parameter which is included in the link to the specific page, which outputs the body data, so that the appropriate one is loaded from the css file.

    My CSS is quite long (probably a bit verbose), but I am sure when I amend part of it, that those changes will apply only to the file I want and not, accidentally, to any other. It is quite easy to maintain.

    If you want I can post the css as it is, I thnk, sufficuently comented out, to show you what I mean.


    Bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #9
    Regular Coder
    Join Date
    Jul 2005
    Posts
    342
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks. I think I need to know your mechanism to load css, I don't need to see what's inside the css.

    Quote Originally Posted by bazz
    I have the a similar set up in my site: standard head, no footer and variable body, depending on what the purpose of the page is, though writtne in perl, not php.

    I have five different layouts so I used a variable div id. I take a parameter which is included in the link to the specific page, which outputs the body data, so that the appropriate one is loaded from the css file.

    My CSS is quite long (probably a bit verbose), but I am sure when I amend part of it, that those changes will apply only to the file I want and not, accidentally, to any other. It is quite easy to maintain.

    If you want I can post the css as it is, I thnk, sufficuently comented out, to show you what I mean.


    Bazz

  • #10
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    hi
    in three scenarios, I am showing you how the div id is established and the way that I have done the css

    Code:
      
    where the subject is add_client:
    
    <div id="$variableName">
    <table>
    <tr>
    <td></td>
    </tr>
    </table>
    
    The css would be 
    #add_client table {
    } 
    
    #add_client table td {
    }
    
    #add_client table tr th {
    }
    
    #add_client table td {
    
    }
    
    #add_client table input {
    
    }
    
    #add_client table td select {
    }

    where the subject is control_panel_index_pages, another page would have a totally different appearance simply from the css:
    [code]

    <div id=$variable">
    <table>
    <tr>
    <td></td>
    </tr>
    </table>

    #control_panel_index_pages table {

    }

    #control_panel_index_pages table th {

    }

    #control_panel_index_pages table td {

    }



    and another with definition lists:

    Code:
    <div id="$variable">
    <dl>
    <dt></dt>
    <dd></dd>
    <dd class="price"></dd>
    <dl> 
    
    again, the css would be 
    
    /*------------  Definition lists css ----------------------------*/
    
    #control_panel_index_pages dl {
    
    }
    
    #control_panel_index_pages dl dt {
    }
    
    #control_panel_index_pages dl dt h4 {
    }
    
    #control_panel_index_pages dl dd ul {
    	}
    
    #control_panel_index_pages dl dd ul li
    {
    	
    }
    
    #control_panel_index_pages dl dd ul li a:link, #control_panel_index_pages dl dd ul li a:visited, #control_panel_index_pages dl dd ul li a:active {
    	
    }
    
    
    #control_panel_index_pages dl dd ul li a:visited {
    		
    }
    
    #control_panel_index_pages dl dd ul li a:hover {
    	}
    I don't know how you would do it in php but, in perl,

    my $variable = $query->param ('action');

    If that's not enough just holler

    Bazz

    Edit: just holler, basically, means shout for more help.
    Last edited by bazz; 12-12-2005 at 01:04 PM.
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link


  •  

    Posting Permissions

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