Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / How to remove breadcrumbs from non-store pages?

How to remove breadcrumbs from non-store pages?

Views: 2,939

Results 1 to 13 of 13
15 Aug 2010, 8:37 PM
#1
athens_collectibles avatar

athens_collectibles

Zen Follower

Join Date:
May 2010
Location:
Athens, Greece
Posts:
293
Plugin Contributions:
0

How to remove breadcrumbs from non-store pages?

What I want to achieve:

  1. remove the "Home" link from breadcrumbs
  2. remove the breadcrumbs from all pages except categories/subcategories/product pages.

I have easily done the first part by commenting the line

$breadcrumb->add(HEADER_TITLE_CATALOG, zen_href_link(FILENAME_DEFAULT));

in the file /includes/init_includes/overrides/init_add_crumbs.php as per DrByte's instructions in another post.

Coming to the second part: from various posts read, I understand that this has to be done on a page-by-page basis (unfortunately :yuck:). I found in a post that the breadcrumb can be removed, in the Gift Certificate FAQ page for example, by commenting the line

$breadcrumb->add(NAVBAR_TITLE);

in file /includes/modules/pages/gv_faq/header_php.php

Commenting does remove the breadcrumb but not its placeholder and the page title and contents are not taking its place, leaving a blank space.

Any good suggestions please? I will be grateful!

17 Aug 2010, 8:48 PM
#2
athens_collectibles avatar

athens_collectibles

Zen Follower

Join Date:
May 2010
Location:
Athens, Greece
Posts:
293
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

**Re: Removing breadcrumbs from certain pages...
**
You don't have to code for it- you can use the CSS ...
#PAGE_ID .breadCrumb { display: none;}

