PrestaShop Forums: [MODULE] AJAX Sliding Accordion Categories - PrestaShop Forums

Jump to content


Welcome to the PrestaShop Forum! We hope you'll share your comments and suggestions with us. We ask that you please post in English to the main sections of the PrestaShop Forum. If you want to write in another language, please post in the corresponding PrestaShop Community section below.

Please note that PrestaShop Community sections are largely self-moderated. PrestaShop team members may or may not participate in non-English sections. To improve the chances of receiving feedback to your question or comment, please post it in English to the main sections of our Forum.

NYC

Vous parlez français ? par ici !


[MODULE] AJAX Sliding Accordion Categories


[MODULE] AJAX Sliding Accordion Categories

#1 rocky

    PrestaShop Superstar

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 18 November 2009 - 10:57 AM

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 File(s)


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

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#2 Star

    PrestaShop Addict

  • 01 Jan 2009
  • Members
  • PipPipPip
  • 618 posts
  • Location:California

Posted 20 November 2009 - 01:28 AM

Do we have to upgrade our site to 1.2.5 in order to use this module?

#3 rocky

    PrestaShop Superstar

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 20 November 2009 - 02:18 AM

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.

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#4 Ehinarr

    Sir

  • 01 Nov 2008
  • Members
  • PipPipPipPip
  • 1125 posts

Posted 20 November 2009 - 02:53 AM

A fair price for a great job. I will add it to my wish list!
My Blog
PS v1.4.6.1

#5 ysco

    PrestaShop Fanatic

  • 27 Jul 2009
  • Members
  • PipPipPipPip
  • 1003 posts
  • Location:Netherlands

Posted 20 November 2009 - 09:37 AM

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

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 20 November 2009 - 09:57 AM

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.

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#7 ysco

    PrestaShop Fanatic

  • 27 Jul 2009
  • Members
  • PipPipPipPip
  • 1003 posts
  • Location:Netherlands

Posted 20 November 2009 - 10:00 AM

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

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 20 November 2009 - 10:11 AM

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.

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#9 ysco

    PrestaShop Fanatic

  • 27 Jul 2009
  • Members
  • PipPipPipPip
  • 1003 posts
  • Location:Netherlands

Posted 20 November 2009 - 11:30 AM

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

  • 27 Jul 2009
  • Members
  • PipPipPipPip
  • 1003 posts
  • Location:Netherlands

Posted 20 November 2009 - 07:54 PM

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

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 21 November 2009 - 12:38 AM

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.

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#12 ysco

    PrestaShop Fanatic

  • 27 Jul 2009
  • Members
  • PipPipPipPip
  • 1003 posts
  • Location:Netherlands

Posted 21 November 2009 - 12:51 AM

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 File(s)



#13 rocky

    PrestaShop Superstar

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 21 November 2009 - 02:57 AM

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.

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#14 ysco

    PrestaShop Fanatic

  • 27 Jul 2009
  • Members
  • PipPipPipPip
  • 1003 posts
  • Location:Netherlands

Posted 21 November 2009 - 10:54 AM

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

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 22 November 2009 - 03:22 AM

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.

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#16 ysco

    PrestaShop Fanatic

  • 27 Jul 2009
  • Members
  • PipPipPipPip
  • 1003 posts
  • Location:Netherlands

Posted 22 November 2009 - 01:40 PM

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

  • 01 Jan 2009
  • Members
  • PipPipPip
  • 618 posts
  • Location:California

Posted 23 November 2009 - 11:47 PM

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

  • 01 Jan 2009
  • Members
  • PipPipPip
  • 618 posts
  • Location:California

Posted 01 December 2009 - 04:08 AM

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

  • 16 Oct 2008
  • US Moderators
  • 9981 posts
  • Location:Australia

Posted 01 December 2009 - 04:29 AM

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.

Guides Performance Guide | Installation Guide | Development Guide

Modules AJAX Sliding Categories | AJAX Dropdown Categories | Carousel | Image Gallery | Sliding Menu

All free and paid software, modules, themes and modifications are subject to the terms and conditions here.

#20 Star

    PrestaShop Addict

  • 01 Jan 2009
  • Members
  • PipPipPip
  • 618 posts
  • Location:California

Posted 01 December 2009 - 04:34 AM

Thank you very much. Will try.





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users