Arrange Categories & Sub-Categories in New CC6

[bosanci28]

Hello,

 

I am doing some tests to see how the new CC6 runs, coming from v4.

 

Updated okay from v4 to v6.0.0b6

 

But because i had categories and sub-categories on the left side in v4, the new v6 add it them in top and not sure if there is a setting to put them under one tab or a way to add them again to the left side.

 

I also when i click any category tab or sub i get "404 Not Found" error.

 

Any advice or suggestions? on this matter will appreciate!.

 

My v4 site: alltvparts.com

 

My new testing v6 site: http://v6.alltvparts.com/

 

(in case if i don't suppose to post hot links please remove)

 

Thank you,

B.

[bsmither]

I concur that you definitely want the "Shop by Category" box to have a vertical orientation. So, you may want to install Kurouto and see how CC6 looks with that skin. It won't be "responsive" if that's what you are wanting, but I think your CC4 skin is not "responsive" either. So, nothing lost. There may be some instruction at the Foundation Developer's web site to get a vertically oriented Navigation section.

 

I can't tell if your CC4 has a third-party SEO plugin, or are using CC4's native SEO capability (actually, I don't know CC4 that well, so I can't factually state that CC4 has a built-in SEO capability).

 

But CC6 is coded to run in SEO Mode... period. Therefore, if you are getting 404 errors, then this CC6 installation did not get an appropriate .htaccess file installed in the root folder of the CC6 install. Or if it did, the web server is not configured to use it.

[havenswift-hosting]

I concur that you definitely want the "Shop by Category" box to have a vertical orientation. So, you may want to install Kurouto and see how CC6 looks with that skin. It won't be "responsive" if that's what you are wanting, but I think your CC4 skin is not "responsive" either. So, nothing lost. There may be some instruction at the Foundation Developer's web site to get a vertically oriented Navigation section.

Any store having more than five or six top level categories is not going to be able to use the top horizontal menu system built into Foundation - what would be idea would be a simple switch within the skin to determine which one to use as this is going to be an extremely common request. Using an old V5 skin that has side bar category menu systems would solve this problem but is a bit of a backward step if using a core skin due to these not being responsive and Google are now increasingly ranking non mobile friendly sites much lower.

I can't tell if your CC4 has a third-party SEO plugin, or are using CC4's native SEO capability (actually, I don't know CC4 that well, so I can't factually state that CC4 has a built-in SEO capability).

V4 certainly does have SEF / SEO url functionality built in

But CC6 is coded to run in SEO Mode... period. Therefore, if you are getting 404 errors, then this CC6 installation did not get an appropriate .htaccess file installed in the root folder of the CC6 install. Or if it did, the web server is not configured to use it.

This is likely the case if you look at the format of the urls that are displayed when clicking on a category

Ian

[Dirty Butter]

I looked at the Foundation forum explanation of getting a sidebar, but it was past my level of understanding. (link is on this forum somewhere) This is definitely something I need.

[bosanci28]

I concur that you definitely want the "Shop by Category" box to have a vertical orientation. So, you may want to install Kurouto and see how CC6 looks with that skin. It won't be "responsive" if that's what you are wanting, but I think your CC4 skin is not "responsive" either. So, nothing lost. There may be some instruction at the Foundation Developer's web site to get a vertically oriented Navigation section.

 

I can't tell if your CC4 has a third-party SEO plugin, or are using CC4's native SEO capability (actually, I don't know CC4 that well, so I can't factually state that CC4 has a built-in SEO capability).

 

But CC6 is coded to run in SEO Mode... period. Therefore, if you are getting 404 errors, then this CC6 installation did not get an appropriate .htaccess file installed in the root folder of the CC6 install. Or if it did, the web server is not configured to use it.

Hello,

 

I mostly wanted to go from v4 to 6 because v6 is responsive! This days lot's of clients come from cell phones and if you site is not responsive then is not good.

Now, If there was a mod or way to add  at top a tab like this:

 

Categories

-Sony

--sony model 1

--sony model 2

-Samsung

--samsung model 1

--samsung model 2

 

and so on..., so this way will be a drop down ,and when you click the sub-cat to show to the right ,like in the above example.

 

Regarding the SEO, In v4 under admin/general settings i have the seo enabled. (see screen)

 

Also regarding the .htaccess ,there is few difference between the 2 also from v4 to v6. (i have attached both )

 

 

I was thinking to move all my site to wordpress/woocommerce , but worry about getting my site hacked,as with v4 for 5 years that i have it,never been hacked, so that's

why i may want to stick to something like cubecart or...

 

Thanks for advice and help. 

old v4 .htaccess.txt

old v6 .htaccess.txt

[bsmither]

At this site:

https://dirtybutter.com/plushcatalog/index.php

for "Puppets", the sub-subcats fly out to the right.

[ayz1]

At some point I will be in the same position as we have too many categories for the basic set up to handle. I will probably look at hard coding the menu into the position I want it. There are some example menus you could maybe use at http://designscrazed.org/css3-jquery-dropdown-menus/ or http://pixelbell.com/css-menu-tutorials/ there will be other examples out there also.

[ayz1]

Just had a look at this and what may be a simple solution is to hard code the existing menu in with say 5 or 6 categories along with an A-Z link which opens up a new page with all the categories and sub categories on.

[Dirty Butter]

I decided to bite the bullet and completely re-do our Animals Category (way too long as it was). I just hope it makes sense to our customer base; it is certainly more suited to the top bar navigation Foundation uses.

 

https://dirtybutter.com/plushcatalog/plush-animals.html

[havenswift-hosting]

I decided to bite the bullet and completely re-do our Animals Category (way too long as it was). I just hope it makes sense to our customer base; it is certainly more suited to the top bar navigation Foundation uses.

Yes your Animals category was way too large and ideally needed to be shorter but things like this should never be done because the software is forcing the issue but should always be done because it is the right thing for the users. UX is key and as big as it was, if you lose sales because customers cant find items or find it difficult to navigate then it is the wrong decision. Gave you also thought about the SEO consequences of any change ?

Foundation desperately needs a side bar menu option in what is otherwise a great skin (for a basic starter give away)

Ian

[Dirty Butter]

Oh I agree that Foundation desperately needs a sidebar option, but evidently that's not going to be stock anytime soon.

 

Only time will tell if sales reflect this way being harder for customers. And yes, the next step is to make redirects to the new categories. Well actually, I create customized url's and meta data for all links, so I did not change any of the actual brand name links. What I need to do is use robots to keep the Brand A-C type links from being crawled, and some way to keep them out of the sitemap.

[ayz1]

To add a simple side menu on the left of the page.

 

In the skin folder foundation/templates/main.php

 

Replace

 

            <div class="row {$SECTION_NAME}_wrapper">

               <div class="small-12 large-9 columns small-collapse">

                  {include file='templates/box.errors.php'}

                  {include file='templates/box.progress.php'}

                  {$PAGE_CONTENT}

               </div>

               <div class="large-3 columns show-for-large-up">

                  {include file='templates/box.featured.php'}

                  {include file='templates/box.popular.php'}

                  {include file='templates/box.sale_items.php'}

               </div>

 

With

 

            <div class="row {$SECTION_NAME}_wrapper">

 

               <div class="large-3 columns show-for-large-up">

                  {include file='templates/box.featured.php'}

                  {include file='templates/box.leftmenu.php'}

                  {include file='templates/box.popular.php'}

                  {include file='templates/box.sale_items.php'}

               </div>

 

               <div class="small-12 large-9 columns small-collapse">

                  {include file='templates/box.errors.php'}

                  {include file='templates/box.progress.php'}

                  {$PAGE_CONTENT}

               </div>

 

In the skin folder foundation/templates create a new file called box.leftmenu.php

 

Add the following code

 

{*

 * CubeCart v6

 * ========================================

 * CubeCart is a registered trade mark of CubeCart Limited

 * Copyright CubeCart Limited 2015. All rights reserved.

 * UK Private Limited Company No. 5323904

 * ========================================

 * Web:   http://www.cubecart.com

 * Email:  [email protected]

 * License:  GPL-3.0 https://www.gnu.org/licenses/quick-guide-gplv3.html

 *}

<div class="panel" id="box-popular">

  <h3>CATEGORIES</h3>

  <ul>

<li><a href=â€#â€>Ford</a></li>

<li><a href=â€#â€>Nissan</a></li>

<li><a href=â€#â€>Toyota</a></li>

<li><a href=â€#â€>Jaguar</a></li>

<li><a href=â€#â€>Volvo</a></li>

  </ul>

</div>

 

Save the file and view in browser, should look something like this.

 

 

Very simple but can be formatted using css to get the desired effect.

[bosanci28]

I decided to bite the bullet and completely re-do our Animals Category (way too long as it was). I just hope it makes sense to our customer base; it is certainly more suited to the top bar navigation Foundation uses.

 

https://dirtybutter.com/plushcatalog/plush-animals.html

Hmm, That looks good how you have done the "Animals" Tab, then you have the "Brands A-C" and you have the sub for it: "Aurora"

 

That is kind what i may need to do ,because of my site being for tv parts and have a lot of brands and each brand have a lot of model numbers.

 

So i need to figure out how to do it like you, have a top menu tab named:

 

*Categories

then, in the drop down to have 

**Sony

then, all the sub-models:

***Model1

***Model2

and so on.

 

Then under categories and brand name and their model numbers.

 

And for the left menu to have only site links to "terms,about us,contact,etc...

 

Also in main page @ v6.alltvparts.com i have that picture with those books, i need to figure out how to remove that 

and add a photo slider there instead , and the slider to pull out pictures from

products listed on the site and display  them on random or some specific banners, but of course

all site must be responsive after editing or adding other php codes.

 

Thanks,

[bosanci28]

To add a simple side menu on the left of the page.

 

In the skin folder foundation/templates/main.php

 

Replace

 

            <div class="row {$SECTION_NAME}_wrapper">

               <div class="small-12 large-9 columns small-collapse">

                  {include file='templates/box.errors.php'}

                  {include file='templates/box.progress.php'}

                  {$PAGE_CONTENT}

               </div>

               <div class="large-3 columns show-for-large-up">

                  {include file='templates/box.featured.php'}

                  {include file='templates/box.popular.php'}

                  {include file='templates/box.sale_items.php'}

               </div>

 

With

 

            <div class="row {$SECTION_NAME}_wrapper">

 

               <div class="large-3 columns show-for-large-up">

                  {include file='templates/box.featured.php'}

                  {include file='templates/box.leftmenu.php'}

                  {include file='templates/box.popular.php'}

                  {include file='templates/box.sale_items.php'}

               </div>

 

               <div class="small-12 large-9 columns small-collapse">

                  {include file='templates/box.errors.php'}

                  {include file='templates/box.progress.php'}

                  {$PAGE_CONTENT}

               </div>

 

In the skin folder foundation/templates create a new file called box.leftmenu.php

 

Add the following code

 

{*

 * CubeCart v6

 * ========================================

 * CubeCart is a registered trade mark of CubeCart Limited

 * Copyright CubeCart Limited 2015. All rights reserved.

 * UK Private Limited Company No. 5323904

 * ========================================

 * Web:   http://www.cubecart.com

 * Email:  [email protected]

 * License:  GPL-3.0 https://www.gnu.org/licenses/quick-guide-gplv3.html

 *}

<div class="panel" id="box-popular">

  <h3>CATEGORIES</h3>

  <ul>

<li><a href=â€#â€>Ford</a></li>

<li><a href=â€#â€>Nissan</a></li>

<li><a href=â€#â€>Toyota</a></li>

<li><a href=â€#â€>Jaguar</a></li>

<li><a href=â€#â€>Volvo</a></li>

  </ul>

</div>

 

Save the file and view in browser, should look something like this.

 

 

Very simple but can be formatted using css to get the desired effect.

 

So the categories php code listed above , do we need to add all manual? or is pulled from the top tabs? Aslo , What is the code to add sub-cat? like *Volvo , **Volvo1,**Volvo2.

 

I need to see where exactly i need to edit the top tab.

 

Thank you for your advice and help.

[Dirty Butter]

To be helpful the barebones example ayz1 provided would have to use the Smarty system, so {$CATEGORIES} would work there, with proper styling. I don't know how to do that.

[bosanci28]

Thank you for reply!, Will have to look on this within few days, and also maybe get little more help from my coder to see what can be done, to move some things around and to have it look better.

 

Was going to move to wordpress/woocommerce but reading all the news about hackers getting into wp sites, i may want to invest little into a php platform that is more secure.

[ayz1]

The {$CATEGORIES} could be used and formatted accordingly but we also need to think about the responsive side of things. If there are a lot of categories it's going to get very messy, especially on a mobile. On V5 I coded the links in myself as it gives more control over how the navigation looks.


On http://www.thecosmetichouse.com I have a small list of categories at the top with a link to an A-Z page with all of the categories on. I also have a list in the left column showing the main brands. This works for me.

On the mobile skin I have a list of the main categories at the top and a seperate page with an A-Z of brands. Personally I think it looks better and is easier for the user to find their way around rather than having to scroll through dozens of categories to get to the popular products.

I think I will take the same approach with V6. Obviously there is more work doing it manually but I never found a way to autofill the categories that looked any good.

[Dirty Butter]

I liked the way Foundation handled our long list of categories on mobile, not as much with the alphabetical subcategories and sub-sub categories for the Animals. The hover on top-bar nav makes it almost instantly obvious what the alphabetical arrangement means. But on mobile it requires a click, so the actual brand children are hidden totally until clicked.

 

Whatever I end up with as a sidebar nav needs to go to something similar to the Foundation arrangement for mobile for me. May well end up paying someone for just the responsive side-bar nav. I really do like it better on a big screen.

[ayz1]

Having had a closer look at V6 mobile I agree the foundation skin handles things much better than V5. I also like the big screen better unfortunately everthing is going mobile so hopefully V6 will help us keep up. I'm going to work on the foundation skin over the next few days/weeks so hopefully will find a suitable solution.

[Dirty Butter]

47% of our December (our busiest season) site visits were Mobile!!

[SemperFi]

Here is my quick attempt at this...

Before

 

After


I still need to move that first level over so the original top level is still accessible.
Plus I have not tested it using a mobile device.

You are more than welcome to test it for yourselves here:
http://cc6demo-modifications.semperfiwebservices.com/

[Dirty Butter]

Needs some work, as you said, but the desktop version certainly has promise. Contacting you. Thanks, Semper Fi!!

[bosanci28]

SemperFi, That demo @ http://cc6demo-modifications.semperfiwebservices.com/ Looks really good, nice...

 

Have sent you a PM.

 

Thanks.