Results 1 to 8 of 8

Thread: Dynamic CSS

  1. #1
    Join Date
    Nov 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Dynamic CSS

    How do I make the css background colour of the home page different from the inner pages. The home page bgcolour is black and looks good with the design but doesn't look nice on the inner pages, so I would like to make the inner pages while or a better colour.

    How can this be achieved?

  2. #2
    Join Date
    Jan 2011
    Location
    Southeastern CT
    Posts
    612
    Thanks
    46
    Thanked 32 Times in 32 Posts

    Default

    You need to post the page with the problem so people can look at the source to help you.
    Thanks,

    Bud

  3. #3
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 516 Times in 502 Posts
    Blog Entries
    5

    Default

    this is not "dynamic" css; it's just a different rule. the easiest way would be to add an id or class attribute to the <body> of the page in question, like so:
    HTML Code:
    <!--home page-->
    <body class="blackBG">
    HTML Code:
    <!--other pages-->
    <body>
    Code:
    /* css stylesheet */
    body{ background: #fff; } /* white background is the default */
    body.blackBG{ background: #000; } /* black background for specific pages */

  4. #4
    Join Date
    Nov 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks guys for your responses..Here's the link. This is an open cart template.

    http://london-webdesigners.com/demo/nwhairsnglamour

  5. #5
    Join Date
    Nov 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile

    I have sorted it with PHP. However, if theres a shorter way of achieving this, your constructive contribution will be appreciated.

    PHP Code:
    <?
        $url
    ="http://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
         if (
    $url == "homepageurl" ){?>
               <style>
          #content{
                background: black;       
                    
          }
       
          </style>
      <? } else {?>
    <style>
      #content{
                background: white;
                    
          }
     </style>
    <? ?>
    Last edited by Snookerman; 11-21-2011 at 07:53 PM. Reason: added [php] tags

  6. #6
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 516 Times in 502 Posts
    Blog Entries
    5

    Default

    my suggestion above is much simpler and far more efficient. Also, do you realize that that page takes almost 20s to load (first view/no cache)? Even after I had the images cached, it took 6.

    have a look

  7. #7
    Join Date
    Nov 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks Traq for your observation, I think that has to do with my hosting account cos it loads up normally locally. If not I would have to look at the coding properlly, Im really new in developing open cart

  8. #8
    Join Date
    Apr 2008
    Location
    So.Cal
    Posts
    3,643
    Thanks
    63
    Thanked 516 Times in 502 Posts
    Blog Entries
    5

    Default

    local viewing will of course be very quick - it's local. The files don't have to go anywhere because they're already on your computer. The rest of the world might not want to hang around and wait, however.

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
  •