Help
Hello,
Well, This should be the closer.
Question:
How do I combine my Header Image which I have stored on my desktop in Image Folder
with the Horizontal Navibar which I just created (thanks to input of Forum member)
stored on my DW MX file/page to create the new Header which I wanted to upload to each webpage? Re: www.tokyo-sushi-chef-institute.com
Regards
rk
Page 1 of 1
Creating New Header
#2
- Group: Advanced Member
- Posts: 1,731
- Joined: 20-December 08
- LocationSalisbury UK
Posted 23 December 2010 - 02:33 AM
First, you should check your errors here:-
http://validator.w3.org/
It shows 9 errors.
After the <body> tag you have a style tag so move all the style tag up so that it's just before the </head> closing tag.
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Do you want the navbar to be over your header image? If so, the new header image should not have so many colors or you won't be able to read teh link text.
You will need to make the new header image a background-image for the h5 style:-
and edit the h5 html markup to delete the img tag:-
You now have both style3 and style4 applicable to the h5 tag so you may need to edit this.
Is the filename tsciHeader1.jpeg.jpg correct? Normally the extension is either .jpeg or .jpg, not both (both are the same) but it could be that your file name is tsciHeader1.jpeg and the extension is .jpg in which case it would be correct.
http://validator.w3.org/
It shows 9 errors.
After the <body> tag you have a style tag so move all the style tag up so that it's just before the </head> closing tag.
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Do you want the navbar to be over your header image? If so, the new header image should not have so many colors or you won't be able to read teh link text.
You will need to make the new header image a background-image for the h5 style:-
h5 { background: url(images/tsciHeader1.jpeg.jpg) fixed top left no-repeat; }
and edit the h5 html markup to delete the img tag:-
<h5 class="style3"><span class="style4"> <a href="index.html">HOME</a> | <a href="2ColumChefDiplomaCourse.html">CHEF DIPLOMA COURSE</a> | <a href="metropolisTokyo.html">METROPOLIS TOKYO</a> | <a href="location.html">LOCATION</a> | <a href="inquire.html"> INQUIRE </a></span></h5>
You now have both style3 and style4 applicable to the h5 tag so you may need to edit this.
Is the filename tsciHeader1.jpeg.jpg correct? Normally the extension is either .jpeg or .jpg, not both (both are the same) but it could be that your file name is tsciHeader1.jpeg and the extension is .jpg in which case it would be correct.
#3
- Group: Moderators
- Posts: 5,498
- Joined: 19-December 08
- LocationSan Antonio, TX
Posted 23 December 2010 - 06:11 AM
Plus, there's still the option I showed you a few weeks back: http://aandbwebdesig...forum/sushi.php
#4
- Group: Member
- Posts: 92
- Joined: 10-November 10
Posted 29 December 2010 - 08:13 PM
Wickham, on 23 December 2010 - 02:33 AM, said:
First, you should check your errors here:-
http://validator.w3.org/
It shows 9 errors.
After the <body> tag you have a style tag so move all the style tag up so that it's just before the </head> closing tag.
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Do you want the navbar to be over your header image? If so, the new header image should not have so many colors or you won't be able to read teh link text.
You will need to make the new header image a background-image for the h5 style:-
and edit the h5 html markup to delete the img tag:-
You now have both style3 and style4 applicable to the h5 tag so you may need to edit this.
Is the filename tsciHeader1.jpeg.jpg correct? Normally the extension is either .jpeg or .jpg, not both (both are the same) but it could be that your file name is tsciHeader1.jpeg and the extension is .jpg in which case it would be correct.
http://validator.w3.org/
It shows 9 errors.
After the <body> tag you have a style tag so move all the style tag up so that it's just before the </head> closing tag.
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Do you want the navbar to be over your header image? If so, the new header image should not have so many colors or you won't be able to read teh link text.
You will need to make the new header image a background-image for the h5 style:-
h5 { background: url(images/tsciHeader1.jpeg.jpg) fixed top left no-repeat; }
and edit the h5 html markup to delete the img tag:-
<h5 class="style3"><span class="style4"> <a href="index.html">HOME</a> | <a href="2ColumChefDiplomaCourse.html">CHEF DIPLOMA COURSE</a> | <a href="metropolisTokyo.html">METROPOLIS TOKYO</a> | <a href="location.html">LOCATION</a> | <a href="inquire.html"> INQUIRE </a></span></h5>
You now have both style3 and style4 applicable to the h5 tag so you may need to edit this.
Is the filename tsciHeader1.jpeg.jpg correct? Normally the extension is either .jpeg or .jpg, not both (both are the same) but it could be that your file name is tsciHeader1.jpeg and the extension is .jpg in which case it would be correct.
#5
- Group: Member
- Posts: 92
- Joined: 10-November 10
Posted 29 December 2010 - 08:21 PM
Hello there,
I'm back.
First, you should check your errors here:-
http://validator.w3.org/
It shows 9 errors.
With regard to all the errors, I am communicating with Adobe DW MX Forum to decipher the explanation.
After the <body> tag you have a style tag so move all the style tag up so that it's just before the </head> closing tag.
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Are all this found in the index.html page (HOME)?
Do you want the navbar to be over your header image? If so, the new header image should not have so many colors or you won't be able to read teh link text.
Header Image will be over the Nav Bar; just like it is currently.
You will need to make the new header image a background-image for the h5 style:-
I don't get this part. Why not just cut paste? I thought H5 indicated the size of Header typeface?
h5 { background: url(images/tsciHeader1.jpeg.jpg) fixed top left no-repeat; }
and edit the h5 html markup to delete the img tag:-
<h5 class="style3"><span class="style4"> <a href="index.html">HOME</a> | <a href="2ColumChefDiplomaCourse.html">CHEF DIPLOMA COURSE</a> | <a href="metropolisTokyo.html">METROPOLIS TOKYO</a> | <a href="location.html">LOCATION</a> | <a href="inquire.html"> INQUIRE </a></span></h5>
You now have both style3 and style4 applicable to the h5 tag so you may need to edit this.
Is the filename tsciHeader1.jpeg.jpg correct? Normally the extension is either .jpeg or .jpg, not both (both are the same) but it could be that your file name is tsciHeader1.jpeg and the extension is .jpg in which case it would be correct.
The file name will be different. I have not named it as yet.
I have the new image which is slightly different in wording in my Image File.
The Nav Bar below is stored in my DW file.
What I did with the current Header is cut and paste the Header Image to the file page. Then just typed in the Nav Bar wordings:
HOME | CHEF DIPLOMA COURSE | METROPOLIS TOKYO | LOCATION | INQUIRE
And added links to them. With DW that was no brainer.
Now, it appears I am entering the Twilight Zone…
Regards
Fish
I was able to extend out the Nav Bar using the T-Ball method.
See below:
--------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta name="keywords" content="SushiMenu1">
<meta name="description" content="Horizontal menu item1">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Sushi Menu</title>
<style type="text/css">
#menu{
font-family: arial, sans-serif; line-height: 1.3;
color: #000000;
font-size: 11px;
font-weight: normal;
}
#menu{
padding:0;
margin:0;
}
#menu ul{
padding:0;
margin:0;
}
#menu li{
position: relative;
float: left;
list-style: none;
margin: 0;
padding:0;
}
#menu li a{
padding: 0 10px;
height: 25px;
display: block;
text-decoration:none;
text-align: center;
line-height: 25px;
background-color: #660033;
color: white;
}
#menu li a:hover{
background-color: #663366;
}
#menu ul ul{
position: absolute;
top: 22px;
visibility: hidden;
}
.style1 {color: #B7C8C5}
</style>
</head>
<body>
<div id="menu">
<ul>
<li><a href="#nogo"><span class="style1"></span>HOME</a>
</li>
<li><a href="#nogo">CHEF DIPLOMA COURSE</a>
</li>
<li><a href=”#nogo”>METROPOLIS TOKYO</a>
</li>
<li><a href=”#nogo”>LOCATION</a>
</li>
<li><a href=”#nogo”>INQUIRE</a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
</ul>
</div>
</body>
</html>
I'm back.
First, you should check your errors here:-
http://validator.w3.org/
It shows 9 errors.
With regard to all the errors, I am communicating with Adobe DW MX Forum to decipher the explanation.
After the <body> tag you have a style tag so move all the style tag up so that it's just before the </head> closing tag.
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Are all this found in the index.html page (HOME)?
Do you want the navbar to be over your header image? If so, the new header image should not have so many colors or you won't be able to read teh link text.
Header Image will be over the Nav Bar; just like it is currently.
You will need to make the new header image a background-image for the h5 style:-
I don't get this part. Why not just cut paste? I thought H5 indicated the size of Header typeface?
h5 { background: url(images/tsciHeader1.jpeg.jpg) fixed top left no-repeat; }
and edit the h5 html markup to delete the img tag:-
<h5 class="style3"><span class="style4"> <a href="index.html">HOME</a> | <a href="2ColumChefDiplomaCourse.html">CHEF DIPLOMA COURSE</a> | <a href="metropolisTokyo.html">METROPOLIS TOKYO</a> | <a href="location.html">LOCATION</a> | <a href="inquire.html"> INQUIRE </a></span></h5>
You now have both style3 and style4 applicable to the h5 tag so you may need to edit this.
Is the filename tsciHeader1.jpeg.jpg correct? Normally the extension is either .jpeg or .jpg, not both (both are the same) but it could be that your file name is tsciHeader1.jpeg and the extension is .jpg in which case it would be correct.
The file name will be different. I have not named it as yet.
I have the new image which is slightly different in wording in my Image File.
The Nav Bar below is stored in my DW file.
What I did with the current Header is cut and paste the Header Image to the file page. Then just typed in the Nav Bar wordings:
HOME | CHEF DIPLOMA COURSE | METROPOLIS TOKYO | LOCATION | INQUIRE
And added links to them. With DW that was no brainer.
Now, it appears I am entering the Twilight Zone…
Regards
Fish
I was able to extend out the Nav Bar using the T-Ball method.
See below:
--------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta name="keywords" content="SushiMenu1">
<meta name="description" content="Horizontal menu item1">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Sushi Menu</title>
<style type="text/css">
#menu{
font-family: arial, sans-serif; line-height: 1.3;
color: #000000;
font-size: 11px;
font-weight: normal;
}
#menu{
padding:0;
margin:0;
}
#menu ul{
padding:0;
margin:0;
}
#menu li{
position: relative;
float: left;
list-style: none;
margin: 0;
padding:0;
}
#menu li a{
padding: 0 10px;
height: 25px;
display: block;
text-decoration:none;
text-align: center;
line-height: 25px;
background-color: #660033;
color: white;
}
#menu li a:hover{
background-color: #663366;
}
#menu ul ul{
position: absolute;
top: 22px;
visibility: hidden;
}
.style1 {color: #B7C8C5}
</style>
</head>
<body>
<div id="menu">
<ul>
<li><a href="#nogo"><span class="style1"></span>HOME</a>
</li>
<li><a href="#nogo">CHEF DIPLOMA COURSE</a>
</li>
<li><a href=”#nogo”>METROPOLIS TOKYO</a>
</li>
<li><a href=”#nogo”>LOCATION</a>
</li>
<li><a href=”#nogo”>INQUIRE</a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
<li><a href=”#nogo”></a>
</li>
</ul>
</div>
</body>
</html>
#6
- Group: Moderators
- Posts: 5,498
- Joined: 19-December 08
- LocationSan Antonio, TX
Posted 30 December 2010 - 06:50 AM
What is the T-Ball method?
What is the point of all these:
There are about 30 of them.
Yes
You can use your image as either a background image inserted via CSS like Wickham showed you, or you can leave it inserted directly. You should, however, fix the name of it - file names - or image names - do NOT have 2 extensions. So no matter how you look at it, tsciHeader1.jpeg.jpg is WRONG - it should be either tsciHeader1.jpeg or tsciHeader1.jpg - but NOT xxxx.jpeg.jpg.
What is the point of all these:
<li><a href=”#nogo”></a> </li>
There are about 30 of them.
Quote
After the <body> tag you have a style tag so move all the style tag up so that it's just before the </head> closing tag.
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Are all this found in the index.html page (HOME)?
You have three </span> tags at the end of teh <h5> tag when there should only be one.
Are all this found in the index.html page (HOME)?
Yes
You can use your image as either a background image inserted via CSS like Wickham showed you, or you can leave it inserted directly. You should, however, fix the name of it - file names - or image names - do NOT have 2 extensions. So no matter how you look at it, tsciHeader1.jpeg.jpg is WRONG - it should be either tsciHeader1.jpeg or tsciHeader1.jpg - but NOT xxxx.jpeg.jpg.
Share this topic:
Page 1 of 1