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 ( displays/sorts/filters weblinks/articles/K2 using categories, tags and fields. It respects Content-Security-Policy.

Version 1.17.0 : add field name in field value filtering
Version 1.16.7 : suppress PHP 8 notice
Version 1.16.6 : PHP 8 strpos error
Version 1.16.5 : PHP 8 compatibility
Version 1.16.4 : "save" button error
Version 1.16.3 : publish/unpublish error
Version 1.16.2 : K2_categories error if K2 not installed
Version 1.16.1 : show unpublished item, if user is authorized
Version 1.16.0 : JS customiaation + plugin CGIsotope
Version 1.15.5 : Reordering component 's parameters (ctrl F5)
Version 1.15.4 : fix Custom Fields language filtering
Version 1.15.3 : Display Custom Fields groups in column
Version 1.15.2 : Multi-select on Custom Fields
Version 1.15.0 : Filtering on calendar custom field
Version 1.14.0 : cat-tags-fields refactoring
Version 1.13.0 : multi-select list
Version 1.12.0 : "featured items first" button
Version 1.11.1 : copy button
Version 1.11.0 : export/import buttons
Version 1.10.0 : php 8.0 compatibility
Version 1.9.0 : fields links
Version 1.8.0 : fields and tags filter, dates/id parameter, dates format
Version 1.7.0 : refactoring init.js
Version 1.6.1 : language filter : multi-select + all button
Version 1.6.0 : add language filter + css .isotope-main {overflow: hidden}
Version 1.5.0 : random display, suppress ..., parameters display fix
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

(downloaded 1171 times)

(downloaded 124 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 Simple Isotope Component like any other Joomla! component. 

To respect Content Security Policy (CSP), there is no inline CSS/JS anymore. To do so, we had to use Joomla! addScriptOptions which is only available after Joomla! version 3.7.x.

This component takes all Simple Isotope functionnalities.

Version 1.0.5 introduces Import capability 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.

To offer more customizations, you may add javascript code in version 1.16.0. This version introduces 3 events onCGIsotopeBefore, onCGIsotopeFilter, onCGIsotopeRender used in CG Isotope Iso plugin.

- 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.

Note : to fix category/tags/fields issues, categories filtering has been refactored in version 1.14.0. This may introduce problems. Just check your parameters.

As suggested by David, version 1.13.0 introduces Multi-Select Lists.

With version 1.12.0, you may force featured items to be displayed first when sorting per date/title/...

Version 1.11.0 introduces export/import buttons, so I can save/restore your CG Isotope pages in JSON files and version 1.11.1 adds copy button.

From Simon's idea, version 1.9.10 introduces alphabetical index filtering. You may see this on Joomla! extensions page.

Version 1.9.0 introduces 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.

With Version 1.7.1, 2 new features have been implemented : use Field/tag/category notes to display filter button's tooltips (Loïc's suggestion) and add exclusive list for fields display (as suggested by Martin). Check our demo page.

Version 1.5.0 introduces random sort display as suggested by André and hide continuation characters (...) when articles are longer than choosen maximum article size (Marc's request).

From Justus's idea, version 1.3.0 introduces range slider on custom fields. During tests, we found a bug in content's plugin. You may see the result at Justus website :

Note : Range Slider is a pure JS project from Slawomir Zaziablo.

From Loic's (alias Lomart) idea, version 1.0.7 introduces 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.

Version 1.1.0 introduces Ajax et Iframe choice in Readmore parameter. This will display your article on the current page. The choice between Ajax and Iframe depends on your article. If it contains some plugins, Ajax is recommanded. If it contains some template custom CSS codes, Iframe should be used.

Version 1.1.3 introduces a session cookie that stores your latest request. So, when Isotope Component is displayed again, it will be shown using your latest request as long as you keep your internet explorer opened (session cookie).

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