Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Edit subcategory page without products

Edit subcategory page without products

Views: 1,404

Results 1 to 10 of 10
18 Nov 2012, 6:40 PM
#1
sports_guy avatar

sports_guy

Totally Zenned

Join Date:
Apr 2007
Location:
Dayton, Ohio
Posts:
682
Plugin Contributions:
0

Edit subcategory page without products

I am having a difficult time understanding how to change the layout of my category pages that contain subcategories.

Here is a category page with products: http://www.lasilhouettelingerie.com/store/201-250-c-82_87/ Depending on who you ask, looks nice. I want this for multiple product views.

Here is a category page WITHOUT products and subcategories: http://www.lasilhouettelingerie.com/store/shop-by-price-c-82/ This looks wrong. For a page with no products why display a wide open columnar display with too much white-space.

I would like just a list that goes straight down, and aligned left. I thinks a plugin came with my template that shows the products in a column display which is perfect, I just don't want my category pages showing subcategories (and no products) to look the same. Is there an easy fix for this?

18 Nov 2012, 7:27 PM
#2
kobra avatar

kobra

Black Belt

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

Re: Edit subcategory page without products

Add images to the sub-cats
i.e. $10 - $50

19 Nov 2012, 12:27 AM
#3
sports_guy avatar

sports_guy

Totally Zenned

Join Date:
Apr 2007
Location:
Dayton, Ohio
Posts:
682
Plugin Contributions:
0

Re: Edit subcategory page without products

