Webstyle4/Dreamweaver MX NavBar Problem

I created a Nav Bar using Webstyle 4 (then added it to my site through (MX) Dreamweaver's extension to Webstyle).

The Nav Bar appears and works great in Dreamweaver's Browser preview.
But on my actual web site, www.frankenmouse.com , the Nav Bar is not visible. (It should be over the rusty pipe on page top). I uploaded the site through Dreamweaver and I also tried uploading a second time outside of Dreamweaver (from my host's file management page). Neither method made a difference, the Nav Bar was still missing.

Since the entire site (what is done so far) was uploaded, including all folders and files, I don't know what is wrong. Especially since I can see the Nav Bar functioning within Dreamweaver's browser preview.

Is there a script or file might I need to add to correct this? HELP! Thanks a lot................Pete

PS: I've seen the problems on the forum with newer versions of Dreamweaver and Webstyle, but I didn't think my older MX version would have a problem.

Peter Gorman
3gormans@bellsouth.net

I've seen a very similar question to this recently .......... Check out this thread. I don't know what the solution is, but keep an eye on both threads It may be posted there before here.

Yeah, Kieth I saw that thread, but that guy wasn't able to see his Webstyle object in Dreamweaver's browser preview. I can see and operate the nav bar in the web preview, just not on the actual web site. That's what's driving me nuts.

I'll keep watching the other thread too though, just in case.

Thanks for the reply....................Pete

Hi Pete,

Can you provide a link to the page that does not show the NavBar?

Are the files for the navbar copied to your website in the same relative path as on your local computer?

Pete, Bill,

I've experienced similar problems before, using WS4 and even MenuMaker.

Dreamweaver inserts a relative URL for the images and JavaScript. That's fine when viewing it from your computer because of your directory structure.

I've found that changing these to the FULL URL (http://whatever.com/directory/folder/file), where the 'img' and 'js' files reside on your server, usually fixes the problem.

Give it a try. What have you got to lose?

:D

Quote:

---

Originally Posted by Soquili

Hi Pete,

Can you provide a link to the page that does not show the NavBar?

Are the files for the navbar copied to your website in the same relative path as on your local computer?

---

Hi Bill,

The link is my site home page (under construction), at www.Frankenmouse.com .

The files are copied to the site in the same configuration they're in on my local computer.

But like Fletch says in the post after yours, I think I have to put in the FULL URL. Because I noticed that when I un-installed then re-installed Dreamweaver to fix a glitch (all of a sudden, couldn't add layers, OK after re-installing).....My Nav Bar wouldn't show up in Dreamweaver (not in Dreamweaver's browser preview nor in Dreamweaver’s work area), UNTIL I re-installed the Webstyle Dreamweaver extension. Nothing else changed in any files.

Thanks...................Pete

Quote:

---

Originally Posted by Fletch

Pete, Bill,

I've experienced similar problems before, using WS4 and even MenuMaker.

Dreamweaver inserts a relative URL for the images and JavaScript. That's fine when viewing it from your computer because of your directory structure.

I've found that changing these to the FULL URL (http://whatever.com/directory/folder/file), where the 'img' and 'js' files reside on your server, usually fixes the problem.

Give it a try. What have you got to lose?

:D

---

Thanks Fletch, I'm going to try it tomorrow. I think you're right (see my other reply to Bill).

I can't understand why Xara would put out something meant to help you save time setting up little odd's and end's in websites, but then make it unable to actually function without correcting things like this. Oh well, there were a lot of glitches in various Xara extremes too, I had to buy the 3.2 to fix some of them because my free upgrade grace period had just run out. I'm starting to get used to it now...........

Thanks, I'll post after I try your suggestion...............Pete

Fletch or Bill,

I'm not sure where I should add the full url. Here's the first part of my Nav Bar js file, I think I highlighted the relevent parts in BLUE;


var clicked="";var gtype=".gif";var selstate="_over";if (typeof(loc)=="undefined" || loc==""){var loc="";if (document.body&&document.body.innerHTML){var tt=document.body.innerHTML;var ml=tt.match(/["']([^'"]*)payment_types.js["']/i)


Should I try adding anything to the xaramenu.js file too? Or just the Nav Bar js (above) file?

Thanks again................Pete

Hi Pete,

Looking at your home page I do not see any code that references the NavBar images and javascript files.

The URL that Fletch advised to change to the full path would be in your main page and not in the javascript files.

Pete,

This appears in your raw code:

<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>

The 'src' URLs are highlighted in red, and I was going to suggest that you insert a full URL here, but I don't think this matters in the least. The 'img' and 'xws' references have been commented out, as you'd expect but, as Bill has said, there is no indication of the 'menu' graphic, which must exist for it to be displayed. I assume the menu graphic is "Payment_Types.gif"?

I think it is "back to the drawing board" time!

Quote:

---

Originally Posted by Fletch

Pete,

This appears in your raw code:

<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>

The 'src' URLs are highlighted in red, and I was going to suggest that you insert a full URL here, but I don't think this matters in the least. The 'img' and 'xws' references have been commented out, as you'd expect but, as Bill has said, there is no indication of the 'menu' graphic, which must exist for it to be displayed. I assume the menu graphic is "Payment_Types.gif"?

I think it is "back to the drawing board" time!

---

The "FrankenmouseTeeMenu" is the folder the Nav Bar gifs and links are in.

Right, the menu graphics are "Payment_Types.gif"

One thing I noticed though, when you brought this to my attention. While trying to solve another problem I had, unable to upload to remote site from Dreamweaver (turned out I had made an error in defining the remote site), I went back and got rid of all the upper case letters and unneeded spaces. I made sure I changed it in all files used on the local site. But now I notice the uppercase letters still appear in the raw code you copied. Does Dreamweaver puts in it's own uppercase letters into raw code when needed? If not, then some uppercase letters remain even after I changed the files.

Should I go into the raw code and change the upper to lower case to match my current files? (after making a copy of it just in case)

There is mention of the menu graphic in the separate "payment_types.js" file and mention of "mouse over behaviors" in the "xaramenu.js" file.


ALSO, this is in the code of my home page (from local site), from the position of my nav bar; I see this on my remote site too.

<div id="NavBarLowPipe" style="position:absolute; width:702px; height:187px; z-index:16; left: 160px; top: 370px; background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); layer-background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); border: 1px none #000000;">
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>
</div>

I thought this was the code that would allow an association with the "payment_types.js" (gif files) and the "xaramenu.js" files.


Thanks.................................Pete

........................Pete

Quote:

---

Originally Posted by ww1aero

ALSO, this is in the code of my home page (from local site), from the position of my nav bar;

<div id="NavBarLowPipe" style="position:absolute; width:702px; height:187px; z-index:16; left: 160px; top: 370px; background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); layer-background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); border: 1px none #000000;">
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>
</div>

---

Yup, already noted that, which is why I brought it to your attention in the previous post. Here is an example of one of my own in which I will highlight where the menu graphic goes, and where I think your NavBar menu graphic should appear:

<div id="navbar">
<div align="right"><img src="Motif_page4_files/Motif_page4_bar.gif" editor="Webstyle4" moduleid="fhcf-redone (Project)\Motif_page4_bar.xws" class="right"/>
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="Motif_page4_files/motif_page4_hnavbar.js">'+'</scr'+'ipt>');/*img src="Motif_page4_files/Motif_page4_hnavbar.gif" moduleid="fhcf-redone (Project)\Motif_page4_hnavbar_off.xws"*/</script>
</div>

You'll notice that the two are almost identical layouts (project names different, of course), except that yours is missing the menu graphic. Also, you've used 'absolute' for positioning and a 'z-index' which might be interfering with how the browser is rendering the final page. Worth checking that, especially if it isn't Xara-generated.

It isn't Dreamweaver that is capitalising the names, it is WS4. One of its eccentricities, but from experience it doesn't break anything. It also sets several other parameters that fail W3C validation (e.g. there's no such recognised markup as editor="Webstyle4"), but I eventually delete those when I know the website build is complete.

We'll eat this elephant, one bite at a time ... !

Hi Pete and Terry (Fletch)

I just got home from work. Sunday is my 16 to 18 hour day :(

I see you two are getting well into working out the problem.

I'll sit back and learn from both of you if you don't mind. :)

I don't have much experience with Dreamweaver.

Thanks for the help Fletch (and Bill, I can use Dreamweaver, but I sure don't feel comfy with code),

Fletch, I'll try to plug in this modification and see what happens; Black was there already, Red I added.....

<div id="NavBarLowPipe" style="position:absolute; width:702px; height:187px; z-index:16; left: 160px; top: 370px; background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); layer-background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); border: 1px none #000000;">
<img src="FrankenmouseTeeMenu/Payment_Types.gif" editor="Webstyle4" moduleid="Frankenmouse3color (Project)\Payment_Types.xws">
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>
</div>

...........................................Pete

I tried the modification, and although it didn't get the bar to show, I am now seeing an "X" (missing file) box in the place the Nav Bar should appear.

www.Frankenmouse.com

At least I can see a change in the correct spot.

But I don't know enough about code to figure out what else I should add or leave out.

I also have a request in for help with Xara, not that I can count on getting the solution from them.

Just so you know what you're looking at in my raw code, this is how my file structure is laid out for my home page on my remote host;

Home/ public_html/ frankenmouseteemenu(My Nav Bar folder), Then files for the Nav Bar gifs, starting with Payment Types.gif, (which is the main underlying nav bar graphic), then various "links.gif"s, mouseover "links.gif"s, a payment_types.js file, then more gifs labled payment types.gif .

Thanks...................................Pete

Pete,

It is looking for:

http://www.frankenmouse.com/frankenm...ment_types.gif

Make sure that the graphic exists, and that it is in the right directory on your site. That should fix it.

I tried accessing the 'gif' file directly, but I get a 404 error, so it appears that something is 'broken' in the URL (your directory structure on the site might not be the same as the way you're calling it up on your own computer).

Getting closer ... !!

:D

Update: I think I've spotted the problem. This is probably as a result of you editing your filenames locally to change them to lower case and leaving the original 'gifs' in the Xara format with capitalised filenames (or was that the other way round?). Take a closer look.

http://www.frankenmouse.com/frankenm...ment_Types.gif

The script finds the image when it is identified as "Payment_Types.gif", but goes walkabout when it is asked to display "payment_types.gif". I suspect that the rest of the graphics (and code?) you edited are probably affected in the same way. But at least you now know what to do to fix it ... !!

Pete I did a Whois search for your domain and see that it is hosted on an Apache web server.

Apache is most likely running on a Unix or Linux server which is a case sensitive operating system.

Windows is not case sensitive so Payment_Types.gif and payment_types.gif would be the same on Windows.

On Unix and Linux Payment_Types.gif and payment_types.gif would be two different files.

Not much help but maybe a little background to help isolate the problem.

To be on the safe side with websites generally, don't use any upper case or spaces in filenames or directories.

Can't agree more, Keith! But tell that to the Xara design crew ... !

---------------------------------------------------------------

Pete,

I guess this is what you're aiming for, but I couldn't produce any 'rollover/mouseover' effects in the Navbar. But the graphic works ...

Hey, Thanks A Lot! I really appreciate the help. It's a good thing I saw your posts before I read Xara support's first suggestion. They saw the same problem, but didn't notice it was "upper/lower case" related. They saw that the code was looking for my www.frankenmouse.com URL , and I saw that the real path in my host's file manager starts with Home/public_html/ , so I was going to change those first.

Ironic that I got into trouble trying to get rid of what I THOUGHT would cause trouble (upper case letters), only to CAUSE the kind of problem I was trying to avoid in the first place.

UPDATE: All I had to do was change one folder, "frankenmouseteemenu" to "FrankenmouseTeeMenu"! So much for trying to be careful not to put in any uppercase letters.......geeeesh.........

...............Thanks again for all your help Fletch.........and also Bill and Keith.

................Pete

Pete,

You're welcome.

Terry

Pete I'm glad you have it sorted.

Thanks Terry for teaching us. Always a pleasure learning from those that know.