izzygld

<template>
  <script v-html="jsonld" type="application/ld+json"></script>
</template>

<script>
    @Prop()
    recipe: Recipe;
    get jsonld(): string {
      if (this.recipe == null) {
        return "{}";

izzygld

1. Regular post query with pagination fields
2. include the Pagination Component
3. The actual pagination.

----------------


1. const postsQuery = gql`
query GetAllPosts ($first: Int, $last: Int, $endCursor: String, $startCursor: String) {
      posts(first:$first last:$last after:$endCursor before:$startCursor) {

izzygld

<template>
  <div>
    <vue-editor v-model="content" ref="editor" :editor-options="toolbarOptions" @text-change="updateValue" useCustomImageHandler @imageAdded="uploadImage"></vue-editor>
  </div>
</template>

<script>
import Vue from "vue";
import axios from 'axios'
let VueEditor, Quill;

izzygld

add_filter('graphql_post_fields', function($fields) {
    $fields['post_images'] = [
        'type' => \WPGraphQL\Types::list_of(\WPGraphQL\Types::post_object('attachment')),
        'description' => __('Images on posts', 'mostly plants'),
        'resolve' => function(\WP_Post $post) {
      $post_images = get_field('post_images', $post->ID);
      $images = [];
      if (!empty($post_images) && is_array($post_images)) {
        for ($i = 0; $i < count($post_images); $i++) {
           $images[] = \WPGraphQL\Data\DataSource::resolve_post_object($post_images[$i]['ID'], 'attachment');

izzygld

WP Grahql - Nav Menu

Implements navigation menu support with two new types: Menu and MenuItem. Each have singular and plural root queries. MenuItems are connected to both Menus and to themselves—this allows for the implementation of childItems (hierarchical nav menu queries):

Query{
  menus( location: MAIN ) {
    edges {
      node {
        id

izzygld

Architecture

Resurf is made of two sites, a wordpress backend, in the wp folder, and a node/express frontend, located in the site folder.

The backend is a standard wordpress site, managed by composer, where wordpress is set to be installed in public/wp (there is an .htaccess file which rewrites the "wp" part of the url away). The wp-graphql plugin is installed which exposes wordpress through a graphql api.

The entry point of the node frontend is site/server.js. graphql-yoga is used to set up a graphql server over express. http-proxy-middleware to proxy parts of wordpress to be exposed throught the frontend (such as wp-admin, etc.). The proxy assumes that wordpress is running on http://wp

Finally, one nuxt nuxt application is setup per theme. The code for each nuxt app is in site/themes. The app to be rendered is determined based on the hostname. There is a manual mapping of subdomains to the application to render.

izzygld

//acf stats repeater
array (
			'key' => 'field_5a27ee3a83076',
			'label' => 'Stats',
			'name' => 'stats',
			'type' => 'repeater',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array (

izzygld

add_action( 'wp_loaded', 'wpse290170_wp_loaded' );

function wpse290170_wp_loaded() {
  $types = get_post_types( [
      'public'   => true
        ] );
      foreach ( $types as $type ){
        add_action( "graphql_" . $type . "_fields", function($fields) {

            $fields['seo_title'] = [

izzygld

use GraphQL\Type\Definition\ObjectType;
use GraphQL\Type\Definition\Type;


  add_action('graphql_page_fields', function($fields) {

    $impactType = new ObjectType([
          'name' => 'Impact',
          'description' => __( 'The description of your process type', 'your-textdomain' ),
          'fields' => [