Adding an image did not change the spacing at all. But what I did find, was that I had all my product images stretched to a certain size. In admin> configuration> images> Image - Use Proportional Images on Products and Categories, I had set to 1. When I unchecked this, much of the white-space disappeared (you can see the revised size here: http://www.lasilhouettelingerie.com/store/shop-by-price-c-82/). I still have issues. The fields are still too far apart and they are still in columns, I would like them in one a row if possible without so much space.

My biggest problem is that I need to use the "Use Proportional Images on Products and Categories" set to 1 since I have many different size images and thousands of current products (and I don't trust the client to load properly sized images). As you know, if your images are not uniform in a columnar display, it looks awful. As can now be seen here: http://www.lasilhouettelingerie.com/store/elle-macpherson-c-72_122/

So, is it possible to display pages that have products available in the columnar display, but for any category pages without products (namely the subcategory view page, because they only keep subcategories and not products) go to a singular row list page that I can control with css? all I want to do on the subcategory page is change the view from columns to rows and put the sub-categories together in a row (without images). Just like a bullet list. Or at the very least, keep the subcategory view page in columns but take away this image stretch feature just on these pages? This way I can then put the text closer together? I think my template had a column display plugin attached and I just turned it on.

19 Nov 2012, 3:53 PM
#4
sports_guy avatar

sports_guy

Totally Zenned

Join Date:
Apr 2007
Location:
Dayton, Ohio
Posts:
682
Plugin Contributions:
0

Re: Edit subcategory page without products

I noticed when I turned off columns to rows, I still get the same results and display for this category page without products. So this issue has nothing to do with my columnar display. In fact even after my product pages with products go to rows, the category pages without products are still in 2 columns. This has do with the proportional images feature versus the product page with no products.

Hmmmm. OK I guess I can live with the columnar display if I have too. But I do have to use the set proportional images function and with this the spaces are way to wide. And I don't want to use images on the pages without products and sub-categories only.

Is it possible for some PHP on my category coding to say:

if no products and images on category or subcategory pages (subcategories display only)
then remove proportional image function

---or----

if no products and images on sub-category pages (subcategories display only)
then set proportional image to 0 (which is off)/

This would allow me to display my products with the wide columns and better image size, while allowing my subcategory list pages to show like a normal list without huge amounts of white-space forced by the proportional image setting.

20 Nov 2012, 5:03 AM
#5
sports_guy avatar

sports_guy

Totally Zenned

Join Date:
Apr 2007
Location:
Dayton, Ohio
Posts:
682
Plugin Contributions:
0

Re: Edit subcategory page without products

OK, I was able to find some definitions and make some changes, but I think I just need a little help now. For one this category (without products and sub-category page) has a few of it's own definitions. I just had to add css to do some things. The problem now is that I am able to align all these products the way I want, but I need to hide the images, and you can't hover over the text properly to select a sub-category. You can look at it here:

http://www.lasilhouettelingerie.com/store/shop-by-designer-c-72/
http://www.lasilhouettelingerie.com/store/lingerie-c-191/

I tried to shrink the size of the subctegory grid by using a reverse margin like this:
.categoryListBoxContents {margin: -20em 0 0 10em;text-align:left;}

It seemed to push the fairly large images space up as well instead of just collapsing the image or riding over top which is what I want.

For one when you hover over the text it does not highlight. You have to hover very high (-20em or so) for each link to hover color. I would like to add css to disable the ability to add any images here. If I did this I think it would all align properly. But in looking at my css there is no div for the image. Here is a small sample of source code:

<!-- bof upload alerts --> <!-- eof upload alerts -->  <div class="centerColumn" id="indexCategories"> <h1 id="indexCategoriesHeading">Lingerie</h1>   <!-- BOF: Display grid of available sub-categories, if any -->   <div class="centerBoxWrapperContents"> <table width="100%" align="center" cellpadding="1" cellspacing="15" border="0">  <tr>     <td width="49.5%" align="center" valign="top"><div class="categoryListBoxContents" style="width:100%;"><a href="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/bras-c-191_1.html"]http://www.lasilhouettelingerie.com/store/bras-c-191_1.html[/URL]"><img src="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/lingerie-c-191/images/ellecloudswingdemilinedbra.JPG"]images/ellecloudswingdemilinedbra.JPG[/URL]" alt="Bras" title=" Bras " width="200" height="300" /><br />Bras</a></div></td>     <td class="vDotLine" rowspan="10"></td>     <td width="49.5%" align="center" valign="top"><div class="categoryListBoxContents" style="width:100%;"><a href="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/bustier-c-191_144.html"]http://www.lasilhouettelingerie.com/store/bustier-c-191_144.html[/URL]"><img src="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/lingerie-c-191/images/pixel_trans.gif"]images/pixel_trans.gif[/URL]" alt="Bustier" title=" Bustier " width="200" height="300" /><br />Bustier</a></div></td>      </tr>  <tr>     <td class="hDotLine"></td><td class="hDotLine"></td></tr>   <tr>     <td width="49.5%" align="center" valign="top"><div class="categoryListBoxContents" style="width:100%;"><a href="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/controland-shapers-c-191_184.html"]http://www.lasilhouettelingerie.com/store/controland-shapers-c-191_184.html[/URL]"><img src="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/lingerie-c-191/images/pixel_trans.gif"]images/pixel_trans.gif[/URL]" alt="Control/ Shapers" title=" Control/ Shapers " width="200" height="300" /><br />Control/ Shapers</a></div></td>         <td width="49.5%" align="center" valign="top"><div class="categoryListBoxContents" style="width:100%;"><a href="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/panties-c-191_66.html"]http://www.lasilhouettelingerie.com/store/panties-c-191_66.html[/URL]"><img src="[URL="http://www.zen-cart.com/view-source:http://www.lasilhouettelingerie.com/store/lingerie-c-191/images/pixel_trans.gif"]images/pixel_trans.gif[/URL]" alt="Panties" title=" Panties " width="200" height="300" /><br />Panties</a></div></td>      </tr>

the hDotLine has a display:none only attached. I just seems like I cannot get rid of these images on these subcategory pages. I just want to hide them on this sub-cateogory page where there are no products. And what upsets me now is there is no definition attached to this image. I mean the image has to have a definitions somewhere right?

21 Nov 2012, 2:58 PM
#6
sports_guy avatar

sports_guy

Totally Zenned

Join Date:
Apr 2007
Location:
Dayton, Ohio
Posts:
682
Plugin Contributions:
0

Re: Edit subcategory page without products

If you are following, I changed direction and am seeking different answers to the same problem here: http://www.zen-cart.com/newthread.php?do=postthread&f=128.

I understand it's not good practice to ask the same question in a different thread, but the new thread goes in a different direction and asks a different question.

21 Nov 2012, 4:15 PM
#7
gjh42 avatar

gjh42

Black Belt

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

Re: Edit subcategory page without products

Have you looked at Configuration > Maximum Values > Categories To List Per Row ? You can set it to 1 if you want a single-column display, or 3, 4 or 5 to tighten up the names horizontally.

There is also Configuration > Images > Subcategory Image Width and Subcategory Image Height.

In a stock v1.5.1 installation, subcats with no images have zero space reserved for an image. (I haven't looked in IE to see if it gives its stupid "no image" icon to draw attention to the fact that an image is not there.)

21 Nov 2012, 6:23 PM
#8
sports_guy avatar

sports_guy

Totally Zenned

Join Date:
Apr 2007
Location:
Dayton, Ohio
Posts:
682
Plugin Contributions:
0

Re: Edit subcategory page without products

gjh42:

Have you looked at Configuration > Maximum Values > Categories To List Per Row ? You can set it to 1 if you want a single-column display, or 3, 4 or 5 to tighten up the names horizontally.

There is also Configuration > Images > Subcategory Image Width and Subcategory Image Height.

In a stock v1.5.1 installation, sub-cats with no images have zero space reserved for an image. (I haven't looked in IE to see if it gives its stupid "no image" icon to draw attention to the fact that an image is not there.)

First off thank, you so much for piping in I appreciate your help. I have been spending days (cumulative) on this issue and am frustrated at this point. Yes, I am aware of those settings. I am viewing this page in Firefox. I have this set in the admin> configuration> images> Image - Use Proportional Images on Products and Categories, I had set to 0, as I need the product images to display on the page below properly (and cannot trust the owner to take the right dimensions for her images).

I like the columnar display with 3 rows which an example can be seen here: http://www.lasilhouettelingerie.com/store/hosiery-c-141/?zenid=3d0f03bedbf0bd77a8def7e63537b280 Great looking layout in my opinion.

The problem is my sub-category page with no images. Can be seen here: http://www.lasilhouettelingerie.com/store/accessories-c-193/ Notice all the white-space? This white-space corresponds with the image settings I have set in the admin> images like you mention. These are the sizes I need for my thumbnail pics. I know (am fairly sure according to logic) the problem with all this white-space on the second page above is the setting in question. If I turn this proportional image setting to 1, all the white-space disappears on my sub-category page. I looked at the css and could not find any definitions to take out this white-space with proportional images set to 0. The - margin just moved the white-space elsewhere.

I tried uploading a very small image (maybe a spacer) like Cobra recommended the white-space stayed the same. The only way for me to remove the white-space is to set proportional images to 1, Which then makes my product images look poor and which I need.

21 Nov 2012, 6:52 PM
#9
gjh42 avatar

gjh42

Black Belt

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

Re: Edit subcategory page without products

Why do you have subcategory images set to 200px wide x 300px high, if you don't want subcat images?

This setting is separate from product image settings.

21 Nov 2012, 9:37 PM
#10
sports_guy avatar

sports_guy

Totally Zenned

Join Date:
Apr 2007
Location:
Dayton, Ohio
Posts:
682
Plugin Contributions:
0

Re: Edit subcategory page without products

Glen I am such an imbesile! Should have my brain checked for this one, I am sorry to waste everyone's time on this thread. These setting that I looked at, over and over again, and still did not get it until you pointed it out. Don't know how much clearer it could have been.

Thank you very much AGAIN!