Gatsby-source-wordpress-menus NPM

Gatsby source wordpress menus

Description

this is a gatsby source plugin to read wordpress menus via the REST API and make its contents available via GraphQL. It specifically supports WPML. If you are not using WPML then there are usually better ways to get at this data (e.g. via GraphQL or gatsby-source-wordpress).

Unfortunately support for additional query parameters or route modification are still not supported in gatsby.

Dependencies

You need the following wordpress plugin installed in your wordpress instance

https://wordpress.org/plugins/wp-rest-api-v2-menus/

How to install

yarn install gatsby-source-wordpress-menus

in your gatsby-config.js

module.exports = {
  siteMetadata: {
    ...
  },
  plugins: [
    ...
    {
      resolve: "gatsby-source-wordpress-menus",
      options: {
        wordpressUrl: "https://your-wordpress-site.com",
        languages: ["de", "en"],
        enableWpml: true,
        allowCache: true,
        maxCacheDurationSeconds: 60 * 60 * 24
      },
    },
    ...

Examples of usage

You can now query your menu data via

query MyQuery {
  wordpressMenuLocation(slug: { eq: "location-slug" }, language: { eq: "en" }) {
    slug
    language
    menu {
      filter
      name
      slug
      taxonomy
    }
    menuData {
      items {
        menu_order
        slug
        title
        url
        child_items {
          title
          url
          type
        }
      }
    }
  }
  allWordpressMenuLocation {
    nodes {
      id
      slug
      language
      menu {
        slug
        taxonomy
        errors {
          invalid_term
        }
      }
    }
  }
}