What Is “Headless” WordPress?

There are several advantages to this approach. For one, it allows content creators to use a familiar tool. They can use WordPress as always, without making major changes to their workflow.
It’s also incredibly flexible. For instance, maybe you have multiple mobile apps that need the same content. Or perhaps you have a mixed bag of places to use it (a mobile app and a static website, etc.). A headless configuration allows you to feed content to any number of targets.

UNLIMITED DOWNLOADS: 500,000+ WordPress & Design Assets

Code displayed on computer screens.
Beyond the method for querying data from your WordPress installation, there are some other items to think about. That includes a few potential drawbacks.

  • Mobile apps;
  • Progressive web applications using JavaScript libraries such as React;
  • Static websites;

Among the niceties of the REST API is the fact that it respects any authentication restrictions. That means, for example, that any content you mark as not public (like a post draft) isn’t available via the API without authentication.
The functionality of any WordPress plugins you’ve installed won’t carry over to another application. This probably isn’t a big deal for a mobile app, as whatever you need it to do will be built within those confines. But it is something to consider for other use cases.
Regardless of the method you use, you’ll have the ability to push WordPress-generated content to just about any type of application.
Static websites or progressive web apps will need system-specific plugins or, potentially, functionality that’s written from scratch. You lose the ability to just add a WordPress plugin anytime you need features like a form or a shopping cart.
On the more practical side, utilizing this setup for a mobile app or a static website makes sense on a lot of levels. Content creators can simply do their own thing without the risk of potentially messing up the front end. And you still get all of the convenience of using a CMS.

Getting Data (The 60-Second Version)

There are plenty of reasons why WordPress is the most popular CMS on the planet. Chief among them are its general ease-of-use and flexibility. Both of these attributes are keys to the rise of the “headless” WordPress trend. That is, using a WordPress back end to feed content to an outside, non-WordPress application.
Making WordPress data available to other applications can be accomplished through use of the REST API. Think of it as the bridge between WordPress and other languages and libraries, like Java, Node.js, Swift and more. The API offers up queried data as a JSON response. This allows you to grab, among other things, the pages and posts that you create within the CMS.
While going headless isn’t necessarily right for every situation, it’s certainly presents a valid option. And, as its use becomes more widespread, the tools for making it work will only become that much more sophisticated.
In short, the build and upkeep processes for the front end can be much more involved for developers than a standard WordPress website.
Super-fast performance is one of the biggest reasons to go headless. This helps in everything from SEO to conversions. But you still need to ensure that your WordPress install is optimized for speed.
There are alternatives, of course. WPGraphQL is a free plugin that can perform similar functionality, only it uses the GraphQL open source query language. Depending on your particular needs, it could be a good fit for your project. For example, it’s built to work in tandem with the Gatsby static site generator. Going that route would make WPGraphQL the natural choice.

Considerations and Potential Drawbacks

If you intend to publish a lot of content and/or have API calls from multiple sources, things can slow down. Specific tweaks may be required to keep the back end running smoothly.

Building and Maintenance

Denis Žoljom shares his experiences in building a headless project and offers some helpful code snippets. There’s also a section dedicated to improving REST API performance.
Plus, there are potential performance and security benefits. A static website doesn’t have a database – or a back end that can be hacked. Therefore, it’s going to load a lot faster and will be less likely to fall prey to brute force attacks.
So, how do you get your content from WordPress to another application? It’s actually built right in.

Functionality

Decoupling WordPress from the front end is increasing in popularity as more developers experiment with its potential. As such, a number of great articles have been published on the subject. Below is a selection of helpful tips, tutorials and useful background information.
In the right circumstances, the use of a headless WordPress configuration can be just the thing your project needs to stand out. The ability to create something like a progressive web app embraces the cutting edge of technology and allows more creative freedom than your average theme-based website.

Performance

Sign up for Envato Elements and get unlimited downloads starting at only .50 per month!

DOWNLOAD NOW

From WordPress to Anywhere

And, because a headless install separates content from design, redesigns can be much simpler. Developers won’t have to set up another instance of WordPress while the new design is being created. Thus, no worries about shuffling content from the production version of the site to development.
While that may sound a bit confusing – not to worry! Today, we’ll introduce you to the headless concept and the types of things you can do with it.

Resources

The main difference? You aren’t depending on WordPress to display the public-facing front end of your website. Instead, the content you create is meant to be used somewhere else. In essence, this could be just about anywhere. But among the most popular uses are:

Headless WordPress: The Ups And Downs Of Creating A Decoupled WordPress

Since you’re not using a traditional WordPress theme as your front end, maintenance becomes a bit different.

Using WordPress as a Headless CMS

A nicely illustrated explanation of what a headless CMS is, plus a number of resources to help you learn more.

Decoupled CMS

A behind-the-scenes look from Resi Respati at how one company rebuilt their blog using headless WordPress.

Headless WordPress: How To Use Their Blog Data In Your App

Headless WordPress Diagram

Headless WordPress + Next.js — What We Learned

Person holding a smartphone.

Unleashing Creativity, Maintaining Practicality

A simple guide by Sufyan bin Uzayr offering the basics of why and how you might use a headless CMS.
Fernando Doglio looks at the advantages and disadvantages of headless WordPress. There’s also an example project to help get you started.
Static websites, for example, require a separate system (such as the aforementioned Gatsby) to covert WordPress content into static pages. If you’re building a single-page JavaScript application, then you have a whole other codebase to maintain.
Even if you’re not ready to dive in just yet, it is an important niche to keep an eye on.

Posted by WordPress Guru