Hi all,

 

I just wondered if anyone can tell me if there is a way to make a global change to the Spry Menu Bar in DW CS3/4

i.e. if a new submenu was added is there a function that will make a global change that will edit all the other html pages which use the menubar?..

 

Best wishes,

 

Martin.

Hmm not unless you used a Dreamweaver template in your site.

 

Spry code is still just HTML code, and if you've put it on every page (without using a template) then you will need to update every page to add a new submenu.

 

Darren

Hmm not unless you used a Dreamweaver template in your site.

 

Spry code is still just HTML code, and if you've put it on every page (without using a template) then you will need to update every page to add a new submenu.

 

Darren

 

 

Hello Darren,

 

Many thanks for your reply.

 

I'm just in the process of building the index page and did you a basic header two column and footer DW template, all I'll do now is duplicate the index page for the remaining pages on the site, does this mean there is a way of a global change??

 

Best wishes,

 

Martin.

Hi Martin,

 

When I mean Dreamweaver templates, I don't mean like the basic structure of 2/3 col, I mean the template using the .dwt file format to control the layout of all of your pages that use that main template.

 

You can find a tutorial about them here: http://www.smartwebby.com/web_site_design/dreamweaver_template.asp

 

The bottom line is that you create a .dwt file which is the main structure of the website (including your Spry menu) and then apply that template to the other .html pages, thus creating a "main template" for the design. That then means if you update the .dwt template file, all the .html pages will automatically update. The link will explain more and show you how to set them up.

 

Good luck,

 

Darren

What I would do in this case is either use server side includes for menu, header and footer; or for a "low tech" approach I use the find/replace option in DW. Place all the pages which need to be edited in the same folder or open them all in DW and select the code you wish to alter then pres Ctrl+F. This will open the Find/Replace window, your selected text will (/should) be in the find field, at the top you will have to select which documents are to be effected ("Open Documents", "Folder..." etc.) then add the altered code in the replace field and press "replace all".

 

Very easy, perhaps not the most elegant solution but if you aren't going to use the DW tempates option then it's simple and fast.

Hello Darren & Drewster

 

I must thank you both for your advice, I'll have a read about the DW Template and see how I go..

 

It's really interesting working with DW, but quite time consuming at my level.

 

Best wishes,

 

Martin.

Hi Darren & Drewster,

 

Just wanted to as a question about a issue I'm having with the Spry MenuBar, not on my machines I must add.

As mentioned I've stated the build a new website, link below and I have checked this out on the latest version of Firfox and IE which seems ok on my machines.

 

http://www.martinbleasby.co.uk/example/index.html

 

I've sent the above link to a couple of people and one has commented the the menubar is out of sync as if it's oversize for the div it's contained in.

 

I've made sure the menubar is the same size as the container div, and I do not understand this issue.

 

Any thoughts chaps??

 

Best wishes,

 

Martin...

Hey Martin,

 

I assume we're talking about the top menu right?

 

I've checked it in IE6, IE7, IE8, Firefox (latest), Chrome (latest) and Safari (latest) and it looks fine.

 

I'm using Windows Vista btw. Can you find out from these people complaining of the problem their browser, OS, and hopefully a screenshot of what they can see. It might help us work out what is wrong.

 

Darren

If it helps you out, here's what I'm seeing on Linux

Fedora 11 Firefox 3.5.5

Ubuntu Karmic Firefox 3.5.4

It looks fine on Windows, xp and vista with ie6,7 and 8.

It also looks fine in Opera on Linux, just Firefox causing the problems. Probably because of the default font-size.

Those screenshots help, thanks for showing us that.

 

I'm not sure if it's the break causing the problem. Try adding to your CSS:

 

white-space:nowrap;

 

See if that stops the breaks from appearing.

Hi Chaps,

 

Wow, I'm know I'm a just starting out in this, but I'm really confused. I have the up to date Firefox which does not show any problems. My Brothers using the same version of Firefox, and give the same screenshot as shown here.

 

