WPGraphQL Yoast SEO 插件使用教程

WPGraphQL Yoast SEO 插件使用教程

wp-graphql-yoast-seo This is an extension to the WPGraphQL plugin for Yoast SEO项目地址:https://gitcode.com/gh_mirrors/wp/wp-graphql-yoast-seo

项目介绍

WPGraphQL Yoast SEO 是一个扩展插件，用于增强 WPGraphQL 插件的功能，使其能够返回 Yoast SEO 数据。这个插件允许开发者在 headless 应用中使用 Yoast SEO 数据，提供了丰富的 SEO 信息，包括页面、文章、自定义文章类型、分类、WooCommerce 产品等的 SEO 数据。

项目快速启动

安装插件

1. 从 WordPress 插件目录安装：

   • 在 WordPress 后台，进入“插件” -> “安装插件”，搜索 wp-graphql-yoast-seo，然后点击“安装”并激活。

2. 通过 GitHub 安装：

   • 克隆或下载 GitHub 仓库 的 zip 文件，将其解压到 WordPress 的插件目录，然后激活插件。

激活插件

composer require ashhitch/wp-graphql-yoast-seo

查询示例

以下是一个查询示例，用于获取页面的 Yoast SEO 数据：

query GetPages {
  pages(first: 10) {
    edges {
      node {
        id
        title
        seo {
          canonical
          title
          metaDesc
          focuskw
          metaRobotsNoindex
          metaRobotsNofollow
          opengraphAuthor
          opengraphDescription
          opengraphTitle
        }
      }
    }
  }
}

应用案例和最佳实践

与 Gatsby 集成

使用 WPGraphQL Yoast SEO 插件时，可以结合 Gatsby 插件来轻松添加元数据和 JSON-LD 模式。以下是一个简单的 Gatsby 配置示例：

1. 安装 Gatsby 插件：

   npm install gatsby-source-wordpress
   

2. 配置 gatsby-config.js：

   module.exports = {
     plugins: [
       {
         resolve: `gatsby-source-wordpress`,
         options: {
           url: `http://your-wordpress-site.com/graphql`,
         },
       },
     ],
   };
   

3. 查询 Yoast SEO 数据：

   query {
     allWpPage {
       nodes {
         id
         title
         seo {
           canonical
           title
           metaDesc
         }
       }
     }
   }
   

最佳实践

• 确保 Yoast SEO 版本：插件需要至少 Yoast SEO 14.0.0 版本。
• 处理规范链接：如果启用了“阻止搜索引擎”选项，规范链接将不会返回。
• 使用媒体项类型：图像 URL 现在返回为 mediaItem 类型，适用于 twitterImage 和 opengraphImage。

典型生态项目

WPGraphQL

WPGraphQL 是一个 WordPress 插件，它为 WordPress 提供了一个 GraphQL API。WPGraphQL Yoast SEO 插件是基于 WPGraphQL 构建的，因此了解和使用 WPGraphQL 是必要的。

Yoast SEO

Yoast SEO 是一个广泛使用的 WordPress SEO 插件，提供了丰富的 SEO 功能。WPGraphQL Yoast SEO 插件能够将 Yoast SEO 的数据暴露给 GraphQL API，使得这些数据可以在 headless 应用中使用。

Gatsby

Gatsby 是一个基于 React 的静态站点生成器，可以与 WordPress 结合使用，创建高性能的 headless CMS 应用。通过 WPGraphQL Yoast SEO 插件，可以轻松地在 Gatsby 项目中使用 Yoast SEO 数据。

通过以上教程，您应该能够顺利安装和使用 WPGraphQL Yoast SEO 插件，并在您的 headless 应用中充分利用 Yoast SEO 数据。

wp-graphql-yoast-seo This is an extension to the WPGraphQL plugin for Yoast SEO项目地址:https://gitcode.com/gh_mirrors/wp/wp-graphql-yoast-seo