Menu System

[PaulGrimshaw]

Hi,

Does anyone know if its possible to copy the menu system that this site uses: www.oliverbonas.co.uk (shop by department bit).

Its a static html menu that when you click on the links it changes to the page selected (just like out site map works). The problem I have is how can I replicate the self highlighting and the opening of the current sub menu (clothing) etc.

I imagine it will take lots of block ifs etc in the sitemap routine, but before I investigate I wanted to see if anyone has any ideas or something similar. I really don't want to use java if I can help it.

Thanks,
Paul.

[jont]

Norman has a similar Actinic script over at www.drillpine.biz

[PaulGrimshaw]

Hi Jont,

I have a copy of collapso which works pretty well, but of course its java (you can even use a cookie so it keeps the menu open at your current page) but I want static html.

I see he has the new html menu, but that doesnt have the capability of keeping the current section/menu open.

If you look at the oliverbonas site, it has a different menu for each page it serves up, with no expansion etc of the menu. when you click on a menu section it takes you to that page, which has been preset with a new menu with that section open. Its that feature I want to replicate.

Any ideas? If you have any idea how actinic produces the sitemap (e.g. what processes it does) please let me know. I can't see a way of saying "if the current processed page = this page, then do this" type stuff.

Thanks,
Paul.

[Duncan Rounding]

Although Collapso uses js the links are static and thus SE friendly.

I think it's very unusual these days for someone to have js disabled.

[PaulGrimshaw]

There are a couple of problems for me (from a purist point of view). Of course, if what I want isnt possible, I'll move on, but just for conversations sake...

Firstly, js is bloat and slows down page access and adds weight to every single page. Having a menu that is static and no sub links makes it more streamlined. This is better for SE, better for server loads (and cost of data) and faster for the user.

Secondly, google has a 'limit' of about 100 links per page, with a java menu, each and every page available on your site is linked to (even if not being shown). I have a very small site at the moment, but if every page on my site was in the menu I would be pushing 60+ links already and I havnt added a 10th of my products yet, whereby if I used the system that oliverbonas use, it would be much smaller (just top levels and current section shown). Of course, I use one product per page which adds more links.

I am going to do some expirements with both java and the sitemap and see what I can get, but I am suprised no ones using a menu like this either using clever 'ifs' in the sitemap or some php.

thanks,
Paul.

[NormanRouxel]

My V8 Collapso produces static HTML. It fails-safe if there's no JavaScript by displaying an UL list type menu (it won't be very good looking though).

You can also limit the depth of the menu produced to limit the page weight.

Some of your points are a bit back to front.

js is bloat and slows down page access and adds weight to every single page

Actually having your nav in a separate JS file means that it's cached and is of negligible size on all bit the first page accessed.

Having a menu that is static and no sub links makes it more streamlined.

You'll have less code with top-level only menu of course, but a static HTML menu that includes sub-sections (like the V8 Collapso) will mean that there's a lump of HTML in every page.

When I redid Collapso for V8, I decided to stop using JavaScript arrays to contain the Section structure and switch to embedded HTML UL lists. The main reason was make such a menu search engine friendly and to allow CSS to be used for styling it.

There is a cost due to all the HTML being on every page. A site with around 150 Sections can thus have about 15Kb of extra code on the page. I wouldn't recommend Collapso for sites with several hundred pages as this may mean too much embedded HTML.

Secondly, Google has a 'limit' of about 100 links per page, with a java menu, each and every page available on your site is linked to (even if not being shown).

This won't happen. With a JavaScript menu Google won't see any of these links. The displayed HTML is generated by the customers browser after the page is loaded. Thus there are no links on the HTML of the page that Google's spider looks at.

An HTML UL menu will show all links but that's the price you pay for allowing your customers to be able to find there way around the site without the delay of a page load every time they click the mouse.

[PaulGrimshaw]

Hi Norman,

Actually having your nav in a separate JS file means that it's cached and is of negligible size on all bit the first page

Good point - I hadnt considered this.

You'll have less code with top-level only menu of course, but a static HTML menu that includes sub-sections (like the V8 Collapso) will mean that there's a lump of HTML in every page.

Thats what I am hoping to achieve. Only the top level of each section would be shown, so in my case, most pages will only have a dozen or so links, for example;

Jewellery
Silver
Rings
Necklaces <Current Page
Earrings
Gold
Ethnic
Homeware
Tableware
Accessories

In this case, there are no more links under the headings so when you click Homeware, it takes you to the homeware page and another, different, static menu.

With a JavaScript menu Google won't see any of these links. The displayed HTML is generated by the customers browser after the page is loaded. Thus there are no links on the HTML of the page that Google's spider looks at.

How does this work? As you mention the entire html is there on the page? Does google ignore 'hidden' divs etc or is this relating to the java only menu (collapso 7).



Thanks,
Paul.

[NormanRouxel]

How does this work?

Ooops. Was a bit vague there.

I was talking about menus where the entire structire is held in JavaScript arrays (the way Actinic does it via the YahooSections menu that's in a lot of V7 themes). In this case there's nothing for Google to see but the customer sees a complete menu.

The V8 Collapso uses a static HTML UL list that uses CSS and a tiny bit of JavaScript to make the list act like an Expanding menu. In this case Google will see a full site map like set of links but the customer only sees the path that's currently been opened.

[ki450751]

Norman

I am looking at a quicker way to refresh my store pages. The Actinic yahoo navigation bar typically comprises 60% of the page file size.

How would your Collapso patch help to reduce this to resolve my challenge, if at all?

[NormanRouxel]

Can't comment without an URL to look at.

[ki450751]

www.whatsyourfantasy.co.uk

[NormanRouxel]

You're in trouble there. Your YahooSections JavaScript file is a whopping 1.9 Megabytes. No wonder your page took ages to load.

First time visitors will probably leave before seeing anything as they'll think the site is down.

You have 4,087 pages on your site and there's no way you can have them all in a menu without crippling the site.

My Collapso and NorList menus could be used as they can be limited to only show a certain depth of menu. In your case restricting it to the 1st 2 levels would be fine and would make the menu only a few Kb (you've a reasonable 100 items in the 1st 2 levels).

Alternatively, if you want a simple 2-level menu, then there are ones in the Advanced Guide that would replace the YahooSections bloatware and provide a similar look to what you've got now.

[NormanRouxel]

The pertinent Advanced Guide article is Section List With Sub Sections In Bullets.

[ki450751]

Norman

You are a gem. Thanks.

I shall review the Advanced Guide and the option of using Collapso.

Thanks again.

[gabrielcrowe]

norm: for those people generating their sitemaps with huge levels of depth, do you think your collapso could use the php nav i had been working on? the nav generates ul/li, so i cant see it as a problem.

this way, you could generate a tree 3 deep, or more, and not flood html to the browser.

take the code and have a look? perhaps there is a way for all these people to have cake and also eat it?