Change the navigation menu in iweb

Question

Level 1

0 points

Change the navigation menu in iweb

I have buy an iweb template that has the navigation menu always fixed. No matter is you move the mouse over the links to the pages, if you are in the welcome page or blog, the text is always the same.

I have ask to author of the template to make the active page text grayed out but he wants again money because this is customizing request of the template...

Is there a way to change the color of the text of the navigation menu? It is enough that the active page is highlighted.

Thank you

Posted on May 14, 2010 3:53 PM

Reply

Answer 1

Old Toad

Level 10

207,313 points

May 14, 2010 5:15 PM in response to gialandra

Welcome to the Apple Discussions. I don't know if you can hide the navbar in that theme but if you can create your own Text Based Navbar where you can set font, font color and rollover color as well a put it anywhere on the page you'd like.

OT

Reply

Answer 2

Cyclosaurus

Level 6

12,915 points

May 14, 2010 5:25 PM in response to gialandra

Is there a way to change the color of the text of the navigation menu? It is enough that the active page is highlighted.

you can change navbar font, color (by changing its css) and even behavior with javascript, here is how to change color:
http://discussions.apple.com/thread.jspa?messageID=8638743&#8638743

I have ask to author of the template to make the active page text grayed out but he wants again money because this is customizing request of the template...

don't buy anything from him again.

Reply

Answer 3

gialandra Author

Level 1

0 points

May 15, 2010 4:14 AM in response to gialandra

Thank you for the answers.

If it is possible I don't want create nothing because it complicates the stuffs (I'm a very beginner in this things). I have tried the javascript way but it don't modifies the behavior of the menu.

Excavating in the iWeb application folder I have reach this file that seems the responsable of the navigation bar: iWeb.app/Contents/Resources/Themes/_Simple\ Info\ orange.webtheme/Italian.lproj/Welcome.webtemplate/com.apple.iweb.widget.navbar. Welcome.plist

I have open it with Pref Setter:

.navbar {
font-family: 'Helvetica Neue', Arial, sans-serif;
font-size: .8em;
color: #666666;
line-height: 30px;
border-bottom: 3px solid #ccc;
}

.navbar-bg {
text-align: right;}

.navbar-bg ul {
list-style: none;
margin: 0px;
padding: 0px;
}

li {
list-style-type: none;
display: inline;
padding: 0px 5px 0px 0px;
}

li a {
text-decoration: none;
padding: 10px;
color: #666666;
font-weight: bold;
}

li a:visited {
text-decoration: none;
padding: 10px;
color: #666666;
font-weight: bold;
}

li a:hover
{
color: #999999;
text-decoration: none;
}

li.current-page a
{
color: #66ABC5;
text-decoration: none;
}

I have change the color value but nothing happens. Have you any suggestion?

Thank you
Marco

PS: maybe in 10 days Apple publishes iWeb 10 that permits these modifies...

Reply

Answer 4

Wyodor

Level 6

19,930 points

May 15, 2010 4:43 AM in response to gialandra

It will only work, if at all, with new webpages.

Existing ones do no change.

You can change the theme of a page by choosing one from the theme menu at the botton of the window.

Then change it back to the original theme.

It may ruin the layout of the page.

Better add a new page with your custom theme and see if the changes have taken effect.

Reply

Answer 5

Ethmoid

Level 6

11,482 points

May 15, 2010 5:03 AM in response to gialandra

It does not complicate anything by hiding the original page template navigation menu and building your own text based one. It is no harder than fiddling around with javascript that evidently does not seem to be working for you.

I would suggest that it is easier to build your own navigation bar and be done with it.

Reply

Answer 6

gialandra Author

Level 1

0 points

May 15, 2010 6:15 AM in response to gialandra

But if I create my custom nav-bar then I have to add it to every new page. Is this not time wasting?

I thought that this thing becomes complicate. Maybe it is better for me waiting for the iWeb 10 release and hoping this permits direct customization.

Is it the nav bar of the template too static? http://web.me.com/jumsoft/Site/Welcome.html

I want try last time editing the .plist files with Pref Setter: I don't want insert a wrong format color, what value should I put in the color fields to obtain a dark gray color in the active page?

Thank you to everybody
Marco

Reply

Answer 7

May 15, 2010 8:08 AM in response to gialandra

