SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Server Side Include messing up my formating of link="#xxxxxx"

    I've got header and footer info in seperate .htm files, i call them like this from the various 'content pages':

    PHP Code:
    <html>
    <
    head>
    <
    title>About Us</title>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    </
    head>

    <
    body text="#000000" link="#FF0000" vlink="#FF0000" alink="#FF0000">

    <!--
    #include virtual="includes/header.htm" -->

    (rest of the page's unique code)

    <!--#include virtual="includes/footer.htm" -->

    </body>

     
    </body>
    </html> 
    mechanically it wall works fine (once i renamed my content files to *.shtml)

    My problem is that in the 'body' of the content pages I want to use Red for my links color (link="#FF0000" vlink="#FF0000" alink="#FF0000"). But the header and footer portions of the pages use WHITE-background nav BUTTONs, so as coded above, the <body> link-color settings puts a red border around the white nav buttons and they look goofy..
    see this:



    at the top is how it's currently displaying, at the bottom is how i want it to look.

    since the #link color info is in the <body> tag of my content pages, and the SSI's are within the body area, is there a way to make the html being dumped by the SSI's ignore this parent setting and just have #FFFFFF as their link color ???

    (and since the site is a white background white links wont' fly all the way around b/c it'll make my links 'invisible' )

    thanks,

    Fernando

    ps- putting their own <body> tags in the to-be-included pages did not work, but i tried /something/ before bothering you guys/gals with it...

    thanks for helping my wedding site get straightened out!

  2. #2
    (****** or Deleted)
    Join Date
    May 2002
    Location
    Melbourne, Australia
    Posts
    299
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK you should look into using Cascaging Style Sheets (CSS) to style your pages. It can easily achieve what you are after, he is an example:

    style.css
    Code:
    a:link a:visited a:active  {
      color:#ff0000;
      }
    
    a.header:link a.header:visited a.header:active  {
      color:#ffffff;
      }
    
    a.footer:link a.footer:visited a.footer:active  {
      color:#ffffff;
      }
    Now in the normal shtml file use:
    Code:
    <html>
    <head>
    <title>About Us</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link href="style.css" type="text/css" rel="stylesheet">
    </head>
    
    <body>
    
    <!--#include virtual="includes/header.htm" -->
    
    (rest of the page's unique code)
    
    <!--#include virtual="includes/footer.htm" -->
    
    </body>
    </html>
    Now in your "header.htm" if you want to use a link:
    Code:
    <a class="header" href="page.html">Link here</a>
    or in the "footer.htm":
    Code:
    <a class="footer" href="page.html">Link here</a>
    If you want more information on CSS just ask, or have a look at http://www.w3schools.com/css/default.asp
    Jordan Windebank

  3. #3
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    jordan,

    thanks a bunch, for both the css recommendation (i'd only changed CSS pages to suit my needs, but never 'made' one) and the sample code to get me on my way.



    Fernando

  4. #4
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    hmmm not working

    here's my code:

    my footer file (header is the same but class="header" is used instead):

    PHP Code:
    <p>&nbsp;</p><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
      <
    tr
        <
    td colspan="2"> <p align="center"
            <
    class="footer" href="aboutus.shtml"><img src="images/aboutus.gif" width="86" height="25"></a>
                <
    img src="images/placeholder.jpg" width="25" height="25"
            <
    class="footer" href="location.shtml"><img src="images/location.gif" width="80" height="25"></a>
                <
    img src="images/placeholder.jpg" width="25" height="25"
            <
    class="footer" href="accom.shtml"><img src="images/accom.gif" width="135" height="25"></a>
                <
    img src="images/placeholder.jpg" width="25" height="25"
            <
    class="footer" href="directions.shtml"><img src="images/directions.gif" width="98" height="25"></a>
                <
    img src="images/placeholder.jpg" width="25" height="25"
            <
    class="footer" href="honeymoon.shtml"><img src="images/honeymoon.gif" width="103" height="25"></a>
                <
    img src="images/placeholder.jpg" width="25" height="25"
            <
    class="footer" href="contact.shtml"><img src="images/contactus.gif" width="106" height="25"></a></p></tr>
    </
    table
    my style.css sheet:

    PHP Code:
    a:link a:visited a:active  {
      
    color:#ff0000;
      
    }

    a.header:link a.header:visited a.header:active  {
      
    color:#ffffff;
      
    }

    a.footer:link a.footer:visited a.footer:active  {
      
    color:#ffffff;
      

    'new' content pages code looks like this:

    PHP Code:
    <html>
    <
    head>
    <
    title>About Us</title>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <
    link href="includes/style.css" type="text/css" rel="stylesheet">
    </
    head>

    <
    body>

    <!--
    #include virtual="includes/header.htm" -->

    (content page code)

    <!--
    #include virtual="includes/footer.htm" -->
     
    </body>
    </
    html
    the only difference beteen your sample code is the path to my style.css sheet (it's next to the header/footer.htm in a folder called "includes" off-from the content pages)


    oh, and the 'error' is that its defaulting to the "new link = blue" and "visited link = purple" scheme as seen here:



    what am I missing?

  5. #5
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    And i tried changing the css color fields to al caps (#FFFFFF, etc) to no avail....

    All of the other .css sheets I have had the "A's" capitalized in: A.header:link, or A:link

    but that didn't do it either...
    Last edited by hakalugi; Sep 24, 2002 at 22:15.

  6. #6
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    okay we're part of the way there... i got the BODY links to display in red. seems that having multiple items on one line befor the {} it did not like. it is now:

    PHP Code:
    A:link               {  color#FF0000;  }
    A:visited             {  color#FF0000;  }
    A:active               {  color#FF0000;  }


    A.header:link         {   color:#ffffff;   }
    A.header:visited     {   color:#ffffff;   }
    A.header:active      {   color:#ffffff;   }

    A.footer:link         {   color:#FFFFFF;   }
    A.footer:visited     {   color:#FFFFFF;   }
    A.footer:active      {   color:#FFFFFF;   } 
    so only the 1st section is working, but that's one more section than before...

  7. #7
    (****** or Deleted)
    Join Date
    May 2002
    Location
    Melbourne, Australia
    Posts
    299
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmmmmm, first of all try to make sure your selector is in lowercase (a) for the stylesheets. I cannot see any reason why my code did not work, I'm still going through it, but without a SSI enabled server to test on is all speculation sorry... Still looking...

    Edit: Also, I did not see the original screenshot and was not aware you were using images. You will have better luck with the "img" selector and using the "border" attribute...

    eg.

    Code:
    img.classname  {
      border:1px solid #f00;
      }
    Then:

    Code:
    <a href="location.shtml"><img src="images/location.gif" class="classname" alt="" title="" width="80" height="25" /></a>
    This will give all images with the class "classname" a red, 1 pixel solid border...
    Last edited by Wizardx8; Sep 24, 2002 at 22:58.
    Jordan Windebank

  8. #8
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Wizardx8
    Hmmmmm, first of all try to make sure your selector is in lowercase (a) for the stylesheets. I cannot see any reason why my code did not work, I'm still going through it, but without a SSI enabled server to test on is all speculation sorry... Still looking...
    i'm readin this: http://www.w3schools.com/css/css_syntax.asp and also can't see why it won't work (i found the need for commas between the grouped entries in your original sample .css code, but no biggie, it's been changed) and I added a closing "/" before teh carrot in the "<link " line.

    i've verified it isn't a path thing as the color and 'hover' item below are reflected in the body of the content pages...

    PHP Code:
    a:link               {colorred}
    a:visited             {colorred}
    a:active               {colorred}
    a:hover                {colorblack}


    a.header:link         {colorred}
    a.header:visited     {colorred}
    a.header:active      {colorred}

    a.footer:link         {colorwhite}
    a.footer:visited     {colorwhite}
    a.footer:active      {colorwhite}

    /*
    p.right {text-align: right}            classes
    p.center {text-align: center} 

    original color values:

    A:link               {  color: #FF0000;  }
    A:visited             {  color: #FF0000;  }
    A:active               {  color: #FF0000;  }

    */ 

  9. #9
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    just saw your edit, i'll give it a whirl...

  10. #10
    (****** or Deleted)
    Join Date
    May 2002
    Location
    Melbourne, Australia
    Posts
    299
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Let us know how it goes...

    And regarding the commas for multiple selectors, should bang my head against a wall for that one, sorry for the confusion...
    Jordan Windebank

  11. #11
    SitePoint Zealot
    Join Date
    Aug 2002
    Posts
    142
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    okay, the old code in the header and footer file for the links was:

    PHP Code:
    <class="footer" href="contact.shtml"><img src="images/contactus.gif" width="106" height="25"></a></p
    the new code for the link buttons is:

    PHP Code:
    <a href="contact.shtml"><img src="images/contactus.gif" class="navbutton" width="106" height="25"></a></p
    i've also changed the style.css to be:

    PHP Code:
    a:link               {colorred}
    a:visited             {colorred}
    a:active               {colorred}
    a:hover                {colorblack}


    img.navbutton  {
      
    border:1px solid white;
      } 
    and now it works !!

    If you're near the Outerbanks of NC next September, you're welcome to PM me and crash my reception and get some drinks on me, you earned it

    thanks again.

    edit: ooops just saw your location (Aussie^3!!!) didn't mean to sound flip before, it was a sincere offer, but looks highly unlikely now that I see where you are. But if you're here, you can drink Sam Adams and Heineken to your heart's content.
    Last edited by hakalugi; Sep 24, 2002 at 23:21.

  12. #12
    (****** or Deleted)
    Join Date
    May 2002
    Location
    Melbourne, Australia
    Posts
    299
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Haha, glad I could help, and hope the wedding goes well
    Jordan Windebank


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
  •