Add support for Custom Post Types
In order to use custom post types in our project we need to add support for our custom post type in frontity.settings.js
. We can do this by locating the object for @frontity/wp-source
in the packages
array and adding the postTypes
property to state.source
.
The postTypes
property takes an array of objects as it's value, with each object in the array defining a distinct post type. We're only defining one post type, namely destinations
, so we only add one object to the array.
The properties of this object are:
Learn more in the docs for @frontity/wp-source.
Frontity now knows about this CPT and will just work with it. Try it! Enter localhost:3000/destinations
into your browser's address bar and you should see a listing of our favourite travel destinations. Click on one and it displays using the <Post>
component.
**Note** that the 'show_in_rest' parameter needs to be set to true in the `register_post_type()` function to include the CPTs in the REST API.
And that's it - that's all we need to do to have our project use WordPress CPTs!
However, in the case of this CPT we don't want to display the author and date information so let's tell our <Root>
component to use the <Page>
component instead for this post type.
If we take a look at the data for one of the CPT URLs we can see that it has a boolean isDestinations
property that we can utilise for this purpose.
So let's extend our <Switch>
component to tell it to use the <Page>
component if this value is true
.
To finish off let's make this accessible from our menu.
Check you're on the right track by comparing your changes with the ones in this commit.
Last updated