Content Delivery API > Modular content fields

If you have modular-content fields you can use GraphQL fragments to fetch the different blocks.

Suppose a blog_post model has a modular content field called content, which in turn accepts the following blocks:

• Block blog_post_text_block: made of a text field (multi-paragraph text);

• Block blog_post_quote_block: made of a quote field (multi-paragraph text) and author field (single-line string);

• Block blog_post_gallery_block: made of a gallery field (image gallery);

This GraphQL query will do the work:

query {
  allBlogPosts {
    title
    content {
      ... on BlogPostTextBlockRecord {
        id
        _modelApiKey
        text
      }
      ... on BlogPostQuoteBlockRecord {
        id
        _modelApiKey
        quote
        author
      }
      ... on BlogPostGalleryBlockRecord {
        id
        _modelApiKey
        gallery { url }
      }
    }
  }
}

Since all records implement the GraphQL interface RecordInterface, you can dry up the same query like this:

query {
  allBlogPosts {
    title
    content {
      ... on RecordInterface {
        id
        _modelApiKey
      }
      ... on BlogPostTextBlockRecord {
        text
      }
      ... on BlogPostQuoteBlockRecord {
        quote
        author
      }
      ... on BlogPostGalleryBlockRecord {
        gallery { url }
      }
    }
  }
}