I'm not sure about the font sizes, how do I proceed from here?..

 

Best wishes,

 

Martin.

Hi All,

 

I've done a brouser check and the following error is displayed.

 

Martin.

 

 

Target Browser Errors Warnings

Internet Explorer 6.0 1 0

Internet Explorer 7.0 1 0

Internet Explorer for Macintosh 5.2 1 0

Firefox 1.5 1 0

Netscape 8.0 1 0

Opera 8.0 1 0

Opera 9.0 1 0

Safari 2.0 1 0

Total 8 0

 

Details:

 

#000000 #000000

Error Found 1 errors in thrColFixHdr.css

Firefox 1.5; Internet Explorer 6.0, 7.0; Internet Explorer for Macintosh 5.2; Netscape 8.0; Opera 8.0, 9.0; Safari 2.0

line 6 <link href="css/thrColFixHdr.css" rel="stylesheet" type="text/css">

 

End of report.

Hi all,

 

Could I ask you to look at this link again, I've made some adjustments to the css.

 

http://www.martinbleasby.co.uk/example/index.html

 

 

Darren if possible would you be able to indicate where the wraptext css you posted should go?

 

Best wishes,

 

Martin.

Screenshot looks fine to me, but I've yet to see the problem on my computer. You'll need to ask ElanMan who uses Linux.

 

I suggest that CSS code belong this ID:

 

ul.MenuBarHorizontal a {

 

It's on line 89 of your Spry CSS sheet.

 

I'm not sure if it'll work, just a hunch looking at Elan's screenshots.

 

Darren

It seems to me like you have exactly devided the menu bar width by the 8 menu items you have. Alternatively you could just use a padding (and perhaps margin) around the text so the text can "breathe" without the design "breaking". You should then of course choose the padding/margin in such a way that all the menu items don't completely fill the menu bar.

Hi Drewster & Darren,

 

Thanks for your help.

 

I'll look into the padding issue..

 

Just out of interest how can you see the CSS when it's and external file?..

 

Best wishes,

 

Martin.

If you know the file path to the CSS file your browser can load it up as if it was just another file. Here is the Spry CSS file: http://www.martinbleasby.co.uk/example/SpryAssets/SpryMenuBarHorizontal.css

 

Also, I use FireBug in my Firefox which is awesome for seeing CSS and such.

 

Darren

Darren,

 

Thanks for that tip, I've instaled Firebug now.. looks great.

 

Will try your suggestion along with Drewsters.

 

Best wishes,

 

Martin.

Hey Darren!

 

Your css edit has rectified placing a box on the next line, but there is still a gap at the end (RHS). I'll get a screenshot of my Brother and post shortly. I think the gap is the same as per the shot that Elanman posted.

 

Thanks very much indeed nice one..

 

I asume it still looks ok on your machine??..

 

http://www.martinbleasby.co.uk/example/index.html

 

Best wishes,

 

Martin.

Hi Martin,

 

Yep, still looks good on mine. Let's take a look at the screenshot when you get it and see if we can put this thing to bed.

 

Darren

Looking better here but you still have a problem with 'Aviation Artwork' in the header. Try using the no-wrap for that too. Also some of the nav items are being cut off (by half a letter). Here's another screenshot

Hello Chaps,

 

Thanks again for your help,

 

Elanman,

 

Thanks for the screenshot.

 

Darren, with the point Elanman has raised I used a HTML documant validation from W3c. there are 3 errors shown which relate to the document type. What type of doc should I use, and how do I change this. Errors below.

 

My current document type is HTML 4.01 Transitional

 

 

Validation Output: 2 Errors

 

1. Error Line 38, Column 37: Attribute "HEIGHT" is not a valid attribute. Did you mean "height"?

 

<h1><table width="630" height="95" align="center">

 

✉

 

You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).

 

This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information.

 

How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute. If you received this error when using the <embed> element to incorporate flash media in a Web page, see the FAQ item on valid flash.

