PrestaShop Forum

The best place in the world to ask questions about PrestaShop and get advice from our passionate community!

PrestaShop Forum

Jump to content

 

[MODULE] AJAX Sliding Accordion Categories

159 replies to this topic
#1
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
This module allows subcategories in the Front Office and Back Office to be dynamically loaded to reduce load time. It also adds the option to display categories using accordions so only one set of subcategories is open at a time, saving vertical space. Here's a list of all the options:

Tree Settings

* Maximum depth: Allows a limit on the maximum number of sublevels displayed at a time to be set (as in the original category block).
* Product numbers: Allows the number of products in each category (and optionally subcategories) to be displayed in brackets after the category name. Products numbers are cached to reduce load time. The cache can be manually regenerated from the configuration page or automatically regenerated using a cron job.
* Hide zero counts: Allows the number of products to be hidden when it is zero.
* Hide empty categories: Allows all categories that do not contain any products to be hidden, unless subcategories contain products.
* Hide parent categories: Allows all parents categories of the current category to be hidden.
* Hide sub-subcategories: Allows all sub-subcategories to be hidden. When used with the "hide parent categories" option, it allows just the subcategories of the current category to be displayed.
* Show breadcrumbs: Allow hidden parents to be displayed as breadcrumbs
* Show products: Allows products to be listed along with categories
* Highlight colour: Allows the colour of the current category to be changed.

Animation Settings

* Animation mode: Allows the categories to be animated the same way as the original module using +/- buttons, animated using accordions instead, or to have no animation at all.
* Slide animation: Allows the slide animation to be changed to None, Default, Ease, or Bounce.
* Mouse event: Allows the accordion to slide on mouse click or mouse hover.
* Collapsible: Allow the subcategories to be collapsed (PrestaShop v1.4 only).
* Dynamically load: Allows the subcategories to be dynamically loaded using AJAX to reduce load time.
* Save state: Allows the categories to remain open when navigating between pages.
* Open categories: Allows selected categories to be open by default on the homepage and other non-product pages.

Back Office Settings

* Dynamically load: Allows categories on the "1. Info." tab of the product editor to be dynamically loaded to reduce the load time when there are many categories.

Troubleshooting

* Repair tree: Due to a bug in PrestaShop, the levels depths of the category tree may become corrupted. This button will repair the category tree.

Compatible with PrestaShop v1.3.x and PrestaShop v1.4.x.

You can see a demo of this module and purchase it from my website here.

For a large-scale demo of this module with 1500 categories, see muffler.pl, who are using this module to allow customers to quickly filter their mufflers by car model.

Attached Files


Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#2
Star

    PrestaShop Addict

  • Members
  • PipPipPip
  • 618 posts
Do we have to upgrade our site to 1.2.5 in order to use this module?

#3
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
Yes, you may need to. I recreated this module from scratch using the Prestashop v1.2.5 categories block so that it would work correctly with the category group access. I'm not sure whether the queries will work when the customer groups tables are missing. You can try it and let me know if there are any errors. I might be able to modify some code to create a separate version that is compatible with v1.1.
Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#4
Ehinarr

    Sir

  • Members
  • PipPipPipPip
  • 1134 posts
A fair price for a great job. I will add it to my wish list!
My Blog
PS v1.4.7.0

#5
ysco

    PrestaShop Fanatic

  • Members
  • PipPipPipPip
  • 1015 posts
Hello Rocky,

The news module looks promising and have a lot off useful settings, i don`t mind to pay for a good module as long as the price is fair ;)
Would buy it but want to know if it works on 1.2.4 , i don`t want to upgrade yet to 1.2.5 or any other version till it is worth to update.
Maybe someone already tried it on 1.2.4 ?

Best regards,

ysco..

#6
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
Yes, it should work in v1.2.4. Prestashop v1.2.5 was a security update only and didn't update the category block or customer groups, so I don't see why it wouldn't work.
Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#7
ysco

    PrestaShop Fanatic

  • Members
  • PipPipPipPip
  • 1015 posts
Well then i think i just gonna buy it then ;)

Edit: well i just buyed it and will test it on my test server first and let you know the results.


Thanks mate.

Best regards,

ysco..

#8
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
Thank you. You're the first person to buy a module from my site. Let me if it downloads and the module works properly for you.
Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#9
ysco

    PrestaShop Fanatic

  • Members
  • PipPipPipPip
  • 1015 posts
Hello rocky,

Well the registration and download went well on your side and i had no problems.

Just installed the nice module and have had a look, looks great but i have a few questions.

The txt is now "centered" in the categories but i want it to start left cause all the block info on my website starts left.
Is it possible too add categories numbers in line at the right side instead straight behind the txt from categories ? ( would be looking cleaner )
Is it possible when you hover over the categories ( when you have mouse over enabled it opens the sub categories ) in FO that it automatically closes the categories block to first state when your mouse leaves the block ( now it stays open ) ?
Final question, can the color be changed when you hover over the txt lines you have a light Grey blok but i would change that to orange color for example so that you better see category where you mouse is on that line.

