Gato GraphQL + Bricks Builder + ChatGPT demo

Rewriting content in Bricks with ChatGPT for better SEO

Use ChatGPT to optimize the text content in a Bricks page for search engines

Leonardo Losoviz
Leonardo Losoviz -
Logo
Image
Target Image
Target Image

We can use ChatGPT with the Bricks extension to automatically rewrite the content in Bricks page elements for better SEO, all with a single Gato GraphQL query.

This query uses ChatGPT to rewrite the content in the heading and text elements of a Bricks page, for better SEO.

We must provide the following variables:

  • customPostId: The ID of the Bricks custom post to update
  • openAIAPIKey: The API key for the OpenAI API

Here is the GraphQL query:

query InitializeGlobalVariables
  @configureWarningsOnExportingDuplicateVariable(enabled: false)
{
  emptyArray: _echo(value: [])
    @export(as: "elementToUpdateIDs")
    @export(as: "elementToUpdateTexts")
    @remove
}
 
query GetBricksData($customPostId: ID!)
  @depends(on: "InitializeGlobalVariables")
{
  customPost(by:{ id: $customPostId }, status: any) {
    id
    title
    bricksData(filterBy: { include: ["heading", "text"] })
      @underEachArrayItem(
        affectDirectivesUnderPos: [1, 3]
      )
        @underJSONObjectProperty(by: { key: "id" })
          @export(as: "elementToUpdateIDs")
        @underJSONObjectProperty(by: { path: "settings.text" })
          @export(as: "elementToUpdateTexts")
  }
}
 
query CreateDescriptionsWithChatGPT(
  $openAIAPIKey: String!
  $systemMessage: String! = "You are an SEO content writer"
  $promptTemplate: String! = """
I'm working on rewriting content for a Bricks page, for better SEO.
 
I've created an array with the content to rewrite. Please rewrite the content for each item.
 
Keep the array indexes identical, rewrite the content only.
 
This is the JSON:
 
{$encodedContentItems}
"""
  $model: String! = "gpt-4o-mini"
)
  @depends(on: "GetBricksData")
{
  encodedContentItems: _arrayEncodeAsJSONString(array: $elementToUpdateTexts)
  prompt: _strReplace(
    search: "{$encodedContentItems}",
    replaceWith: $__encodedContentItems,
    in: $promptTemplate
  )
  openAIResponse: _sendJSONObjectItemHTTPRequest(input: {
    url: "https://api.openai.com/v1/chat/completions",
    method: POST,
    options: {
      auth: {
        password: $openAIAPIKey
      },
      json: {
        model: $model,
        messages: [
          {
            role: "system",
            content: $systemMessage
          },
          {
            role: "user",
            content: $__prompt
          },
        ],
        response_format: {
          type: "json_schema",
          json_schema: {
            name: "content_response",
            strict: true,
            schema: {
              type: "object",
              properties: {
                descriptions: {
                  type: "array",
                  items: {
                    type: "string"
                  }
                }
              },
              required: ["descriptions"],
              additionalProperties: false
            }
          }
        }
      }
    }
  })
    @underJSONObjectProperty(by: { key: "choices" })
      @underArrayItem(index: 0)
        @underJSONObjectProperty(by: { path: "message.content" })
          @export(as: "jsonEncodedRewrittenDescriptions")
}
 
query ExtractRewrittenDescriptions
  @depends(on: "CreateDescriptionsWithChatGPT")
{
  jsonEncodedRewrittenDescriptions: _echo(value: $jsonEncodedRewrittenDescriptions)
    @remove
  decodedRewrittenDescriptions: _strDecodeJSONObject(string: $jsonEncodedRewrittenDescriptions)
    @remove
  rewrittenDescriptions: _objectProperty(
    object: $__decodedRewrittenDescriptions,
    by: { key: "descriptions" }
  )
    @export(as: "rewrittenDescriptions")
}
 
query GetElementToUpdateData
  @depends(on: "ExtractRewrittenDescriptions")
{
  elementToUpdateIDs: _echo(value: $elementToUpdateIDs)
  elementToUpdateTexts: _echo(value: $rewrittenDescriptions)
  elementToUpdateMergeInputElements: _echo(value: $rewrittenDescriptions)
    @underEachArrayItem(
      passIndexOnwardsAs: "index",
      passValueOnwardsAs: "elementToUpdateText"
      affectDirectivesUnderPos: [1, 2]
    )
      @applyField(
        name: "_arrayItem",
        arguments: {
          array: $elementToUpdateIDs,
          position: $index
        },
        passOnwardsAs: "elementToUpdateID"
      )
      @applyField(
        name: "_echo",
        arguments: {
          value: {
            id: $elementToUpdateID,
            settings: {
              text: $elementToUpdateText
            }
          }
        }
        setResultInResponse: true
      )
    @export(as: "elementToUpdateMergeInputElements")
}
 
mutation StoreUpdatedElementText($customPostId: ID!)
  @depends(on: "GetElementToUpdateData")
{
  bricksMergeCustomPostElementDataItem(input: {
    customPostID: $customPostId
    elements: $elementToUpdateMergeInputElements
  }) {
    status
    errors {
      __typename
      ...on ErrorPayload {
        message
          @passOnwards(as: "message")
          @fail(
            message: $message
            condition: ALWAYS
          )
      }
    }
    customPost {
      __typename
      ...on CustomPost {
        id
        bricksData
      }
    }
  }
}

The variables would look like this:

{
  "customPostId": 123,
  "openAIAPIKey": "sk-..."
}

Subscribe to our newsletter

Stay in the loop on all new things concerning Gato GraphQL.