osCommerce Breadcrumb Tips

By | May 5, 2008

Breadcrumbs or breadcrumb trails are a navigation technique used in user interfaces. Its purpose is to give users a way to keep track of their location within programs or documents. The term is taken from the trail of breadcrumbs left by Hansel and Gretel in the popular fairytale.

In osCommerce, the breadcrumb is made up of;

Link to Domain Name > Link to Catalog Install > Link to Category > Link to Product Model

Which isn’t too useful in my opinion.  In fact, I’d go further and say that Breadcrumbs are vurtually useless in almost all ecommerce shops – why have a breadrcumb when there is already a “category” menu and “back” button in a persons browser.

Many years ago, when I was part of a small design team, we actually had shoppers in the office watching how they used site.  As I recall, maybe 1 in 20 actually used the breadcrumb feature of a standard osCommerce installation.

Anyway, if you do have a Breadcrumb, here’s a few tips

If you want to remove the link to your Domain Name, open up /includes/application_top.php and remove this line of code:

[php]$breadcrumb->add(HEADER_TITLE_TOP, HTTP_SERVER);[/php]

If you simply want to change the word “Top”, open up /includes/languages/english.php and change this line of code:

[php]define(‘HEADER_TITLE_TOP’, ‘Top’);[/php]

If you want to remove the link to your Catalog install, open up /includes/application_top.php and remove this line of code:

[php]$breadcrumb->add(HEADER_TITLE_CATALOG, tep_href_link(FILENAME_DEFAULT));[/php]

If you simply want to change the word “Home”, open up /includes/languages/english.php and change this line of code:

[php]define(‘HEADER_TITLE_CATALOG’, ‘Home’);[/php]

If you do not use the “Product Model” field in your product specs, then you might as well use something else in the breadcrumb – I think that using Product Model is dumb anyway – it’s hardly helpful to the customer…so open up /includes/application_top.php and find this:

[php]// add the products model to the breadcrumb trail
if (isset($HTTP_GET_VARS[‘products_id’])) {
$model_query = tep_db_query(“select products_model from ” . TABLE_PRODUCTS . ” where products_id = ‘” . (int)$HTTP_GET_VARS[‘products_id’] . “‘”);
if (tep_db_num_rows($model_query)) {
$model = tep_db_fetch_array($model_query);
$breadcrumb->add($model[‘products_model’], tep_href_link(FILENAME_PRODUCT_INFO, ‘cPath=’ . $cPath . ‘&products_id=’ . $HTTP_GET_VARS[‘products_id’]));
}
}[/php]

and change it to this:

[php]// add the products NAME to the breadcrumb trail
if (isset($HTTP_GET_VARS[‘products_id’])) {
$model_query = tep_db_query(“select products_name from ” . TABLE_PRODUCTS_DESCRIPTION . ” where products_id = ‘” . (int)$HTTP_GET_VARS[‘products_id’] . “‘”);
if (tep_db_num_rows($model_query)) {
$model = tep_db_fetch_array($model_query);
$breadcrumb->add($model[‘products_name’], tep_href_link(FILENAME_PRODUCT_INFO, ‘cPath=’ . $cPath . ‘&products_id=’ . $HTTP_GET_VARS[‘products_id’]));
}
}[/php]

If you want to change the “seperator” in your breadcrumb from > to something else, open up /includes/header.php and find this code:

[php]$breadcrumb->trail(‘ » ‘)[/php]

and change it to whatever symbol you wish to use.  I think I’ll use a forward slash, so I would change it to this:

[php]$breadcrumb->trail(‘ / ‘)[/php]

If you don’t want the breadcrumb at all, open up /includes/header.php and remove this portion of code:

[php]<td class=”headerNavigation”>&nbsp;&nbsp;<?php echo $breadcrumb->trail(‘ &raquo; ‘); ?></td>[/php]

There you have it, an intro to using the breadcrumb.  Nice and easy, ain’t it?

11 thoughts on “osCommerce Breadcrumb Tips

  1. Angel's Affordable Web Design

    Thanks, what awesome tips! I used the one to add the product name in the breadcrumb navigation and it worked beautifully, thank you so much!

  2. Gary Post author

    Glad you found it useful 🙂

  3. Tomee80

    I’m not sure if it’s just me and my browser (using latest FF v3.0) but the code regarding the application_top.php file appears in my browser:

    $breadcrumb->add($model[‘pr… and it gives me error

    so I modified to

    $breadcrumb->add($model[‘pr…

    now it works just fine, thank you for this piece of code 🙂

  4. Joshi2007

    Hi.

    I had Problems with the Breadcrumbs and Productnames.

    Language-ID must be used in my Case.

    What happend ?

    The Breadcrumb don´t Display the Productname.

    Cause: When the Shop uses more Languages and the “Productname Fields”
    are not all filled out,
    then it displays only the Separator (in My case a Picture).

    Solution:

    Set the LanguageID in the SQL Request.

    //this is the line to be changed
    $model_query = tep_db_query(“select products_name from ” . TABLE_PRODUCTS_DESCRIPTION . ” where products_id = ‘” . (int)$HTTP_GET_VARS[‘products_id’] . “‘ and language_id = ‘” . (int)$languages_id . “‘”);
    //end of line to be changed

    Here the complete Solution (like the Tutorial above, but the added change(s). ):

    —————————
    // BoF — add the products NAME -with language support- to the breadcrumb trail
    if (isset($HTTP_GET_VARS[‘products_id’])) {
    $model_query = tep_db_query(“select products_name from ” . TABLE_PRODUCTS_DESCRIPTION . ” where products_id = ‘” . (int)$HTTP_GET_VARS[‘products_id’] . “‘ and language_id = ‘” . (int)$languages_id . “‘”);
    if (tep_db_num_rows($model_query)) {
    $model = tep_db_fetch_array($model_query);
    $breadcrumb->add($model[‘products_name’]);
    }
    }

    //EoF — add the products NAME -with language support- to the breadcrumb trail

    Joshi from Hamburg Germany.

    P.S. It´s not the right solution, but a fast Tryout… THX and c.u.
    __________________________________________________

  5. Paul

    Gary,

    Dragging up an old thread, do you know if you could substitute an image for a link?

    I’d like to use an image of a house for ‘Home’ and possibly change the separator to an image.

    Cheers,

    Paul

  6. Gary Post author

    Mate, this is an old one 🙂

    You can do this. The seperator is this bit;

    $breadcrumb->trail(‘ » ‘);

    so you’d do this;

    $breadcrumb->trail(tep_image(DIR_WS_IMAGES . ‘arrow.gif’, ”, ”, ”, ‘align=”absmiddle”‘));

    And for the home link, you can do similar in the application_top.php file;

    $breadcrumb->add(tep_image(DIR_WS_IMAGES . ‘home.gif’, ”, ”, ”, ‘align=”absmiddle”‘) , HTTP_SERVER);

    and you’ll end up with something like this (obviously you’d style the rest of it appropriately);

Leave a Reply

Your email address will not be published. Required fields are marked *