Also can the txt color be changed for the whole block ??

I have the module on my live site here : http://www.gadgetshoponline.nl
And i have my old categories module on my test site here: http://www.gadgetshop-online.nl

Please have a look what i mean with the final question on my test site ( the orange thing ) probably you better understand then what i mean ;)

Normally you have a css file so that you easily can make those changes but now you have no css.

But the module is great rocky you have done some great work again ( but the few changes would complete it for me )

Best regards,


ysco..

#10
ysco

    PrestaShop Fanatic

  • Members
  • PipPipPipPip
  • 1015 posts
Hello rocky

The problem with txt adding to start left instead of centered i solved.
Als txt color change also solved.
Hope you can point me in the right direction off my other questions.
But this is a great module rocky 

Best regards,

ysco..

#11
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
Hi ysco,

I've emailed you an updated module with product numbers lined up on the right. Unfortunately, I can't figure out how to get the categories to close when leaving the block. I tried changing the block's div to:

<div id="categories_block_left" class="block" onmouseout="alert('test');">


but this triggers even when moving from the block background to one of the anchors inside the block. I'll have to do further research before I can add this feature.
Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#12
ysco

    PrestaShop Fanatic

  • Members
  • PipPipPipPip
  • 1015 posts
Hello rocky,

Thanks for the update, and you probably figure out that the block closes ;)
Take your time buddy, would be nice if you can solve it.

I just added your new version but the numbers don`t appear on the right, instead off that i have arrow on the left side.
Look at the screen shot.

Also i discovered that not all numbers display the correct value, for example i have a category screen protectors and there is only 1 sort but it displays in the categories block (3) instead off (1) also a other category has 6 items and it displays 7 items.

Well also no worries mate take your time to figure it out ;)

ysco..

Attached Files



#13
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
I had a look at your code and this is a theme issue, not an issue with my module. You need to change the following part of your global.css, since it is overwriting the style of my module:


#categories_block_left span{
position:absolute;
top:13px;
left:15px;
overflow:hidden;
display:block;
float:left;
width:11px;
height:11px;
background:url(../img/arrow.gif) 5px 0 no-repeat;
cursor:pointer;
}
#categories_block_left span:hover{
background-position:5px -12px;}

Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#14
ysco

    PrestaShop Fanatic

  • Members
  • PipPipPipPip
  • 1015 posts
Hello rocky,

Well buddy that did the trick, it is all working perfectly now.
This way it gives a much cleaner look.
Very happy about this module and is worth every penny.
Also the support is great !! many others can learn from that.
Keep up the great work.


Thanks rocky.

Best regards,


ysco..

#15
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
Module updated so that inactive products are no longer included in the product numbers
Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#16
ysco

    PrestaShop Fanatic

  • Members
  • PipPipPipPip
  • 1015 posts
Hello Rocky,

Works perfect, also installed the module now on my live site and inactive products are not displayed anymore so that problem is solved.

Thanks again.

Best regards,

ysco..

#17
Star

    PrestaShop Addict

  • Members
  • PipPipPip
  • 618 posts
I am still using the free module on my site. I will install this new one this week.

It is a very fair price for a great module. Highly recommend if anyone thinking buying a categories module. It is right here.

#18
Star

    PrestaShop Addict

  • Members
  • PipPipPip
  • 618 posts
I finally got a chance installed the new version. It works very well in my test site. Thank you very much.

Is there a way I can just show the product count in the sub-category and sub-sub-category?

#19
rocky

    PrestaShop Superstar

  • US Moderators
  • 9988 posts
Are you using the AJAX mode? If you are, then it will be as simple as {* commenting out *} the following part of line 3 of category-tree-branch.tpl:


{if $showProductNum} ({$node.numProducts}){/if}


If you aren't using the AJAX mode, you will have to modify blockcategoriesnc.tpl and change lines 106-110 to:


{if $smarty.foreach.blockCategTree.last}
{include file=$branche_tpl_path node=$child i=$i dhtml=$isDhtml event=$eventbool hideEmptyCategories=$hideEmptyCategories showProductNum=$showProductNum depth=1 last='true'}
{else}
{include file=$branche_tpl_path node=$child i=$i dhtml=$isDhtml event=$eventbool hideEmptyCategories=$hideEmptyCategories showProductNum=$showProductNum depth=1}
{/if}


and change the first piece of code in category-tree-branch.tpl above to:


{if $showProductNum AND $depth > 1} ({$node.numProducts}){/if}


and lines 9-13 of category-tree-branch.tpl to:


{if $smarty.foreach.categoryTreeBranch.last}
{include file=$branche_tpl_path node=$child i=$i dhtml=$dhtml event=$event depth=$depth+1 last='true'}
{else}
{include file=$branche_tpl_path node=$child i=$i dhtml=$dhtml event=$event depth=$depth+1 last='false'}
{/if}

Check out Nethercott Constructions for PrestaShop guides and modules. Like us on Facebook for news updates.

#20
Star

    PrestaShop Addict

  • Members
  • PipPipPip
  • 618 posts
Thank you very much. Will try.