Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub



The idea behind this theme is making a one-stop solution for a WordPress blog owner who wants to switch to Gatsby powered frontend. Simple to configure that works out of the box. For a common use scenario - standard WordPress installation, basic posts and pages content - only a source url is needed.

    resolve: '@webmaeistro/gatsby-theme-graphql-wp',
    options: {
        wordPressUrl: 'https://your.wordpress.site/',


This theme uses GraphQL API to source WordPress content. Therefore the source WordPress site must use the wpgraphql plugin.

How to install

yarn add @webmaeistro/gatsby-theme-graphql-wp
  resolve: '@webmaeistro/gatsby-theme-graphql-wp',
  options: {
    wordPressUrl: 'https://your.wordpress.site/',
    menuLocation: 'MENU_1',

Available options

wordPressUrl - source site.

uploadsUrl - (optional) WordPress uploads folder. Uses default if this option not set.

processPostTypes - (optional) post types to process. You can include custom post types as defined in wpgraphql however CPTs also need to have some code added to create pages on Gatsby site. And that is currently outside of this theme’s scope.

useWebp - (optional) if true uses WebP images. Default is false.

menuLocation - WordPress menu location slug. Sanitized.

A build would break if menuLocation was not cofigured right. The location slug comes from register_nav_menus function call in functions.php (example) of your WordPress theme.


siteMetadata: {
    title: 'Site title',
    author: 'Author name',
    description: 'Site description',
    social: [
            name: 'twitter',
            url: 'https://twitter.com/your_twitter',


  • Uses WordPress menu from a defined location. Only first level menu items are displayed. “Home” menu item is automatically added if there is no menu item linking to the site homepage.
  • Supports post categories.
  • Downloads images embedded in posts/pages/CPTs and hosted on the WordPress site. Converts <img> tags to Gatbsy <Img> component.
  • Downloads featured images (post thumbnails) and makes them available as Gatsby <Img> component.
  • Downloads all other files linked in posts/pages/CPTs and hosted on the WordPress site. Serves them from the Gatsby static folder.
  • Links embedded in posts that lead to other pages are converted to <Link> component.

This theme utilizes the gatsby-wpgraphql-inline-images plugin for most of the content processing.

Examples of usage

    resolve: '@webmaeistro/gatsby-theme-graphql-wp',
    options: {
        wordPressUrl: 'https://examplecom',

Shout Outs

Special thanks for inspiration and some borrowed code go to:


Demo site uses images by Unsplash and text content from Wikipedia.

© 2023 Gatsby, Inc.