多码网
返回 前端
前端

Awesome wordpress gatsby

关于 WordPress 作为无头 CMS 和 Gatsby 作为静态站点生成器 (SSG) 的精选资源列表.

GitHub 仓库更多 前端 项目

Awesome wordpress gatsby






WordPress Gatsby

关于 WordPress 作为无头 CMS 和 Gatsby 作为静态站点生成器 (SSG) 的精选资源列表.


无头 CMS 是仅后端内容管理系统 (CMS). 它的目的是提供内容并使其可通过 API（例如 REST 或 GraphQL）访问.

静态站点生成器 (SSG) 是一个框架或设置，可帮助您生成静态网站 (HTML/CSS/JS). 您的数据源可以是本地文件（例如文本文件或降价文件）到 API（例如 REST、GraphQL）的任何内容.


为什么选择 Gatsby 和 WordPress？

WordPress 是世界上使用最广泛的 CMS 之一，因此许多人已经知道如何使用它. 使用基于 PHP 的模板的典型前端方法在性能至关重要的环境中变得越来越有问题. 将 WordPress 用作通过 JavaScript 进行普通 API 调用的无头 CMS 的方法已经存在，但也有必须向服务器发出请求并根据响应进行呈现的缺点. 这会增加加载时间. Gatsby 相反，在编译时预呈现整个站点，因此用户在他们的第一个请求中得到一个完全准备好的静态站点，使其成为最佳性能方法之一. 另一个巨大的好处是安全，因为您的 WordPress 实例可以在任何地方，甚至在本地，您不需要向用户公开任何实例. 因此，静态 Gatsby 站点是不可破解的.在下面的资源中找到更多关于优缺点的论据.

Communities

如果您需要任何帮助，可以使用一些非常活跃的社区.

WPGraphQL - Slack Chat - Spectrum Chat - Twitter

Gatsby - Discord Chat - Reddit - Stack Overflow

Articles and Talks

详细阐述技术堆栈的文章和演讲列表.

Plugins

使 WordPress 和 Gatsby 协同工作的有用插件列表. 按字母顺序排列.

WordPress

Essential Plugins

  • WPGraphQL - Documentation - WPGraphQL 将 GraphQL 的强大功能带入您的 WordPress 网站.
  • WPGatsby - 此插件将您的 WordPress 站点配置为 Gatsby 的优化源.

WPGraphQL Extensions

  • WPGraphQL Cors - 这个来自@kidunot89 和@byfunkhaus 的免费插件声称允许您设置 GraphQL 将接受的 CORS 标头，从而使 WPGraphQL 的身份验证“正常工作”，这意味着可以接受 WordPress 默认身份验证 cookie.
  • Total Counts for WPGraphQL - 这个来自@builtbycactus 的免费插件公开了 WPGraphQL 架构中的连接总数.
  • WPGraphQL Gutenberg - 将 Gutenberg 块暴露给 WPGraphQL API.
  • WPGraphQL JWT Authentication - 扩展 WPGraphQL 插件以使用 JWT（JSON Web 令牌）提供身份验证.
  • WPGraphQL Lock - 通过实施持久的 GraphQL 查询为 WPGraphQL 启用查询锁定.
  • WPGraphQL Meta - 这个来自@robertorourke 的免费插件将通过 WordPress register_meta API 注册的元数据暴露给 WPGraphQL.
  • WPGraphQL Meta Query - 为 postObject 查询参数的 WPGraphQL 插件添加 Meta_Query 支持.
  • WPGraphQL Persisted Queries - 这个来自@qz 的免费插件增加了使用 WPGraphQL 的持久查询的能力.
  • WPGraphQL Offset Pagination - 这个来自@enshrined 的免费插件添加了基本的偏移分页，而不是 WPGraphQL 附带的基于标准游标的分页.
  • WPGraphQL Send Email - 来自@Ash_Hitchcock 的这个免费插件允许您通过简单的修改发送电子邮件. 包括限制发送到可信来源的能力.

