- create a field group with location set to a "Series" taxonomy of a "Lessons" CPT.
- add a Checkbox-type "Genres" custom field in the field group having a few value : label choices.
- edit a static Page with Oxygen and add the code to
- loop through the custom field's choices and output them as filter buttons
- loop through the taxonomy terms and for each term output term image, term name, term description all wrapped inside an anchor tag that links to the term archive page
- add space-separated custom field values to each item as classes
- load and initialize Isotope.
To follow along with the rest of this tutorial create
CPT with an associated
taxonomy using a plugin like CPT UI.
Create an Advanced Custom Fields field group having a Checkbox-type of field.
I entered the choices like so:
blues : Blues country : Country guitar : Guitar jazz : Jazz metal : Metal rock-and-soul : Rock & Soul
Set the Return value to Both (Array) since we need both the labels and values to work with.
Install and activate WP Term Images plugin. This is for attaching an image to each of our taxonomy terms. You may alternately use ACF for this. In this tutorial we shall use WP Term Images.
Edit your terms and enter description, set an image and tick the corresponding genres.
Create a Page called say, "Series" and edit it with Oxygen.
Add a Section.
Text Color: #eeeeee
Background Color: #262525
Section Container Width: full-width
Add a Code Block.
Set its width to 100%.
PHP & HTML:
This is a premium members-only content.
To view the rest of the content, please sign up for membership ($47/month or $499 one-time).
Already a member? Log in below or here.