WPGraphQL ist die GraphQL-API-Schicht für WordPress. Es stellt WordPress-Beiträge, Seiten, Taxonomien und Benutzer als ein GraphQL-Schema zur Verfügung, das JavaScript-Frontends (Next.js, Astro, Nuxt, SvelteKit usw.) effizient abfragen können. Es ist der Standardweg, um headless WordPress mit einem JavaScript-Frontend zu erstellen.
Die Lücke von WPGraphQL waren schon immer benutzerdefinierte Felder. Es kennt keine ACF, Meta Box, CMB2 oder die Felder anderer Plugins — Sie benötigen Add-On-Plugins wie WPGraphQL für ACF, um die Lücke zu schließen.
Field Forge schließt diese Lücke nativ. Wenn Field Forge und WPGraphQL beide aktiv sind, erscheinen die benutzerdefinierten Felder von Field Forge automatisch im GraphQL-Schema.
Wenn Field Forge aktiviert wird (oder WPGraphQL nach der Aktivierung von Field Forge), dann:
function_exists('register_graphql_object_type')fieldforge-Feld zu jedem abfragbaren Beitragstyp hinzuAll dies geschieht automatisch im Hintergrund während der Plugin-Aktivierung.
Wenn Sie eine Feldgruppe im visuellen Builder von Field Forge hinzufügen, bearbeiten oder löschen, wird das GraphQL-Schema automatisch aktualisiert. Der Schema-Cache von WPGraphQL wird geleert und Field Forge registriert die aktualisierten Typen bei der nächsten Anfrage erneut.
Sie müssen nichts manuell regenerieren.
Mit aktivem Field Forge und WPGraphQL können Sie benutzerdefinierte Felder wie folgt abfragen:
“graphql query GetHomepage { page(id: "home", idType: URI) { title fieldforge { heroSection { title subtitle backgroundImage { sourceUrl altText mediaDetails { width height } } ctaButton { text url openInNewTab } } featuresSection { sectionTitle features { icon title description } } } } } “
Der fieldforge-Schlüssel gibt alle Feldgruppen frei, die der Seite über Standortregeln zugewiesen sind. Jede Feldgruppe ist ein typisiertes Objekt mit eigenen Feldern.
Wiederholungsfelder, Gruppen und flexibler Inhalt erzeugen alle ordnungsgemäße verschachtelte GraphQL-Typen:
“`graphql type TeamPageFieldforge { teamMembers: [TeamMemberRow] }
type TeamMemberRow { name: String photo: MediaItem bio: String socialLinks: [SocialLinkRow] # Verschachtelter Wiederholer } “`
“`graphql type LandingPageFieldforge { pageSections: [PageSectionLayout] }
union PageSectionLayout = HeroLayout | FeaturesLayout | CTALayout “`
Abfragen von Unionstypen mit Inline-Fragmenten:
“graphql query GetLandingPage { page(id: "landing", idType: URI) { fieldforge { pageSections { __typename ... on HeroLayout { title backgroundImage { sourceUrl } } ... on FeaturesLayout { sectionTitle features { title description } } } } } } “
Relationale Felder (Post-Objekt, Beziehung, Benutzer, Taxonomie) lösen sich in die nativen Typen von WPGraphQL auf:
“graphql type ProductFieldforge { relatedProducts: [Post] # WPGraphQLs Post-Typ author: User # WPGraphQLs Benutzer-Typ categories: [Category] # WPGraphQLs Kategorie-Typ } “
Das bedeutet, dass Sie Abfragen über Beziehungen verketten können:
“graphql query GetProduct { post(id: "product-a", idType: URI) { fieldforge { productDetails { relatedProducts { title slug featuredImage { node { sourceUrl } } fieldforge { productDetails { price } } } } } } } “
Werte von Optionsseitenfeldern werden als GraphQL-Typen auf Root-Ebene bereitgestellt:
“`graphql type FieldforgeOptions { siteSettings: SiteSettingsFields headerSettings: HeaderSettingsFields footerSettings: FooterSettingsFields }
type Query { fieldforgeOptions: FieldforgeOptions } “`
Abfragen ohne einen spezifischen Beitrag-Kontext:
“graphql query GetGlobalSettings { fieldforgeOptions { siteSettings { companyName phone email } footerSettings { copyright socialLinks { platform url } } } } “
Field Forge generiert auch TypeScript-Definitionen für dieselben Feldgruppen. Verwenden Sie beides:
Die beiden füttern unterschiedliche Pipelines, stellen jedoch dieselben zugrunde liegenden Feldgruppendaten dar. Aktualisieren Sie eine Feldgruppe in Field Forge, und sowohl das GraphQL-Schema als auch die TypeScript-Definitionen werden zusammen aktualisiert.
Für Teams, die GraphQL Code Generator verwenden, können Sie das durch Field Forge erweiterte WPGraphQL-Schema introspektieren und typisierte Abfrage-Hooks automatisch generieren:
“`yaml
schema: https://wp.example.com/graphql documents: ‘./src/**/*.graphql’ generates: ./src/gql/: preset: client plugins: [] “`
Führen Sie graphql-codegen aus, und Ihr Frontend hat vollständig typisierte GraphQL-Abfragen für alle Field Forge-Felder.
WPGraphQL für ACF ist ein separates Plugin vom WPGraphQL-Team, das ACF-Feldgruppen in das GraphQL-Schema integriert. Es funktioniert sowohl mit ACF als auch mit SCF (da SCF ein Fork von ACF ist).
Unterschiede zur nativen Integration von Field Forge:
| Field Forge + WPGraphQL | WPGraphQL für ACF | |
|---|---|---|
| Installation | Automatische Registrierung bei der Aktivierung von Field Forge | Separates Plugin zur Installation und Konfiguration |
| Wartung | Teil des Release-Zyklus von Field Forge | Unabhängiger Release-Zyklus |
| Quelle der benutzerdefinierten Felder | Field Forge | ACF oder SCF |
| Typzuordnung | Field Forge-spezifisch | ACF-spezifisch |
| Leistung | Integriertes Batch-Loading mit der benutzerdefinierten Tabelle von Field Forge | Hängt vom wp_postmeta-Speicher ab |
Wenn Sie ACF/SCF verwenden und GraphQL benötigen, ist WPGraphQL für ACF der Weg. Wenn Sie in Erwägung ziehen, die Schicht der benutzerdefinierten Felder zu modernisieren, ersetzt Field Forge + WPGraphQL beide Plugins durch ein integrierteres Erlebnis.
Holen Sie sich Field Forge — ab $35/Jahr →
Die WPGraphQL-Integration ist in jedem kostenpflichtigen Plan enthalten. Automatische Registrierung bei der Aktivierung, null Konfiguration.