使用 WPGraphQL 的其他插件的扩展

  • QL Search - 将 SearchWP 集成到 WPGraphQL 中的扩展.
  • WPGraphQL Content Blocks - 这个来自 QZ.com 的免费插件公开了一种从 WordPress 帖子和页面查询 HTML 内容作为“块”（与古腾堡无关）的方法，从而为您查询的内容带来更多结构.
  • WPGraphQL Enable All Post Types (DalkMania) - 来自@DalkMania 的这个免费插件会自动将所有已注册的帖子类型添加到 WPGraphQL 模式.
  • WPGraphQL Enable All Post Types (TylerBarnes) - 这个来自 @tylbar 的免费插件会自动将所有注册的帖子类型添加到 WPGraphQL 模式.
  • WPGraphQL Google Schema - 来自@izzygld261 的这个免费插件将 Google Schema 支持添加到 WPGraphQL.
  • WPGraphQL Gutenberg ACF - 通过 GraphQL 公开 ACF 块
  • WPGraphQL MB (MetaBox) - 这个来自@DalkMania 的免费插件使用 metabox.io 到 WPGraphQL 模式.
  • WPGraphQL MetaBox Relationships - 这个来自@hsimah 的免费插件增加了对 metabox.io WPGraphQL 的关系字段（当还使用他的 wp-graphql-metabox 插件时）.
  • WPGraphQL Polls - 这个来自@andrenosouza 的免费插件允许您通过 GraphQL 查询和突变与来自 WP-Polls 插件的数据进行交互.
  • WPGraphQL Polylang Extension - 使用来自 Polylang 插件的语言数据扩展 WPGraphQL 模式.
  • WPGraphQL Tax Query - 为 postObject 查询参数 (WP_Query) 添加 Tax_Query 支持到 WPGraphQL 插件.
  • WPGraphQL WPML - 来自@rburgst 的这个免费插件使用来自 WPML 插件的语言数据扩展了 WPGraphQL 模式. 此外，它会关闭 WPML 默认过滤器，以便能够遍历所有帖子，而不管语言如何.
  • WPGraphQL for Advanced Custom Fields - 向 WPGraphQL 架构公开高级自定义字段.
  • WPGraphQL for BuddyPress - 来自@RenatoNascAlves 的这个免费插件将 BuddyPress 数据公开给 WPGraphQL.
  • WPGraphQL for Carbon Fields - 来自@matepaiva 的这个免费插件将使用 Carbon Fields 注册的字段公开给 WPGraphQL Schema.
  • WPGraphQL for Custom Post Type UI - 这个免费插件将设置添加到自定义帖子类型 UI，允许您设置 CPTUI 注册的帖子类型和分类法应显示在 WPGraphQL 架构中.
  • WPGraphQL for FacetWP - 这个来自@hsimah 的免费插件在 WPGraphQL 查询上公开过滤器，以允许使用 FacetWP 进行分面搜索.
  • WPGraphQL for Gravity Forms - 这个来自@harness_up 的@KellenMace 的免费插件将@gravityforms 数据公开给 WPGraphQL，允许您查询表单、字段、条目等.
  • WPGraphQL for Metabox - 来自@hsimah 的这个免费插件将使用流行的 http://MetaBox.io 注册的字段公开到 WPGraphQL 模式.
  • WPGraphQL for Ninja Forms - 这个免费插件将 Ninja Forms 插件创建的表单暴露给 WPGraphQL Schema，并允许通过 GraphQL Mutations 提交表单.
  • WPGraphQL for Posts 2 Posts - 来自@harness_up 的@KellenMace 的这个免费插件会自动为您所有的 Posts 2 Posts 连接创建 GraphQL 连接.
  • WPGraphQL for SEOPress - 来自@moon_meister 的这个免费插件将 SEOPress 管理的数据暴露给 WPGraphQL 架构，允许在您的无头应用程序中使用 SEO 数据.
  • WPGraphQL for WooCommerce - 这个免费插件将 WooCommerce 数据公开给 WPGraphQL，允许您通过 GraphQL 查询和突变与您商店的数据进行交互.
  • WPGraphQl Yoast SEO Plugin - 将 Yoast SEO 数据公开给 WPGraphQL 插件.

Other helpful Plugins

  • Advanced Custom Fields - ACF PRO
  • Headless Mode - 无头模式为所有试图访问该站点的用户设置重定向. 唯一被授予许可的请求是那些试图访问 REST API、WP GraphQL API 或任何希望访问无头安装以编辑或创建帖子的登录用户.
  • Polylang
  • WP JAMstack Deployments - 用于在 Netlify（和其他平台）上部署 JAMstack 的 WordPress 插件.

Gatsby Plugins

Free Tutorials / Courses

注意： 自从 gatsby-source-wordpress V4 发布以来，它比 gatsby-source-graphql 更受欢迎，因此我只会列出与该方法相关的教程.

Written Tutorials

Video Tutorials

付费课程列表.

  • 2021.01: Building a Headless WordPress Site with Gatsby - 本课程逐步介绍如何使用 gatsby-source-wordpress 插件创建一个功能齐全的无头 Gatsby WordPress 网站，其中包含帖子、页面、类别、标签、帖子导航和其他功能.

Starters

项目启动器列表，您可以克隆并开始构建.

Themes

以 WordPress 为源的 gatsby 主题列表，您可以在 Gatsby 设置中使用它们.

Contribute

欢迎投稿！ 阅读 contribution guidelines 第一的.

License

CC0

在法律允许的范围内，Henrik Wirth 已放弃所有版权和 本作品的相关或邻接权利.

相关项目

Android UI

暂无描述

Angular

Awesome list of Angular seed repos, starters, boilerplates, examples, tutorials, components, modules, videos, and anything else in the Angular ecosystem. View as github page..

Ant Design

A curated list of Ant Design resources and related projects. The main idea is that everyone can contribute here, so we can have a central repository of informations about Ant Design that we keep up-to-date.

Aurelia

Aurelia 库、资源和闪亮事物的精选列表.

Awesome blazor

暂无描述

Awesome css frameworks

List of awesome CSS frameworks. Feel free to contribute.