Breadcrumbs (and multi-level navigation and more)

[mvlcek]

The I18N plugin (http://get-simple.info/extend/plugin/i18n/69/) now also supports breadcrumbs.

For more information see http://mvlcek.bplaced.net/multi-level-na...eadcrumbs/

[polyfragmented]

Hi,

thanks for your I18N plugin and the different functionality it provides!

I have a question about the breadcrumbs: on my start page, "Start » Start" is shown which is undesirable for me. How can I circumevent this? I'm no programmer, but willing and able to edit the plugin. The start page is a special case it seems.

Keep up the good work!

[mvlcek]

I have a question about the breadcrumbs: on my start page, "Start » Start" is shown which is undesirable for me. How can I circumevent this? I'm no programmer, but willing and able to edit the plugin. The start page is a special case it seems.

In your template you can add the slug name of your current page as class in a "content"-div like follows:

Code:

<div id="content" class="<?php echo return_page_slug(); ?>">
    <div class="breadcrumbs">
      <a href="<?php echo find_url('index',null); ?>">home</a>
      <?php get_i18n_breadcrumbs(return_page_slug()); ?>
    </div>
    <h1 id="pagetitle"><?php get_page_title(); ?></h1>
    <?php get_page_content(); ?>
  </div>

Then you can add a CSS-rule in your css file that hides the breadcrumbs on the index page:

Code:

#content.index div.breadcrumbs {
  display: none;
}

You can use the same approach to e.g. make the font on your legal info ("Impressum") page smaller, etc.

[Angryboy]

An alternative solution is this:

Code:

<div class="breadcrumbs">
    <a href="<?php echo find_url('index',null); ?>">Home</a>
    <?php
    if (return_page_slug()=='index')
       echo " ";
    else
     <?php get_i18n_breadcrumbs(return_page_slug()); ?>
    ?>
</div>

Change the 'index' on line 4 to the slug of whatever page is your start page. This negates the need to hide the breadcrumbs with CSS, and ensures that you still have that initial start link on all pages in a uniform format (albeit with the redundant second link being removed on your desired page). Hope that helps!

*edited in response to the below post*

Code:

<div class="breadcrumbs">
    <a href="<?php echo find_url('index',null); ?>">Home</a>
    <?php
    if (return_page_slug()=='index')
       echo " ";
    else
       get_i18n_breadcrumbs(return_page_slug());
    ?>
</div>

[mvlcek]

An alternative solution is this:
...

Remove the <?php ?> around get_i18n_breadcrumbs, and then a bit shorter:

Code:

<div class="breadcrumbs">
    <a href="<?php echo find_url('index',null); ?>">Home</a>
    <?php if (return_page_slug()!='index') get_i18n_breadcrumbs(return_page_slug()); ?>
</div>

But as we are on the home page, we don't really need the home link...

[Angryboy]

Ah thanks for fixing that So much shorter! (I was lazy when I removed the navigation parameters from the coding and just copied from the original, forgetting to remove the <?php?> bits. Bad move on my part xD)

I keep that home link there so that it is always at the beginning of any breadcrumb trail. It's just for consistency's take (since that breadcrumb structure (at least for my site) stays the same for all pages). Plus there can still be reasons to click on that home link (such as being directed to the second page of news which is still on the 'index', but not having a back button - an extra home button makes the link very easy to see).

[polyfragmented]

Thanks a lot you two! I am now using the optimised short version, works like a charm! Cheers!

[tazmandev]

on my start page, "Start » Start" is shown which is undesirable for me. How can I circumevent this?

Since you all got to PHP in the end, isn't it wiser to pach the plugin itself ?

[polyfragmented]

mvlcek,

is it possible to somehow account for accesskeys and taborder in your menu system? I'm going to create a website which will probably have a fair share of elderly users, possibly disabled ones. Mousework can be hard for those.

I guess that tab order could be pulled from the priority of the main pages, couldn't it? As far as accesskeys go, I'm currently at a loss as how to implement those. Maybe a custom field in page options which can then be tied into the plugin link structure? Would try it out, but custom fields still don't work here.

As an aside, I am currently styling a 2-level navigation which works nicely. Your use of "currentpath" is cool. This way you can make sure the parent stays marked as being "active". Kudos.

[mvlcek]

mvlcek,

is it possible to somehow account for accesskeys and taborder in your menu system? I'm going to create a website which will probably have a fair share of elderly users, possibly disabled ones. Mousework can be hard for those.

I guess that tab order could be pulled from the priority of the main pages, couldn't it? As far as accesskeys go, I'm currently at a loss as how to implement those. Maybe a custom field in page options which can then be tied into the plugin link structure? Would try it out, but custom fields still don't work here.

Browsers allow you to tab through all links and fields. All navigation links are consecutive in the correct order - nothing to do here. Maybe you should just set the focus to the "home" navigation item, e.g. if your navigation is wrapped in a <ul id="menu"></ul>, with Javascript:

Code:

$('#menu .index a').focus()

As to the access keys: they need some (implicit) custom field and support from the i18n plugin, but do you really think it's easier for elderly people to press alt-accesskey then to use the mouse?

[polyfragmented]

Browsers allow you to tab through all links and fields. All navigation links are consecutive in the correct order - nothing to do here.

In reply to what I wrote first that's right. I didn't think the tab order thing through, the priority already puts the links in the correct order of course. After thinking on it for a bit I realised it's not really what I wanted to express: What I really wanted to ask for are user configurable access keys and tab order.

As to the access keys: they need some (implicit) custom field and support from the i18n plugin, but do you really think it's easier for elderly people to press alt-accesskey then to use the mouse?

For some it is since they can't use a mouse anymore because their coordination and precision with that input device are too far off. Having said that there are keyboards with bigger keys so those people can hit the keys more easily than with a normal-sized keyboard.

I'm still new to accessibility, but having the two asked-for features might improve general accessibililty. There's more to it than acceskeys and tab order, but from reading up on it, those seem to be a good start.

[mvlcek]

What I really wanted to ask for are user configurable access keys and tab order.

User: the administrator (using the GetSimple administration) or the elderly people accessing the site?

[polyfragmented]

User: the administrator (using the GetSimple administration) or the elderly people accessing the site?

Admin-configurable.

[mvlcek]

User: the administrator (using the GetSimple administration) or the elderly people accessing the site?

Admin-configurable.

I can see reason behind the accesskeys, but you have to keep in mind they would only work for menu items that are displayed (first level, remaining levels depending on current page).

But why would you want to create a different tab order for the navigation - or is it just have a few items with tab order set? In any case this would also only work for visible navigation entries.

[amaurib]

Hello

im trying to style my breadcrumb and would like to know how to remove the separator "»"

also i would like to remove the current page link and leave just the name.

Thanks

[mvlcek]

Hello

im trying to style my breadcrumb and would like to know how to remove the separator "»"

also i would like to remove the current page link and leave just the name.

Thanks

For this you have to use return_i18n_breadcrumbs and output/style the breadcrumbs yourself. See top of plugin file for documentation.

[andyash]

can i use breadcrumbs right inside a page instead of a template? how?