Creating Filterable "Portfolios" of Posts and Custom Post Types
Display your posts (and custom post types) in a filterable portfolio.
The Divi Theme's filterable portfolio module makes it easy to display your projects, and allow your users to filter them by category. However, this requires you to use the "projects" custom post type defined by Divi. But what if you want to display some other post type? This post explains how.
Over the past few days I've received several variants on this question. Some people want to know how to display regular blog posts in the same style as a filterable portfolio, with the posts able to be sorted by category. Others want to know how to display some other custom post type.
Fortunately the answer is the same in each case.
The Portfolio Posts Pro plugin from Divi Plugins is designed for exactly this.
It adds three modules to Divi Builder, each of which extends the standard portfolio with the ability to handle posts and custom post types. These modules are:
- DP Blog Portfolio – Like the built-in portfolio module, but with support for posts and custom post types
- DP Filterable Blog – Like the filterable portfolio module, it adds support for posts and custom posts. It also includes a category filter
- DP Fullwidth Blog – Like the built-in fullwidth portfolio module, but again with support for the other post types
Once installed, you can use these modules as you would any other Divi Builder module.
Step 1: Select the module from the module list
To use the modules, simply add a module via Divi Builder as you normally would. For example, above you can see the two modules added to standard sections (the other is added to fullwidth sections). Click on the module you want to add. In this example, I'm going to use the DP Filterable Blog so that the posts / custom post types displayed have a category filter above them.
Step 2: Configure the module's settings
The module settings should for the most part look familiar, if you've used the portfolio modules before. The main addition is the "Post Types" option, which lets you choose which post types will be included in the portfolio. The possible values include "post" for regular blog posts, "project" for the Divi-defined projects post type (i.e. the normal default for portfolio modules), as well as any other custom post types defined on your site (by plugins, etc). Here, for example, I have the "Product" custom post type. You can choose any combination of post types.
Also useful is the regular "Include Categories" option, which allows you to include only certain categories, and dictates the categories added in the portfolio's filter.
When you're happy with your choices, save the settings.
Step 3: View your portfolio
That's all there is to it. You can now go ahead and view your portfolio. I should look something like the above.