Forums / Templates, Stylesheets, Page Layout / Disabling the Category nav on the catalog index page

Disabling the Category nav on the catalog index page

Locked

Views: 2,950

Results 1 to 20 of 27
This thread is locked. New replies are disabled.
23 Jun 2009, 7:19 PM
#1
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Disabling the Category nav on the catalog index page

I'm creating a custom jewelry site that allows a customer to have 2 options for shopping, "Ready to Wear" jewelery, or "design Your Own."

I'd like my catalog index page to look like THIS and not contain the left navigation like the rest of the site. The two boxes with images you see will be links to the two categories, and will take you to the corresponding sub-cat in the catalog.

How could I disable this nav without changing it on the global template? This doesn't seem possible by editing the tpl_index_default.php page. Any help is much appreciated.

23 Jun 2009, 9:41 PM
#3
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

That helps a lot, but actually doesn't solve my problem. The Category Nav is actually in the tpl_header.php file, so disabling the left column doesn't disable the nav. I searched for some similar articles on how to do this, but came up empty.

I suppose I could move the entire nav out of the header and into the left column? I'm not sure how comfortable I am doing this, however, and need to make sure everything will still work as normal in the admin panel for my client to add and change things once I'm completed.

Any ideas?

23 Jun 2009, 10:18 PM
#4
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Disabling the Category nav on the catalog index page

OK. I am a bit confused now. A URL would help to see what the rest of the site is like so that we know what it is that you are trying to get rid of.

In the default version of zen cart you have

#navMain which is usually at the top of the page and contains liks like 'shop' checkout and login
#navCatTabs which is under the header and contains category links
And there is a category sidebox which is either left or right.

From the phrase > I'd like my catalog index page to look like THIS and not contain the left navigation like the rest of the site. I thought that you meant the left sidebox.

#navmain could be disabled by selective css files and use of display:none;

#navCatTabs can be turned of globally in the admin panel but if you want to do it selectively for one page then probably selective css files are the way to go.

As, I say it would really help to have a URL of the site to understand exactly what it is that you are trying to do.

Nick
iszent.com

23 Jun 2009, 10:27 PM
#5
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

Here is what I want the catalog index page to look like
Desired Home Page

Here's what it currently looks like with left sidebar turned off, but catNav still enabled.
Current Home Page

I thought of selective css also, but wouldn't I need to add an id to the body tag of the page I want to exclude, i.e. <body id="catalogHome">?

23 Jun 2009, 10:46 PM
#6
kobra avatar

kobra

Black Belt

Join Date:
Aug 2005
Location:
Arizona
Posts:
31,500
Plugin Contributions:
4

Re: Disabling the Category nav on the catalog index page

Try creating in your template dir a folder I believe is named "home" or maybe "indexHome"and in it a custom tpl_header.php file without the navcattabs
If this is not successful try placing a custom tpl_main_page.php file there and your custom tpl_header.php file in the templates /template folder renamed to something like tpl_main_header.php.
Then in the custom tpl_main_page.php change these lines

  $header_template = 'tpl_main_header.php';
  $footer_template = 'tpl_footer.php';
  $left_column_file = 'column_left.php';
  $right_column_file = 'column_right.php';
