Skip to main content

Frontity Talks: Custom Post Types

Headless WordPress (sometimes called decoupled WordPress) is rapidly gaining traction among web developers. Using WordPress Custom Post Types and Custom Taxonomies in a JavaScript or React based frontend is a problem that most web developers will face at some point.

Luckily for them we have just published the latest episode in our series of videos entitled Frontity Talks.

In this episode JuanMa and Michael talk about Custom Post Types – how to set them up in WordPress, how to configure Frontity to use them, and how to work with them in your theme. In short, this comprehensive guide tells you everything you need to know to work with Custom Post Types with headless WordPress in your Frontity project using React.

Frontity is a React based frontend framework that makes building headless WordPress sites super easy.

Jump straight to the part of the video that interests you:

00:08 Welcome and Introduction
01:51 Setting up CPTs in WordPress
03:44 Our custom Vintage Vinyl plugin
08:26 The ACF fields
10:33 Showing the CPT content in the JSON
11:56 The ACF to REST API plugin
13:53 Summary of the WordPress configuration
16:12 The Frontity project
18:18 Defining the CPT in Frontity settings
22:24 The Frontity Theme
28:26 Choosing the component
32:24 Showing the CPT archive
36:41 Displaying individual posts
38:04 Using the data type to style the component
39:28 Displaying the “rendered” version of the content
42:16 Review and wrapping up

We hope you enjoy this episode of Frontity Talks and that you find it useful.

If you want to see any particular Frontity related topic covered then please suggest it in the video comments or use the hashtag #AskFrontity on Twitter. We’d love to cover anything you want to know.

If you want to watch any of the earlier episodes of Frontity Talks, you can find them all in this Youtube playlist.

Don’t forget to subscribe to our channel and tap the notification bell 🔔 to get notified when new videos are out!

💭 Comments? Suggestions? Join the conversation here or hit us up on Twitter!