Isotope Posts is a simple WordPress implementation of Metafizzy's javascript Isotope plugin. Use the plugin settings page to customize Isotope options and create loops of WordPress posts, then implement them on your site using simple shortcodes. Magic.
Some features:
New in v2
If you're upgrading to v2+ of Isotope Posts from v1.X, you'll need to run the Isotope Posts v2 Migrator plugin first. Be sure to deactivate and delete the migrator plugin before attempting to re-activate of Isotope Posts.
Metafizzy's javascript Isotope plugin is licensed under MIT and free to use for non-commercial, personal, open-source projects only. Find out more about commercial licensing if you plan on using this plugin for commercial purposes.
isotope-posts-master.zip
and remove -master
from the extracted directory nameisotope-posts
folder and its contents to the /wp-content/plugins/
directoryTo implement Isotope Posts on your site, simply head over to the Isotope Posts settings page in your WordPress admin area, create a loop of posts with your preferred options and then save it. Next, grab the unique shortcode for the loop you just saved (e.g. [isotope-posts id="YOUR_UNIQUE_ID"]
) and embed it in a page in your site.
You can use do_shortcode
to directly embed an Isotope Posts loop in a template file (instead of pasting it into the WYSIWYG editor for a given page on your site).
However, in order to ensure that the Isotope Posts plugin has the smallest possible footprint on your site, the plugin only loads the required Isotope CSS file on pages where it finds an Isotope Posts shortcode inside the_content
(i.e. embedded in the WYSIWYG editor).
In order to manually add the required CSS when you use do_shortcode
within your theme files, set an additional attribute on your shortcode as follows:
[isotope-posts id="YOUR_UNIQUE_ID" load_css="true"]
NOTE: You do NOT need to add the load_css
attribute to your shortcode if you are simply pasting it into a page's WYSIWYG editor.
Isotope Posts takes advantage of a number of the original javascript plugins's options. On the plugin settings page you have the option to:
Absolutely. To use a custom post type, simply pick it from the select menu on the plugin settings page. Same goes for using a custom taxonomy for a filter menu.
As the author of the javascript Isotope plugin has pointed out in the past, using infinite scrolling with filtering can create a very odd user experience and you probably want to avoid doing this.
In my experience, the only time that using filters with infinite scrolling isn't completely weird is when you have a lot of posts in your selected post type AND the terms for the taxonomy you use to create your filter menu are more or less evenly spread across your posts. If you must go down this road, please be sure to test this thoroughly before you unleash it on your users.
Play it safe. While you can implement multiple Isotope Posts shortcodes throughout your site, you'll only want to add one at a time on any given page. Things go a little bit sideways in the javascript when you try to load two Isotope Posts shortcodes on a single page.
Yes, but no translations are available quite yet.
before_isotope_title
, before_isotope_content
, and after_isotope_content
action hooks to allow customization of Isotope item content.do_shortcode
This plugin was originally created by Mandi Wise.
Copyright (c) 2014, Mandi Wise
Isotope Posts is dual licensed under MIT and the GPL v2 or later.
This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License, version 2, as published by the Free Software Foundation.
This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with this program; if not, write to the Free Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA