CG Isotope Component

1 1 1 1 1 Rating 5.00 (10 Votes)

User Rating: 5 / 5

Compat icon 3 x longfirst look joomla 4This component, based on isotope library (https://isotope.metafizzy.co/) displays/sorts/filters weblinks/articles using categories, tags and fields. It respects Content-Security-Policy.

Version 3.0.22 (Update : 30/11/2022)

  • # Error onval undefined in init.js
Version 3.0.21 (Update : 30/11/2022)
  • # Remove JQuery : AJAX Call
  • - Remove K2
Version 3.0.20 (Update : 07/11/2022)
  • # check article access is boolean
Version 3.0.19 (Update : 06/11/2022)
  • # incorrect Cookie update
Version 3.0.18 (Update : 06/11/2022)
  • # check article access
Version 3.0.17 (Update : 31/10/2022)
  • # update isotope.css
  • + Get component version in database
Version 3.0.0 (Update : 02/09/2022)
  • + offcanvas filter buttons
  • ^ use bootstrap 5
Version 2.0.0 (Update : 21/06/2021)
  • + Joomla 4.0 RC2 compatibility
....
Version 1.17.0 : add field name in field value filtering
...
Version 1.9.0 : fields links
...
Version 1.4.0 : Fields + categories filter
...
Version 1.3.0 : range slider + content's plugins
...
version 1.2.0 : AJAX : load extra JS/CSS files
...
Version 1.1.0 (June 2019) : K2 rewriting, Ajax/Iframe choice in Readmore parameter
...
Version 1.0.1 (Octobre 2018) : first version

Download CG Isotope Component J3 Download CG Isotope Component J4

Download not allowed

(downloaded 1223 times)

Download not allowed

(downloaded 193 times)

 

PHP 74PHP 80

Tim Davis talked about CG Isotope and I helped him show some of its features. It's a bit long but it's worth it.

Just install this CG Isotope Component like any other Joomla! component. 

This component takes all Simple Isotope functionalities.

You may Import parameters from Simple Isotope modules to CG Isotope.

Menu Joomla! Modules/Plugins is an example of how to use this component. You may find another example in my tests pages.

With your help, Isotope component is being improved, new features are implemented.

Filters may be displayed as a offcanvas list, they are called by a single button, you may see this behaviour on  My modules Joomla.

It may be activated in "Layouts" tab where you decide which sections are to be in offcanvas list.

Important: all offcanvas sections have to be in consecutive order (same ligne, consecutive order).

In Joomla 4,infinite scroll pagination, displays articles with no pagination.

An example of 'infinite scroll pagination' may be seen on the following page : cg-isotope-infinite

To offer more customizations, you may add javascript code.

CG Isotope Iso plugin : 3 events

  • onCGIsotopeBefore,
  • onCGIsotopeFilter,
  • onCGIsotopeRender.
Download not allowed

- onCGIsotopeBefore : add php code before displaying CG Isotope component page
- onCGIsotopeFilter : add articles filtering
- onCGIsotopeRender : customize article display, for example, add your own shortcodes.

Note : CG Isotope Iso plugin is given as an example and may be updated according to your wishes.

  • Multi-Select Lists
  • Force featured items to be displayed first when sorting per date/title/...
  • Export/import CG Isotope parameters in JSON files
  • Copy CG Isotope parameters in a new page
  • Alphabetical index filtering
  • Field links, this help you to filter buttons. For example, you may see one city's streets from one region's country. Check our demo page.
  • Field/tag/category notes to display filter button's tooltips
  • Exclusive list for fields display (as suggested by Martin). Check our demo page.
  • Range slider on custom fields.You may see the result at Justus website : agrarservice-ellermann.de
  • 2 new tags : {new} and {subtitle}. To use {subtile} tag, just insert ~ (tilde) in your article's title : this will split it in 2 parts that you may display using {title} and {subtitle} tags. {new} tag just displays a "new" badge.
  • Readmore : Ajax et Iframe choice 
  • Session cookie that stores your latest request.

cg isotope gb

You access to already defined pages.

cg isotope gb pages

We have 4 tabs to define one Isotope page:

Général parameters page.

cg isotope gb general

Articles parameters.

 cg isotope iso

Display Customization.

cg isotope perso

Component's layout.

cg isotope layouts

cg isotope gb menu