gialandra wrote:
But if I create my custom nav-bar then I have to add it to every new page. Is this not time wasting?

Really? How complicated is selecting, copying and pasting?
Create it once and copy/paste it on all the pages you want to have it on. At least you will be able to mold, knead, bend and style it any way you want. Beats the navigation bar of any template.

Reply

Answer 8

Old Toad

Level 10

207,313 points

May 15, 2010 9:30 AM in response to gialandra

If it's time wasting then go with one of the default themes in iWeb. That would use less of your time and be the easiest all around.

We have no idea when iWeb 10 will be coming. Apple doesn't have a set release schedule and speculation is not permitted in the forums. Wouldn't serve anyone if we were to speculate. Wouldn't be any better than this

Is it the nav bar of the template too static?

What do you mean by too static? They work, take visitors to the correct page and are easy to read. What else would you need?

I've found that using either the white, black or Modern Frame theme I can customize it any way I'd like since those 3 themes do not use any special graphic files as part of the design that can't be removed. Each has a different navbar color and rollover which you can choose to suit your design needs. From there you're limited by only you imagination.

Reply

Answer 9

gialandra Author

Level 1

0 points

May 15, 2010 9:42 AM in response to Old Toad

Old Toad wrote:
What do you mean by too static? They work, take visitors to the correct page and are easy to read. What else would you need?

I mean that a decent navigation bar at least should highlight the page one is visiting, do you tell that this is only a personal idea?

Marco

Reply

Answer 10

Old Toad

Level 10

207,313 points

May 15, 2010 9:51 AM in response to gialandra

I see what you mean. Another argument for a text based navbar if you're going to use this theme.

Reply

Answer 11

Cyclosaurus

Level 6

12,915 points

May 15, 2010 5:29 PM in response to gialandra

But if I create my custom nav-bar then I have to add it to every new page. Is this not time wasting?

yes, it's very inefficient when you have many pages and add more pages; see my post here:
http://discussions.apple.com/thread.jspa?messageID=8136472&#8136472

I want try last time editing the .plist files with Pref Setter: I don't want insert a wrong format color,

don't bother with the plist file, it's legacy stuff.
you can change navbar by knowing iweb navbar widget. if you want to change current page link color... look at my code in this:
http://discussions.apple.com/thread.jspa?messageID=8638743&#8638743

change:

styleCSS = 'div#widget0 li a:hover{color: turquoise;}'; // change color to your liking;

to:

styleCSS = ' div#widget0 li.current-page a { color: #333333; text-decoration: none; } '; // #333333 is dark grey;

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

it's all about knowing iweb widgets.

Reply

Answer 12

gialandra Author

Level 1

0 points

May 17, 2010 7:45 AM in response to Cyclosaurus

I have tried but doen't work.

Is there a particular method to insert HTML snippet?

Thank you
Marco

Reply

Answer 13

Wyodor

Level 6

19,930 points

May 17, 2010 7:51 AM in response to gialandra

Add a HTML Snippet and paste the code.

Here's a sample that changes the size of the text in the nav link. It's based on the same code :

http://discussions.apple.com/message.jspa?messageID=11531741#11531741

Instead of size, you use the color.

Reply

Answer 14

Jul 6, 2010 1:53 AM in response to Cyclosaurus

Cyclosaurus... I've been reading through your very helpful info on editing the iWeb navbar widgets in iWeb's templates. I'm so glad I came across your info, because I've been wading through old info that didn't relate to iWeb '09.

I am wanting to change the navbar position (vertically) and rollover color, within the '09 iWeb template titled: Darkroom.

Questions:
(1) Am I in the right place to do so...? Let's say I'm just going to use the Blank Darkroom template for creation of all my pages. Is this the correct location to make adjustments to the code...?
iWeb/Contents/Resources/Themes/Darkroom.webtheme/English.lproj/Blank.webtemplate

(2) To change the navbar position vertically on the page (I want it positioned slightly lower on the page)... do I change the line height value...?

(3) Once I get the Blank.webtemplate navbar widget the way I want it... I can use that Blank template to create all my remaining subpages, and the navbar will have a consistent look throughout the site...?

(4) My understanding is that Padding is referring to distance between the text links on the navbar...?

Thanks in advance for your help.

Reply