2. Error Line 38, Column 56: document type does not allow element "TABLE" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag

 

<h1><table width="630" height="95" align="center">

 

✉

 

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

 

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

3. Warning Line 94, Column 30: NET-enabling start-tag requires SHORTTAG YES

 

<br class="clearfloat" />

 

✉

 

The sequence <FOO /> can be interpreted in at least two different ways, depending on the DOCTYPE of the document. For HTML 4.01 Strict, the '/' terminates the tag <FOO (with an implied '>'). However, since many browsers don't interpret it this way, even in the presence of an HTML 4.01 Strict DOCTYPE, it is best to avoid it completely in pure HTML documents and reserve its use solely for those written in XHTML.

 

Many thanks,

 

Martin.

Hi Martin,

 

Having a doctype of HTML4.01 is fine, and you have declared it properly in your document. I would personally use XHTML1.0, but it's down to choice.

 

I think the first error you are receiving because you have a <table> inside a <h1> element. From what I remember, having a block element inside another block element can cause issues. Try using the following code instead:

 

<div id="header">

<table width="630" height="95" align="center">

<tr>

<td width="643" scope="col"><h1><span class="style1">M a r t i n   B l e a s b y</span></h1> <span class="style2">AGAvA  </span><span class="tagline">  |  A v i a t i o n   A r t w o r k</span></td>

 

</tr>

</table>

<!-- end #header -->

</div>

 

Or position the <h1> tags wherever you think they need to be, but do it inside the <td>s you have.

 

The second error also seems to be related to the same issue, so I'm hoping the second error will also disappear once you've moved the <h1> tag. The Validator has been known to throw up more than one different error if just one problem exists on the site, so there's a good chance they might both disappear.

 

Finally, the third error relates to the HTML syntax you've used. The code <br /> has an XML-style closing, namely the /> part of it. HTML4.01 doesn't employ this kind of closing tag, so you should be just using <br class="clearfloat">. If you had an XHTML1.0 doctype than /> is fine, but not with 4.01.

 

Make these changes and then re-validate the document, let's see where we stand then.

 

Darren

Hello Darren,

 

Many thanks for your help!!..

 

I removed the h1 tag and the only errors which show up now are: I've also attached the edit index html for your rererence.

 

Also included is the fist index edit ref indextableadj.html which has your code, but there were a few more errors shiwn iin the validation.

 

Darren I did not try the validation with the h1 tag removed on your code.

 

Best wishes Martin......

 

 

 

 

1. Error Line 38, Column 33: Attribute "HEIGHT" is not a valid attribute. Did you mean "height"?

 

<table width="630" height="95" align="center">

 

✉

 

You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).

 

This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information.

 

How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute. If you received this error when using the <embed> element to incorporate flash media in a Web page, see the FAQ item on valid flash.

2. Warning Line 94, Column 30: NET-enabling start-tag requires SHORTTAG YES

 

<br class="clearfloat" />

 

✉

 

The sequence <FOO /> can be interpreted in at least two different ways, depending on the DOCTYPE of the document. For HTML 4.01 Strict, the '/' terminates the tag <FOO (with an implied '>'). However, since many browsers don't interpret it this way, even in the presence of an HTML 4.01 Strict DOCTYPE, it is best to avoid it completely in pure HTML documents and reserve its use solely for those written in XHTML.

indextableadj2.html

indextableadj.html

Hi Martin,

 

Apologies, I'm about to go away for a few days, so I won't be able to do any more checking with the code.

 

Hopefully you can find someone else on the forum who can solve the problem for you, but it'll be at least Wednesday until I can check the forum again.

 

Good luck,

 

Darren

Thanks Darren,

 

Have a good time..

 

Best wishes,

 

Martin.

Hi all,

 

I have a question about the hyperlink colour. I know this is set in the css, but is there are way I can control the hyperlinks separately??. i.e I have a image which is an hyperlink and I would like the general text links to be a different colour.

 

Best wishes,

 

Martin....