CARD FILTER EXTENSION (FREE) - updated 3/7/24

[crispy68]

Description:
Based off a recent post on the forum (and being a bit bored) and a Pablo created template (where it was used), I created an extension you can use to create a simple filter for cards. Ideal for those who don't want to mess with adding any jQuery code. There are some manual steps you will need to do in creating the sort buttons, but this saves you the hassle of messing with code.

Features:
- Fade transition effect
- Sample project file included

Download Package:
Includes extension, a .pdf help file and sample WB project file.

PLEASE NOTE!!:
If you already own this extension, please visit the My Orders page and login to get the update. Please do NOT reorder it thru the store.

Info & Demo:
Web Builder Templates

--------------------------------------------------

If you like any of my extensions, I would appreciate your support!

See some of my Menu Extensions:
Go here!

Need an interesting Slider or Slideshow Extension, check these out!
Go Here!

[crispy68]

Minor Update

1. Made the fade transition between All button and filter buttons smoother.

Please view the updated demo.

!! IMPORTANT !!
If you already own any previous versions of the extension, please visit the My Orders page and login to get the update rather than re-purchasing it thru the store.

[wwonderfull]

@crispy68 thanks for making an extension out of the suggestion I had posted although @pablo did resolve much with his features.

Any solution for the cramped cards? I mean does it need to be adjusted on breakpoints from the pages of wwb or can it be done directly from the extension?

[crispy68]

The cards are controlled by the card container or grid being used. This gives you normal control over them. I did not add any breakpoints to my demo. The extension only helps create the filtering effect and to help those who don't understand code. I did add a smoother fading effect.

[wwonderfull]

No problem it can be adjusted I think. But thanks for the extension. As it is purely JavaScript based as you mentioned it cuts the need of jQuery which is the future proof solution. That is also the reason I had suggested it but people thought why am I asking a feature which already exist but uses jQuery.

Other than that appreciate your effort for bringing this extension Brilliant effort.

[crispy68]

There was no need to add manipulation of the cards within the extension when a card container can already do that. Much more flexibility this way. Actually, it does use jQuery versus vanilla javascript. If I get time maybe I'll look into converting it but it may require more code. Plus, I'm a hack when it comes to javascript.

[VictorKrs]

Minor Update

1. Made the fade transition between All button and filter buttons smoother.

Please view the updated demo.

!! IMPORTANT !!
If you already own any previous versions of the extension, please visit the My Orders page and login to get the update rather than re-purchasing it thru the store.

Crispy68!

Thank you for your work, for this and for all the other extensions that you have developed! And of course, for the excellent support of users (including me).
I think all WWB users will be glad to see your new developments! We are waiting!

With great respect, Victor!

[zinc]

Love it Ron!!!!

Soon I will be firing up WWB for my Books (As you know) as the project is coming to completion and need a website - So this little GEM comes very handy! THANK YOU!!!!!

[crispy68]

New in version 1.0.1:

1. Added additional transition effect - slide
2. Minor code tweaks

See demo for updated demo.

!! IMPORTANT !!
If you already own any previous versions of the extension, please visit the My Orders page and login to get the update rather than re-purchasing it thru the store.

[VictorKrs]

New in version 1.0.1:

1. Added additional transition effect - slide
2. Minor code tweaks

See demo for updated demo.

!! IMPORTANT !!
If you already own any previous versions of the extension, please visit the My Orders page and login to get the update rather than re-purchasing it thru the store.

Hello, Crispy68!

Super! Everything works fine.

Thank you very much!

[mixextra]

Crispy68,

you can also add to the manual an option that I use in one of my projects and can be useful for WWB users.

It is a multiple filter, i.e. when display in several filters can be added to one card.

An example of expanding the filter and colors:
https://mixextra.sk/Test2/wbwd-card-filter.html

[crispy68]

Yes, I could look at adding that to the help.file. Would you mind sharing that project with me?

[mixextra]

Yes, I could look at adding that to the help.file. Would you mind sharing that project with me?

Enjoy here is the wbs to download:
https://1drv.ms/u/s!AvUMMey_-ptLjG9FoZp ... d?e=Na53df

[crispy68]

@mixextra,

Thanks! I have updated my demo to reflect a multi-category filter and will be adding it to the demo project included.

[crispy68]

New in version 1.1.0:

1. Filter categories are entered into the extension
2. Eliminated need to enter a filter 'name' for each card

This update eliminates issue where adding a class to card overrides some CSS generated by the card. See demo for updated demo. Please make sure to read the help file.

!! IMPORTANT !!
If you already own any previous versions of the extension, please visit the My Orders page and login to get the update rather than re-purchasing it thru the store.

[onlye]

Thanks Crispy. Very nice extension.

[mixextra]

New in version 1.1.0:

1. Filter categories are entered into the extension
2. Eliminated need to enter a filter 'name' for each card

See demo for updated demo. Please make sure to read the help file.

!! IMPORTANT !!
If you already own any previous versions of the extension, please visit the My Orders page and login to get the update rather than re-purchasing it thru the store.

Please check the download version, still 1.0.1. ?

[VictorKrs]

New in version 1.1.0:

1. Filter categories are entered into the extension
2. Eliminated need to enter a filter 'name' for each card

See demo for updated demo. Please make sure to read the help file.

!! IMPORTANT !!
If you already own any previous versions of the extension, please visit the My Orders page and login to get the update rather than re-purchasing it thru the store.

Please check the download version, still 1.0.1. ?

I agree! On the website version 1.0.1.

[crispy68]

Sorry guys, it's been fixed now. Thanks!

[mixextra]

Thanks, category management in one place is another useful improvement.