Headless WordPress is a website or omnichannel app that uses WordPress content (including content production workflows), delivered by the REST API or GraphQL to frontends developed outside WordPress (e.g., NextJS, NuxtJS, React, Vue). Before you start building a frontend site that connects to your WordPress backend for content, you need to configure WordPress with some recommended plugins.
Installing Plugins
WPGraphQL
WPGraphQL is a plugin for WordPress that extends the WordPress API to support GraphQL requests. This plugin is highly recommended, as it makes it much easier to work with WordPress content. In most cases, you can use the default configuration for WPGraphQL, so just installing the plugin is enough to get you started.
Advanced Custom Fields
Advanced Custom Fields (ACF) lets you take full control of your WordPress edit screens and custom field data. It supports a ton of different field types that you can attach to content types in WordPress. Assuming you are using WPGraphQL, you should also install the companion WPGraphQL For Advanced Custom Fields plugin. This companion plugin will let you extend the WPGraphQL API with ACF information. There is no configuration necessary before you can start working with ACF.
Custom Post Type UI
Custom Post Type UI (CPTUI) provides an intuitive interface for managing custom post types and taxonomies in WordPress. If you have ever used a more bare-bones CMS like Strapi, you will be familiar with custom post types.
WPEngine Headless
WPEngine Headless provides a set of tools to make building frontend applications with WordPress as the headless CMS a pleasant experience for developers and publishers. The plugin helps with post previewing, smart content redirects, themes, custom menus, etc. WPEngine Headless requires some customization when you first install it. You can find the settings for the plugin in “Settings → Headless.”
- You will want to configure your “Frontend site URL” to be your frontend website’s root URL. For example, if you are running a Node site on your local machine on port 3000, your “Front-end site URL” should be “http://localhost:3000”.
- We recommended that you enable the following “Features”:
- Disable WordPress theme admin pages
- Enable Post and Category URL rewrites
- Enable public route redirects
After you install the plugins listed above, your WordPress site will be ready for headless development. There are certainly more plugins you can use; these are the plugins we recommend based on what we commonly use to build headless WordPress sites!
