Jump to content

Menu - Help (Newbie)


Penterprises

Recommended Posts

OK I have had a break through. The page I was testing the Include on was saved as .htm I have now changed it so that the page was saved as people.php with the include being menu.php so I have realized that I basically have to just change all the pages that will include the Include (no pun intended) have a .php ending and it should all be working.We got there in the end, thank you.Susan

Link to comment
Share on other sites

OK I have one last problem with the menu, within the dark blue bar the buttons are showing as dark pink and not white. This is my menu code:<div align="center"; style="color : white; background-color: rgb(0, 0, 128); text-align: center; font-weight: bold; width: 800px;" alink="white" link="white" vlink="white"><a href="index.php">Main Menu</a>  <a href="worship.php">Our Worship</a>  <a href="">Parish Eucharist</a>  <a href="">Who's Who</a>   <a href="">Discussion & Prayer Groups</a>  <a href="students.php">Students</a>  <a href="sermons.php">Sermon Themes</a>  <a href="choir.php">Choir</a>  </div>Thanks,Susan

Link to comment
Share on other sites

OK I have one last problem with the menu, within the dark blue bar the buttons are showing as dark pink and not white. This is my menu code:<div align="center"; style="color : white; background-color: rgb(0, 0, 128); text-align: center; font-weight: bold; width: 800px;" alink="white" link="white" vlink="white"><a href="index.php">Main Menu</a>  <a href="worship.php">Our Worship</a>  <a href="">Parish Eucharist</a>  <a href="">Who's Who</a>   <a href="">Discussion & Prayer Groups</a>  <a href="students.php">Students</a>  <a href="sermons.php">Sermon Themes</a>  <a href="choir.php">Choir</a>  </div>Thanks,Susan
I told you we could get past that! Congrats! Now let's go on to this problem and use it as a springboard to your next area.Your code has errors that could affect how things look. Always start from clean code. The way to do this is to validate your code here: http://validator.w3.org/Next, you have to move all that css stuff elsewhere. The problem is 1) some is invalid and 2) you are working harder than you need to. Once you get it moved, you will validate it here: http://jigsaw.w3.org/css-validator/Small steps.First, copy all the styles you have to the head section of your page and put them in style tags. Second, make them valid.Example:Your page has: <body style="color: rgb(0, 0, 0); background-color: rgb(45, 45, 225);" alink="#4a2885" link="#4a2885" vlink="#4a2885">Move the style:<style><body style="color: rgb(0, 0, 0); background-color: rgb(45, 45, 225);" alink="#4a2885" link="#4a2885" vlink="#4a2885"></style>Make it valid:<style>body color: rgb(0, 0, 0); background-color: rgb(45, 45, 225);a:link color:#4a2885;a:visited color:#4a2885;</style>Finally, remove it from the html:<body>Cleaner, right? It also fixes the incorrect "alink and vlink" that you had. And you can add a hover so it changes color when the link is moused over:a:link color:#4a2885;a:visited color:#4a2885;a:hover color:#123123; // not a color you would use, just an exampleIf you want a specific effect for only one link or area, then you will use a class or an id. But we will start slow.Later, you will move the css to an external file that is included on all your pages so you only have to change something once and it changes all - sound familiar?This is all covered at the free tutorial here: http://www.w3schools.com/sitemap.asp(notice they use the other server side ASP instead of PHP - no importance, just interesting)
Link to comment
Share on other sites

I've added this as instructed: html lang="en"><head> <title>St. Michael & All Angel's, Headingley</title> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <meta content="Susan Penter" name="author"> <meta content="Home Page" name="description"> <script type="text/javascript" src="brand"></script> <style>body color: rgb(0, 0, 0);background-color: maroon;a:link color:#4a2885;a:visited color:#4a2885;a:hover color:#4a2885; </style></head><body>for some reason though, where as the other parts of the code have come alive in blue and purple the style label have come alive but everything between the two style words has stayed black and when I go to normal view the background has changed back to white.

Link to comment
Share on other sites

I've added this as instructed: html lang="en"><head> <title>St. Michael & All Angel's, Headingley</title> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <meta content="Susan Penter" name="author"> <meta content="Home Page" name="description"> <script type="text/javascript" src="brand"></script> <style>body color: rgb(0, 0, 0);background-color: maroon;a:link color:#4a2885;a:visited color:#4a2885;a:hover color:#4a2885; </style></head><body>for some reason though, where as the other parts of the code have come alive in blue and purple the style label have come alive but everything between the two style words has stayed black and when I go to normal view the background has changed back to white.
Is this on the people page? I don't understand the problem. Must be slow today.
Link to comment
Share on other sites

Use curly braces in style declarations:<style>body {color: rgb(0, 0, 0);background-color: maroon;}a:link {color:#4a2885;}a:visited {color:#4a2885;}a:hover {color:#4a2885;} </style>
Boy is my face red. I left that off? Holy Smoke. I really need to get more sleep.
Link to comment
Share on other sites

I told you we could get past that! Congrats! Now let's go on to this problem and use it as a springboard to your next area.Your code has errors that could affect how things look. Always start from clean code. The way to do this is to validate your code here: http://validator.w3.org/Next, you have to move all that css stuff elsewhere. The problem is 1) some is invalid and 2) you are working harder than you need to. Once you get it moved, you will validate it here: http://jigsaw.w3.org/css-validator/Small steps.First, copy all the styles you have to the head section of your page and put them in style tags. Second, make them valid.Example:Your page has: <body style="color: rgb(0, 0, 0); background-color: rgb(45, 45, 225);" alink="#4a2885" link="#4a2885" vlink="#4a2885">Move the style:<style><body style="color: rgb(0, 0, 0); background-color: rgb(45, 45, 225);" alink="#4a2885" link="#4a2885" vlink="#4a2885"></style>Make it valid:<style>body color: rgb(0, 0, 0); background-color: rgb(45, 45, 225);a:link color:#4a2885;a:visited color:#4a2885;</style>Finally, remove it from the html:<body>Cleaner, right? It also fixes the incorrect "alink and vlink" that you had. And you can add a hover so it changes color when the link is moused over:a:link color:#4a2885;a:visited color:#4a2885;a:hover color:#123123; // not a color you would use, just an exampleIf you want a specific effect for only one link or area, then you will use a class or an id. But we will start slow.Later, you will move the css to an external file that is included on all your pages so you only have to change something once and it changes all - sound familiar?This is all covered at the free tutorial here: http://www.w3schools.com/sitemap.asp(notice they use the other server side ASP instead of PHP - no importance, just interesting)
I would really like to move my style sheets to an external file now as mentioned, I went to the sitemenu you pointed me to, to be confronted by dozens of different tutorials - I don't suppose you could let me know which sections covers moving style sheets to an external file.Many thanks, you have already made my life so much easier. When I have got the main parts of the site done I will be able to go and read up on the things I haven't learnt yet!Susan
Link to comment
Share on other sites

I don't suppose you could let me know which sections covers moving style sheets to an external file.
All you need to do is copy your code to a new plain-text file, save it as *.css, and link it through your head as such:
<link rel="stylesheet" type="text/css" href="stylesheet.css" />

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...