Quick Start

WPGraphQL is a WordPress plugin that allows developers to interact with WordPress data using GraphQL..

This quick start guide is intended for developers that want to use GraphQL with WordPress. This guide will be most useful for developers already familiar with WordPress. If you’re brand new to WordPress, you should check out the Intro to WordPress guide.

Install

WPGraphQL is a WordPress plugin, so in order to use WPGraphQL with WordPress, it must first be installed and activated.

There are a few methods to install plugins to WordPress.

Install from your WordPress Dashboard

1. Log in to your WordPress install
2. From the Administration Panels, click on the Plugin Menu
3. Under Plugins, click the “Add New” sub menu
4. Search for “WPGraphQL”
5. Click the “Install Now” button on the WPGraphQL plugin (should be the first one)
6. After installation, you will find a new menu item “GraphQL” and in the top Admin Bar will be a “GraphiQL IDE” menu item.

Other Install Methods

If you prefer not to install WPGraphQL from the WordPress.org repository, you can also install from GitHub or Composer.

Install from Composer

Installing plugins with Composer, a PHP dependency manager, allows you to avoid committing plugin code into your project’s version control.

WPGraphQL is available for installing with Composer from packagist.org and wpackagist.org.

The most straight forward way to install WPGraphQL with composer would be to run the following command:

composer require wp-graphql/wp-graphql

This would add WPGraphQL as a dependency for your project.

The fine folks of roots.io have written more information on Using Composer with WordPress.

Install from Github

1. Visit WPGraphQL on Github at https://github.com/wp-graphql/wp-graphql
2. Click the green “Code” button at the top right
3. Click “Download Zip”
4. Login to your WordPress install
5. From the Administration Panels, click on the Plugin Menu
6. Under Plugins, click the “Add New” sub menu
7. At the top of the page click “Upload Plugin”
8. Click “Choose File” and select the Zip of WPGraphQL that was downloaded from Github
9. Click “Install Now”
10. Click “Activate”

Use GraphiQL and Write your first GraphQL Query

Once WPGraphQL is installed and activated, it’s time to write your first GraphQL Query.

WPGraphQL includes a helpful tool called GraphiQL IDE, a tool that allows you to explore your GraphQL Schema end execute GraphQL Queries and Mutations.

Open GraphiQL

Open the GraphiQL IDE by clicking the “GraphiQL IDE” button in your WordPress Admin Bar.

This will take you to the GraphiQL IDE page.

Search the Schema

Click the “Docs” button at the top right of the GraphiQL IDE.

This will expand a “Documentation Explorer” that can be used to see what Types and Fields are available in the WPGraphQL Schema.

Let’s search the Schema for something WordPress is known for: “Posts”

Write Your First WPGraphQL Query

In the left pane, select the grayed out text and delete it.

Then paste in the following:

query {
  posts {
    nodes {
      id
      title
    }
  }
}

Then click the “Play” button to execute the query.

Your Query will be sent to your site’s WPGraphQL API endpoint and will return results that match the data that you asked for.

Next Steps

Now that you have WPGraphQL installed and activated and have written your first query, consider some of the following guides to get more familiar with using GraphQL with WordPress:

• Intro to GraphQL
• Into to WordPress
• Build your first WPGraphQL Extension