WordPress 데이터 쿼리
WordPress 데이터 쿼리블록

블록

가이드 Gutenberg 블록 사용하기에서 자세히 읽어보실 수 있습니다.

다음은 블록 데이터를 가져오는 쿼리 예시입니다.

Block 타입을 사용하여 커스텀 포스트의 블록 가져오기

포스트의 모든 블록 데이터 가져오기:

{
  post(by: { id: 19 }) {
    blocks {
      ...BlockData
    }
  }
}
 
fragment BlockData on Block {
  name
  attributes
  # innerHTML
  contentSource
  innerBlocks {
    name
    attributes
    # innerHTML
    contentSource
    innerBlocks {
      name
      attributes
      # innerHTML
      contentSource
      innerBlocks {
        name
        attributes
        # innerHTML
        contentSource
        innerBlocks {
          name
          attributes
          # innerHTML
          contentSource
          innerBlocks {
            name
            attributes
            # innerHTML
            contentSource
            innerBlocks {
              name
              attributes
              # innerHTML
              contentSource
              innerBlocks {
                name
                attributes
                # innerHTML
                contentSource
              }
            }
          }
        }
      }
    }
  }
}

특정 종류의 블록만 가져오기:

{
  post(by: { id: 19 }) {
    blocks(
      filterBy: {
        include: [
          "core/heading",
          "core/paragraph"
        ]
      }
    ) {
      ...BlockData
    }
  }
}
 
fragment BlockData on Block {
  name
  attributes
  # innerHTML
  contentSource
  innerBlocks {
    name
    attributes
    # innerHTML
    contentSource
    innerBlocks {
      name
      attributes
      # innerHTML
      contentSource
      innerBlocks {
        name
        attributes
        # innerHTML
        contentSource
        innerBlocks {
          name
          attributes
          # innerHTML
          contentSource
          innerBlocks {
            name
            attributes
            # innerHTML
            contentSource
            innerBlocks {
              name
              attributes
              # innerHTML
              contentSource
              innerBlocks {
                name
                attributes
                # innerHTML
                contentSource
              }
            }
          }
        }
      }
    }
  }
}

블록 제외하기:

{
  post(by: { id: 19 }) {
    blocks(
      filterBy: {
        exclude: [
          "core/heading",
          "core/paragraph"
        ]
      }
    ) {
      ...BlockData
    }
  }
}
 
fragment BlockData on Block {
  name
  attributes
  # innerHTML
  contentSource
  innerBlocks {
    name
    attributes
    # innerHTML
    contentSource
    innerBlocks {
      name
      attributes
      # innerHTML
      contentSource
      innerBlocks {
        name
        attributes
        # innerHTML
        contentSource
        innerBlocks {
          name
          attributes
          # innerHTML
          contentSource
          innerBlocks {
            name
            attributes
            # innerHTML
            contentSource
            innerBlocks {
              name
              attributes
              # innerHTML
              contentSource
              innerBlocks {
                name
                attributes
                # innerHTML
                contentSource
              }
            }
          }
        }
      }
    }
  }
}

JSONObject 타입을 사용하여 커스텀 포스트의 블록 데이터 가져오기

포스트의 모든 블록 데이터 가져오기:

{
  posts(by: { id: 19 }) {
    blockDataItems
  }
}

특정 종류의 블록만 가져오기:

{
  posts(by: { id: 19 }) {
    blockDataItems(
      filterBy: {
        include: [
          "core/heading",
          "core/paragraph"
        ]
      }
    )
  }
}

블록 제외하기:

{
  posts(by: { id: 19 }) {
    blockDataItems(
      filterBy: {
        exclude: [
          "core/heading",
          "core/paragraph"
        ]
      }
    )
  }
}

커스텀 포스트의 평탄화된 블록 데이터 가져오기

blockFlattenedDataItems 필드는 커스텀 포스트에 포함된 블록 계층 구조를 단일 수준으로 평탄화합니다. 따라서 블록 종류로 필터링하면 제외된 부모 블록을 가진 내부 블록도 포함됩니다.

포스트의 모든 블록 데이터 가져오기:

{
  posts(by: { id: 19 }) {
    blockFlattenedDataItems
  }
}

특정 종류의 블록만 가져오기:

{
  posts(by: { id: 19 }) {
    blockFlattenedDataItems(
      filterBy: {
        include: [
          "core/heading",
          "core/paragraph",
          "core/columns",
          "core/column"
        ]
      }
    )
  }
}