<div id="mainWrapper">
<?php
 /**
  * prepares and displays header output
  *
  */
  if (CUSTOMERS_APPROVAL_AUTHORIZATION == 1 && CUSTOMERS_AUTHORIZATION_HEADER_OFF == 'true' and ($_SESSION['customers_authorization'] != 0 or $_SESSION['customer_id'] == '')) {
    $flag_disable_header = true;
  }
  require($template->get_template_dir('tpl_main_header.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_main_header.php');?>

Zen-Venom Get Bitten

23 Jun 2009, 10:49 PM
#7
kobra avatar

kobra

Black Belt

Join Date:
Aug 2005
Location:
Arizona
Posts:
31,500
Plugin Contributions:
4

Re: Disabling the Category nav on the catalog index page

Your unordered list appears to be residing outside of the headerWrapper??

Zen-Venom Get Bitten

23 Jun 2009, 11:10 PM
#8
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Disabling the Category nav on the catalog index page

Personally I would get rid of the navigation on the desired pages by using a #navCatTabs{display:none;} rule in stylesheets for that page.

To see how to aplly a stylesheet to a particular page read (the slightly cryptic) explanation that is included in a readme file in the css folder of the template.

Basically you need to create a new stylesheet with the correct name. The naming protocols are described in that read me.

This way you can apply the {display:none;} on any page you choose.

But I prefer css solutions to php so that is just my way....

Nick
iszent.com

24 Jun 2009, 3:46 PM
#9
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

I think CSS is the way to go on this -- that way I can also make additional layout changes that only apply to the home page.

That being said, I read the CSS readme file and understand what to do...just not how to do it. Since I want to change only one page, it suggests creating a page_name.css file. Two questions arise for me, (1) do I save this file in my CSS folder of my template override directory (with the other CSS files)? Or do I need to save it in the same level as the page itself? (2) Do I name the file index.css or tpl_index_default.css? I've tried both in the CSS folder of my override directory, and neither seems to work. Any ideas?

24 Jun 2009, 7:44 PM
#10
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Disabling the Category nav on the catalog index page

Ahhhh! The index page thing.

I believe that the index page is the one page that can't be specified like this. And I haven't had a better answer from the forum on the issue.

Use stylesheet.css for the index page and any pages that share its format.

Then use a new stylesheet for the other pages. It is used in addition to stylesheet.css but after stylesheet.css so any conflicts the new stylesheet will take precedence.

It goes in the same directory as the stylesheet.css file.

Nick
iszent.com

24 Jun 2009, 7:58 PM
#11
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

I think I understand, but do I need to give the stylesheet a specific name? Almost all of my pages besides the index will have the same styles, so this secondary stylesheet will have to apply to 99% of my pages. How do I identify which pages need to use this new stylesheet?

24 Jun 2009, 8:38 PM
#12
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Disabling the Category nav on the catalog index page

OK. I am going to back track just a bit. (I am deep in a struggle of my own :smile: and am having a bit of difficulty seeing the big picture on your site.

Let me ask a question.

I know how you want the home page to look? Just the header , no sidebar and no navCatTabs.

What do you want the other pages to look like?

There may be a much easier way to do this. The stylesheets will work but you are going to have to create a lot of stylesheets. So, if there is an easier way lets take it.

If the answer is that you want it to look the same but with the navCatTabs in place then there is probably an easier work around.

Let me know.

Nick
iszent.com

24 Jun 2009, 8:56 PM
#13
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

I appreciate you helping me through this.

I've attached a comp of what my inside pages will look like. While the content in the middle will change, the left nav will be in all of my subsequent pages once you get past the home page.

The "Design Your Own" and "Ready to Wear" are my 2 main categories in the catalog. Each will have sub categories within that, which will become the side nav. It's like there will be 2 separate sides to the site (and 2 separate navCatTabs). Don't get too hung up on this, but I wanted to give you as much info as possible to make sure we go about this the correct way.

24 Jun 2009, 9:15 PM
#14
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Disabling the Category nav on the catalog index page

OK we are going about this the wrong way.

Sorry for messing around. Concentration was a bit elsewhere. (Why don't my product end up in the blinking shopping blinking cart if they have attributes when the did just fine yesterday:frusty:)

What you want to do is disable navCatTabs completely. here is a setting in the admin panel. But don't do it quite yet! It will be nice to see it for a while to match the styling if you want to!

Then we will set you up a categories sidebox that is not used on the home page. Have a look at:

https://www.zen-cart.com/tutorials/index.php?article=270

So first enable the categories sidebox in the admin panel.

admin - tools - layout box controller -

Find sidebox/categories.php and select it. Then click edit on the box on the right hand side. Basically turn the sidebox on and select left hand side.

Normally this would be enough. So, have a look at what we have done ( it won't be beautiful ) and see what we have. Your template appears a bit funky at this end so you might need to adjust the column width and sidebox width as well.

Let me know.

Then we'll get on with styling the sidebox to match what you have there already.

Nick
iszent.com

24 Jun 2009, 11:18 PM
#15
niccol avatar

niccol

Totally Zenned

Join Date:
Apr 2009
Posts:
2,138
Plugin Contributions:
1

Re: Disabling the Category nav on the catalog index page

OK, due to the grace and knowledge of the forum my problem is solved.

Yes, I really recommend doing this with sideboxes rather than the navCatTabs.

The previous post explained how to implement a categories sidebox. Once we have that we will clone it. So you have two sideboxes showing the categories and their sub-categories. Then we will edit the sideboxes so that one shows only one category and one shows only the other.

Then you can select which pages display which side box.

I guess that for certain pages like the checkout you may want neither or both?

Apologies again for being a bit unfocused.

Nick
iszent.com

24 Jun 2009, 11:52 PM
#16
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

Awesome! This seems like it will put me right where I need to go. I'm going to study up on what you said and play around a bit. Once I get to the next step I will be seeking your advice again. Thank you for your help!

8 Jul 2009, 3:04 PM
#17
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

niccol:

OK, due to the grace and knowledge of the forum my problem is solved.

Yes, I really recommend doing this with sideboxes rather than the navCatTabs.

The previous post explained how to implement a categories sidebox. Once we have that we will clone it. So you have two sideboxes showing the categories and their sub-categories. Then we will edit the sideboxes so that one shows only one category and one shows only the other.

Then you can select which pages display which side box.

I guess that for certain pages like the checkout you may want neither or both?

Apologies again for being a bit unfocused.

OK, I've picked this up again and am going to take your advice on the sideboxes. I tried turning on the categories sidebox as mentioned in your previous post, but nothing seemed to change. Again, I want the categories to be my main nav on the left on most of my pages, and like you said, there will be 2 versions of these for the two sides of the site. How do I get the categories sidebox to act as my nav?

Another question that should be asked, is should I have all of my store configuration done before I start styling? I've kind of been in a catch 22 since this is my first ZC operation -- I want to set everything up internally before I start styling, but once I start styling I'm afraid I'll have set it all up wrong. I suppose I should just go for it and figure it out along the way.

Check out THIS PAGE to reference what I currently have. I want the category links to remain as the main content of the page (like they currently are), but also have a nav with all of the categories to the left as well. According to my admin panel, the categories sidebox should be currently activated, but I can't seem to find it in my code.

OK, enough rambling. If I could get your reactions to any of my many questions, that would be wonderful. Thanks again!

8 Jul 2009, 3:18 PM
#18
ktomas avatar

ktomas

New Zenner

Join Date:
Nov 2008
Posts:
71
Plugin Contributions:
0

Re: Disabling the Category nav on the catalog index page

Alright, let me clarify the problem a little more specifically.

The categories sidebox (along with the NavCatTabs) does show up once you get to the product itself. You can see the (ugly) example HERE

Neither the categories sidebox or NavCatTabs show up between when you select the main category and when you get to the product. You can see an example HERE

Obviously there are many styling issues that need to be attended to, but how do I make sure the categories sidebox is visible on most of my pages (all but the home page for now)?

8 Jul 2009, 3:48 PM
#19
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Disabling the Category nav on the catalog index page

You want a totally different layout on the home page than on other pages. The simplest way to go about this will be to use the tpl_main_page "flag_disable_xxx" features to turn off header, left & right columns and possibly footer:

  if ($this_is_home_page) {
     $flag_disable_header = true;
     $flag_disable_left = true;
     $flag_disable_right = true;
     $flag_disable_footer = true;
  }

Then use define_main_page.php in Tools > Define Pages Editor to display the content and the two links you want on the home page.

8 Jul 2009, 3:54 PM
#20
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Disabling the Category nav on the catalog index page

Assuming your two main links are top categories, you can suppress their display in the stylesheet with

a.category-top {display: none;}

The subcats of the one active category will then show in the categories sidebox. You do want to consider allowing an easy way for customers to get from one side to the other without having to backtrack to the home page.

You may want to use Categories Dressing to allow more detailed control of the categories sidebox.