Crear una página de Elementor desde una plantilla

Esta consulta se muestra en la demo Creando una página de Elementor dinámicamente inyectando datos en una plantilla.

Esta consulta crea una nueva página de Elementor a partir de una plantilla, inyectando datos desde cualquier fuente.

Realiza las siguientes operaciones:

Inicializa variables dinámicas
Obtiene la plantilla de página y exporta sus datos
Crea una nueva página a partir de la plantilla
Reemplaza los datos de Elementor en la página con los datos proporcionados
Actualiza la página de Elementor con los nuevos datos

Esta consulta requiere que la extensión Elementor esté habilitada.

Las variables requeridas son:

templatePageId: El ID de la página plantilla de Elementor
pageTitle: El título de la nueva página
imageUrl: La URL de la imagen a usar en el widget call-to-action
heading: El texto del encabezado a usar en el widget heading
description: El texto de descripción a usar en el widget text editor
items: Un array de cadenas para usar en el widget 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
      }
    }
  }
}

Las variables tendrían este aspecto:

{
  "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"]
}