The above is from a very old post by Kim (http://www.zen-cart.com/forum/showthread.php?t=47435) and gave me the clue to do it with CSS. It wasn't very clear (to me) what the #PAGE_ID... line represented but, after struggling for hours, I came up to adding the following to my /includes/templates/my_template/css/stylesheet.css file without changing any php files except for the change in /includes/init_includes/overrides/init_add_crumbs.php to remove the Home link:

#aboutusBody #navBreadCrumb{ display: none; }
#contactusBody #navBreadCrumb{ display: none; }
#conditionsBody #navBreadCrumb{ display: none; }
#privacyBody #navBreadCrumb{ display: none; }
#paymentsBody #navBreadCrumb{ display: none; }
#shippinginfoBody #navBreadCrumb{ display: none; }
#destinationsBody #navBreadCrumb{ display: none; }
#artBody #navBreadCrumb{ display: none; }
#dvdinfoBody #navBreadCrumb{ display: none; }
#unsubscribeBody #navBreadCrumb{ display: none; }
#sitemapBody #navBreadCrumb{ display: none; }
#gvfaqBody #navBreadCrumb{ display: none; }

The characters between # and Body on each line, are the page names in my Information box and include a lot of custom pages I have created. These lines removed all the breadcrumbs and their place was taken by the page title, that's exactly what I wanted to achieve. I have not touched the breadcrumbs for the categories/product pages as I want them to stay as they are.

If Kim or another expert is around, could they please confirm that what I've done is correct? Thanks in advance for any assistance.

15 Oct 2010, 11:27 PM
#3
gracedigital avatar

gracedigital

New Zenner

Join Date:
Oct 2010
Posts:
3
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Hi,

I tried using #aboutusBody #navBreadCrumb{ display: none; } for one of my EZpages, to prevent it from displaying breadcrumbs. Between # and Body I gave the Ez PAGE NAME, but its not working for me. I tried coding with EZ page ID like #71Body #navBreadCrumb{ display: none; }, but it is not working. How do I know what is the exact page name for the EZ page? I am fairly new to the forum and 2 months old at using Zencart. It would be great if you could help me.

Thanks,
Grace

16 Oct 2010, 10:42 AM
#4
athens_collectibles avatar

athens_collectibles

Zen Follower

Join Date:
May 2010
Location:
Athens, Greece
Posts:
293
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Hello Grace,

As you have seen, there has been no response to my question whether what I did was correct or not. The thing is that it works for me!

Far from being a programmer, I have made a lot of changes to my stylesheet, mostly on a trial and error basis and I have gained some knowledge by playing around. I would be glad to help you (if I can) but need the URL of the page you are trying to change. If you don't want to publish it in the forums, you may send me a message via the contact us form on either of my sites listed in the signature block.

To respect the forum rules, I have to make clear that I'm not offering professional advice here, just user to user help and that this is not charged. My fee will be the pleasure of helping a fellow member as I have been helped by others. Due to family activities during the weekend, I may not be able to come back before the beginning of next week.

12 Mar 2011, 6:43 PM
#5
cheekycockney avatar

cheekycockney

Zen Follower

Join Date:
Apr 2006
Posts:
172
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Hi. I too am trying to remove the breadcrumbs from some specific pages. After some testing this method works great for me in every circumstance (throughout the 'Information' pages), with the exception of every single page I actually want them removed from! These pages specifically are the 'Contact us' page and also my defined pages. I'm not sure how these pages differ from the other ones and so any advice as to how you acheived this Athens (or anyone) would be greatly appreciated.

If this has any bearing on the issue, I should point out that I have renamed my defined pages as About Us, Company, etc although the url produced still reads as index.php?main_page=page_2, index.php?main_page=page_3, etc.

Thanks in advance!

12 Mar 2011, 7:27 PM
#6
athens_collectibles avatar

athens_collectibles

Zen Follower

Join Date:
May 2010
Location:
Athens, Greece
Posts:
293
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Hi, I have disabled breadcrumbs with some extra lines in the stylesheet.css (a few are shown below).

#aboutusBody #navBreadCrumb{ display: none; }
#contactusBody #navBreadCrumb{ display: none; }
#conditionsBody #navBreadCrumb{ display: none; }
#privacyBody #navBreadCrumb{ display: none; }
#paymentsBody #navBreadCrumb{ display: none; }
#shippinginfoBody #navBreadCrumb{ display: none; }
#destinationsBody #navBreadCrumb{ display: none; }

The bolded parts are the page names.

I hope this helps.

12 Mar 2011, 7:37 PM
#7
cheekycockney avatar

cheekycockney

Zen Follower

Join Date:
Apr 2006
Posts:
172
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Hi, thanks for the speedy response! I now see why it didn't work for Contact us, I added an underscore (#contact_usBody) as I thought I was referencing the page name from the url. So where exactly are you finding these PAGE IDs from as I expect this is why I was unable to get this to work with my defined pages?

Thanks again.

12 Mar 2011, 7:43 PM
#8
cheekycockney avatar

cheekycockney

Zen Follower

Join Date:
Apr 2006
Posts:
172
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Small update, I have got this to work by removing the underscores from the defined page urls eg, #page2Body #navBreadCrumb{ display: none; }. So thanks for sharing your solution, but I'd still like to know why this works if you have any idea?! What exactly are we referencing?

12 Mar 2011, 9:08 PM
#9
athens_collectibles avatar

athens_collectibles

Zen Follower

Join Date:
May 2010
Location:
Athens, Greece
Posts:
293
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

No idea how it works, but it does!

What I do is go to each page I want to remove breadcrumbs from and look at the URL in the browser. For example:

http://athenscollectibles.info/index.php?main_page=about_us

I use the last part (about_us) without the underscore to form the CSS line:

#aboutusBody #navBreadCrumb{ display: none; }

It doesn't work if I leave the underscore but don't ask me why. I don't use Easy Pages but, as you discovered, it works on the same principle (page2Body rather than page_2Body). A Zen Cart guru could provide an explanation. Although it works as described, it would still be good to learn what's behind it.

12 Mar 2011, 9:53 PM
#10
cheekycockney avatar

cheekycockney

Zen Follower

Join Date:
Apr 2006
Posts:
172
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Ha ha, I see you're using the same 'hit and hope' method of web design that I am! Thanks again.

12 Mar 2011, 9:57 PM
#11
athens_collectibles avatar

athens_collectibles

Zen Follower

Join Date:
May 2010
Location:
Athens, Greece
Posts:
293
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

I call it "trial and error" but it's similar. And I read a lot of posts in the forums trying to get ideas and gain experience. :smile:

13 Mar 2011, 12:16 AM
#12
nigelt74 avatar

nigelt74

Totally Zenned

Join Date:
Sep 2005
Location:
Waikato, New Zealand
Posts:
1,558
Plugin Contributions:
1

Re: How to remove breadcrumbs from non-store pages?

Athens Collectibles:

No idea how it works, but it does!

What I do is go to each page I want to remove breadcrumbs from and look at the URL in the browser. For example:

http://athenscollectibles.info/index.php?main_page=about_us

I use the last part (about_us) without the underscore to form the CSS line:

#aboutusBody #navBreadCrumb{ display: none; }

It doesn't work if I leave the underscore but don't ask me why. I don't use Easy Pages but, as you discovered, it works on the same principle (page2Body rather than page_2Body). A Zen Cart guru could provide an explanation. Although it works as described, it would still be good to learn what's behind it.

#aboutusBody -- if you look at the source of your "about us" page you will see that that is the body id

<body id="aboutusBody">

so your rule will only work on specific that page.

each page has a different body ID

obviously all the category pages have the same body ID "indexBody"
and all the product info page have the same id "productinfoBody"

infact if you wanted to only show breadcrumbs on products and categories, you could possibly reverse your thinking
and do something like this

#navBreadCrumb{ display: none; }

#indexBody #navBreadCrumb{ display: block; }
#productinfoBody #navBreadCrumb{ display: block; }

Which has a lot fewer rules


seems to work on test site, but haven't fully tested it

13 Mar 2011, 9:53 AM
#13
athens_collectibles avatar

athens_collectibles

Zen Follower

Join Date:
May 2010
Location:
Athens, Greece
Posts:
293
Plugin Contributions:
0

Re: How to remove breadcrumbs from non-store pages?

Many thanks for the explanation Nigel. I had never thought of looking into the source and see the <body id=...>. I can easily create html pages with the use of FrontPage even though this is an antiquated application. The difficulty with Zen Cart is that the html code is created by various php files and it's not easy to follow the logic, unless you are a php programmer. Unfortunately I'm not, although I would like to and I consider to do some reading if I ever find the time. Even at 63, it's never too late.

What I still can not understand is how the php code decides on the body id name. It seems to be the page name but...

...the standard Zen Cart name for the Contact us page is contact_us (with an underscore). I needed my own page with captcha and upload links and I'm using an external form processing company where the form is sent without my email address being revealed. There are a lot more advantages to this approach but this is another story. Having created a new page I entered the html in the editor and it works perfectly. However, I had to give the page another name and I named it contactus (without an underscore).

If I look at the source code of each of the two pages, they both have <body id="contactusBody">, which seems funny. I don't really mind because I only use one of them but it could be an issue for someone else.

Finally, your idea of removing breadcrumbs for all pages and enabling them on categories and products is excellent. It would reduce the size of my stylesheet.css considerably and I shall try it as soon as possible on my local XAMPP installation. It looks perfectly correct at a first glance and I don't anticipate any problems.

Thank you again for your contribution and for the tip with breadcrumbs. Kind regards from Athens, Greece.