从模板创建 Elementor 页面

此 query 在通过向模板注入数据动态创建 Elementor 页面演示中有所展示。

此 query 从模板创建新的 Elementor 页面，并从任意来源注入数据。

它执行以下操作：

初始化动态变量
获取页面模板并导出其数据
从模板创建新页面
用提供的数据替换页面中的 Elementor 数据
用新数据更新 Elementor 页面

此 query 需要启用 Elementor 扩展。

所需变量如下：

templatePageId：Elementor 模板页面的 ID
pageTitle：新页面的标题
imageUrl：在 call-to-action 小部件中使用的图片 URL
heading：在 heading 小部件中使用的标题文本
description：在 text editor 小部件中使用的描述文本
items：在 icon list 小部件中使用的字符串数组

query InitializeDynamicVariables
  @configureWarningsOnExportingDuplicateVariable(enabled: false)
{
  authorID: _echo(value: null)
    @export(as: "authorID")
    @remove
 
  featuredImageID: _echo(value: null)
    @export(as: "featuredImageID")
    @remove
 
  meta: _echo(value: {})
    @export(as: "meta")
    @remove
}
 
query GetPageTemplateAndExportData($templatePageId: ID!)
  @depends(on: "InitializeDynamicVariables")
{
  exportPage: page(by: { id: $templatePageId }, status: any) {
    # Fields not to be duplicated
    id
    slug
    date
    status
 
    # Fields to be duplicated
    author {
      id @export(as: "authorID")
    }
    rawContent @export(as: "rawContent")
    rawExcerpt @export(as: "excerpt")
    featuredImage {
      id @export(as: "featuredImageID")
    }
 
    metaKeys(filter: { exclude: [
      "_thumbnail_id",
      "_edit_last",
      "_elementor_page_assets",
      "_elementor_controls_usage",
      "_elementor_css",
      "_elementor_screenshot",
    ] })
    meta(keys: $__metaKeys) 
      @export(as: "meta")
  }
}
 
mutation CreatePageFromTemplate(
  $pageTitle: String!
)
  @depends(on: "GetPageTemplateAndExportData")
{
  createPage(input: {
    status: draft,
    authorBy: {
      id: $authorID
    },
    contentAs: {
      html: $rawContent
    },
    excerpt: $excerpt
    featuredImageBy: {
      id: $featuredImageID
    },
    title: $pageTitle,
    meta: $meta
  }) {
    status
    errors {
      __typename
      ...on ErrorPayload {
        message
      }
    }
    page {
      # Fields not to be duplicated
      id
      slug
      date
      status
 
      # Fields to be duplicated
      author {
        id
      }
      rawContent
      excerpt
      featuredImage {
        id
      }
      title
      
      metaKeys
      meta(keys: $__metaKeys)
    }
    pageID @export(as: "newPageId")
  }
}
 
query ReplaceElementorDataInPage(
  $imageUrl: String!
  $heading: String!
  $description: String!
  $items: [String!]!
)
  @depends(on: "CreatePageFromTemplate")
{
  page(by: { id: $newPageId }, status: any) {
    title
    elementorFlattenedDataItems
      @underEachArrayItem(
        passValueOnwardsAs: "element"
        affectDirectivesUnderPos: [1, 2, 3]
    	)
        @applyField(
          name: "_objectProperty",
          arguments: {
            by: {
              key: "widgetType"
            },
            object: $element
            failIfNonExistingKeyOrPath: false
          }
          passOnwardsAs: "widgetType"
        )
        @applyField(
          name: "_equals",
          arguments: {
            value1: $widgetType
            value2: "call-to-action"
          }
          passOnwardsAs: "isWidget"
        )
        @if(condition: $isWidget)
          @underJSONObjectProperty(
            by: {
              path: "settings.bg_image.url"
            }
          )
            @applyField(
              name: "_echo",
              arguments: {
                value: $imageUrl
              }
              setResultInResponse: true
            )
    
      @underEachArrayItem(
        passValueOnwardsAs: "element"
        affectDirectivesUnderPos: [1, 2, 3]
    	)
        @applyField(
          name: "_objectProperty",
          arguments: {
            by: {
              key: "widgetType"
            },
            object: $element
            failIfNonExistingKeyOrPath: false
          }
          passOnwardsAs: "widgetType"
        )
        @applyField(
          name: "_equals",
          arguments: {
            value1: $widgetType
            value2: "heading"
          }
          passOnwardsAs: "isWidget"
        )
        @if(condition: $isWidget)
          @underJSONObjectProperty(
            by: {
              path: "settings.title"
            }
          )
            @applyField(
              name: "_echo",
              arguments: {
                value: $heading
              }
              setResultInResponse: true
            )
    
      @underEachArrayItem(
        passValueOnwardsAs: "element"
        affectDirectivesUnderPos: [1, 2, 3]
    	)
        @applyField(
          name: "_objectProperty",
          arguments: {
            by: {
              key: "widgetType"
            },
            object: $element
            failIfNonExistingKeyOrPath: false
          }
          passOnwardsAs: "widgetType"
        )
        @applyField(
          name: "_equals",
          arguments: {
            value1: $widgetType
            value2: "text-editor"
          }
          passOnwardsAs: "isWidget"
        )
        @if(condition: $isWidget)
          @underJSONObjectProperty(
            by: {
              path: "settings.editor"
            }
          )
            @strReplace(
              search: "{description}",
              replaceWith: $description
            )
    
      @underEachArrayItem(
        passValueOnwardsAs: "element"
        affectDirectivesUnderPos: [1, 2, 3]
    	)
        @applyField(
          name: "_objectProperty",
          arguments: {
            by: {
              key: "widgetType"
            },
            object: $element
            failIfNonExistingKeyOrPath: false
          }
          passOnwardsAs: "widgetType"
        )
        @applyField(
          name: "_equals",
          arguments: {
            value1: $widgetType
            value2: "icon-list"
          }
          passOnwardsAs: "isWidget"
        )
        @if(condition: $isWidget)
          @underJSONObjectProperty(
            by: {
              path: "settings.icon_list"
            }
          )
            @underEachArrayItem
              @underJSONObjectProperty(
                by: {
                  key: "text"
                }
              )
                @strReplaceMultiple(
                  search: ["{item1}", "{item2}", "{item3}", "{item4}", "{item5}", "{item6}"],
                  replaceWith: $items
                )
      @underEachArrayItem
        @objectKeepProperties(keys: ["id", "settings"])
      @export(
        as: "updatedElementorDataItems"
      )
  }
}
 
mutation CreateElementorPageWithData
  @depends(on: "ReplaceElementorDataInPage")
{
  elementorMergeCustomPostElementDataItem(input: {
    elements: $updatedElementorDataItems,
    customPostID: $newPageId
  }) {
    status
    errors {
      __typename
      ...on ErrorPayload {
        message
      }
    }
  }
}

变量示例如下：

{
  "templatePageId": 2746,
  "pageTitle": "My awesome services",
  "imageUrl": "https://gatographql.com/assets/GatoGraphQL-logo-suki-rectangular.png",
  "heading": "My great header",
  "description": "Please come visit my website",
  "items": ["Great value", "Amazing features", "Friendly staff", "Open 24/7", "Money-back guarantee", "Premium support"]
}