PDA

View Full Version : Adding NavBar from Xara


sgrotta
Feb-15-2006, 01:22 AM
I've created a nice navigation bar in Xara, but I haven't the foggiest how to insert it into my smugmug pages. '

Also, I want to remove the slideshow control bar that is current on my gallery pages.

Any help would be appreciated.

Thanks, Sally
www.pixels.smugmug.com

sgrotta
Feb-15-2006, 01:34 AM
By the way, I've uploaded the button graphics to a holding gallery on my site. And the html that Xara generated appears to be simply the following...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MenuMaker produced NavBar</title>
</head>
<body bgcolor="#000000" text="BLACK">
<script menumaker src="smugmug.js"></script>
</body></html>

The Xara help menu says the following...

1. If you have not already done so, save the NavBar.
2. In a text editor open the dummy web page created by Menu Maker.
3. In a text editor open your web page.
4. Copy this line into your web page:
<script menumaker src="mybar.js"></script>
(assuming the NavBar is called mybar)

I just don't see where I'm supposed to point to where the actual graphics are saved (in my Web graphics folder on Smugmug). I know I really don't know HTML, but it seems that something is missing from this code.
Any ideas?

Thanks, Sally
www.pixels.smugmug.com (http://www.pixels.smugmug.com)

sgrotta
Feb-15-2006, 01:41 AM
I just found the following in a .js file that was also generated by Xara

//©Xara Ltd
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(/["']([^'"]*)smugmug.js["']/i);if(ml && ml.length > 1) loc=ml[1];}}document.write("<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr>");tr(false);writeButton("","http://www.pixels.smugmug.com","smugmug_b1",79,17,"Home","",0);writeButton("","http://www.pixels.smugmug.com/gallery/1200806","smugmug_b2",79,17,"Nature","",0);writeButton("","http://www.pixels.smugmug.com/gallery/1200808","smugmug_b3",79,17,"Animals","",0);writeButton("","http://www.pixels.smugmug.com/gallery/1200809","smugmug_b4",79,17,"Portraits","",0);writeButton("","http://www.pixels.smugmug.com/gallery/520789","smugmug_b5",79,17,"The (http://www.pixels.smugmug.com) Paris Review","",0);writeButton("","http://www.pixels.smugmug.com/gallery/1200847","smugmug_b6",79,17,"Scenes","",0);writeButton("","http://www.pixels.smugmug.com/gallery/1200896","smugmug_b7",79,17,"Various (http://www.pixels.smugmug.com/gallery/1200847) Images","",0);tr(true);document.write("</tr></table>");loc="";function tr(b){}function turn_over(name) {if (document.images != null && clicked != name) {document[name].src = document[name+"_over"].src;}}function turn_off(name) {if (document.images != null && clicked != name) {document[name].src = document[name+"_off"].src;}}function reg(gname,name){if (document.images){document[name+"_off"] = new Image();document[name+"_off"].src = loc+gname+gtype;document[name+"_over"] = new Image();document[name+"_over"].src = loc+gname+"_over"+gtype;}}function evs(name){ return " onmouseover=\"turn_over('"+ name + "')\" onmouseout=\"turn_off('"+ name + "')\""}function writeButton(urld,url,name,w,h,alt,target,hsp){gnam e=name;while(typeof(document[name])!="undefined")name+="x";reg(gname,name);tr(true);document.write("<td>");if(alt!="")alt=" alt=\""+alt+"\"";if(target!="")target=" target=\""+target+"\"";if(w>0)w=" width=\""+w+"\"";else w="";if(h>0)h=" height=\""+h+"\"";else h="";if(url!="")url=" href=\""+urld+url+"\"";if(typeof(clx)!="undefined"){target="";url=" href=\"?"+clx+"\"";alt=" alt=\"Click to edit\"";}document.write("<a "+url+evs(name)+target+">");if(hsp==-1)hsp=" align=\"right\"";else if(hsp>0)hsp=" hspace=\""+hsp+"\"";else hsp="";document.write("<img src=\""+loc+gname+gtype+"\" name=\""+name+"\""+w+h+alt+hsp+" border=\"0\" /></a></td>");tr(false);}

This looks more like what I need to get into the page. But I'm still not sure what to do with it, or how to point to the graphics. I tried pasting it into the header box under my banner code, but that produced a mess.

Yikes. I'm in over my head.

Sally
www.pixels.smugmug.com

Mike Lane
Feb-15-2006, 06:48 AM
You've got a couple of options.

1) save the smugmug.js file somewhere on the internets (not smugmug though - try ripway.com perhaps).
2) copy the url of where it's saved
3) put the <script menumaker src="url here"></script> in your header html box in your customization

or (help me out here java scripters)

1) copy the long code you posted above and paste it into your javascript box
2) ???
3) profit!

Okay sorry, I'm not well versed enough in javascript to help out with the 2nd part. Anyone else?

Andy
Feb-15-2006, 07:21 AM
Also, I want to remove the slideshow control bar that is current on my gallery pages.


Use the FAQ (http://www.dgrin.com/showthread.php?t=26043), Luke!

In the faq, are these threads:

How can I force the duration of slideshow transitions?
I want to force a gallery to slideshow, and eliminate the toolbar - Can do?

http://blogs.smugmug.com/web-tricks/2005/09/19/changing-slideshow-options/
http://www.dgrin.com/showthread.php?t=26359

BTW, we're soon coming out with an easier way to force the slideshow transition times, so stay tuned on that.

Oh and an example of how this looks:

www.moonriverphotography.com and click on "NY Minute"

Andy
Feb-15-2006, 07:23 AM
I've created a nice navigation bar in Xara, but I haven't the foggiest how to insert it into my smugmug pages. '

Walk before you run, mkay? Why not try one of the VERY SIMPLE navbars in the first tutorial in this thread:

http://www.dgrin.com/showthread.php?p=201609#post201609
like this one:
http://css.maxdesign.com.au/listutorial/horizontal_introduction.htm


then, for giggles, you can advance to something like these:
http://www.cssplay.co.uk/menus/index.html

OK?

sgrotta
Feb-15-2006, 09:23 AM
Thanks. I'll take a look at the threads.

Sally