Schema Field Types Dynamic Content Field

Dynamic content field

The Dynamic Content field allows content editors to combine various elements such as headings, texts, videos, social media posts, maps, assets, remote content, and components to create rich content.

This page lists sample requests you can use to query different types of content available in the Dynamic Content field.

query {
    Post( id : "89794aaa-6faa-47ae-a595-2911aaecd85d") {
        _id,
        dynamic_content_field {
            __typename
        
            ... on ElementTypeName {
                // fields of the requested type.
            }
        },
    }
}

Dynamic content components

Heading (text)

Heading elements contain two fields. body contains the content of the heading, format tells you if the heading is H1, H2, H3 ect. formatted.

query {
    Posts : Pages {
        items {
            dynamic_content_field {
                __typename
                ... on Text {
                    body
                    format
                }
            }
        }
    }
} 

Paragraph (text)

Paragraph elements contain two fields. body contains the content of the paragraph, format tells you if the heading is HTML or plain formatted.

query {
    Posts : Pages {
        items {
            dynamic_content_field {
                __typename
                ... on Text {
                    body
                    format
                }
            }
        }
    }
} 

Links (text)

You can identify links with the <a></a> HTML tag in the body and html string values like in the example response below.

query {
    Posts : Pages {
        items {
            dynamic_content_field {
                __typename
                ... on Text {
                    body
                    html
                }
            }
        }
    }
} 

The href value for a link to a content item is its Slug by default as shown in the response example above. If there is no Slug, the response will be plain text. To get the content item Id instead, add the header Prepr-Resolve-Internal-Links to your request and set it to false. Clear the cache on the Access tokens page after adding this header to your request.

Assets

Heading elements contain two fields. body contains the content of the heading, format tells you if the heading is H1, H2, H3 ect. formatted.

Check out the Asset Field section for all asset fields.

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on Assets {
                    items {
                        url
                    }
                }
            }
        }
    }
} 

Components

Components are transformed into their own GraphQL types. Components are often used to represent a set of reusable fields. To query the content from a component you need to specify the subfields, like you do for any other type.

In our example the dynamic_content_field contains a component named HeaderComponent.

query {
    Pages {
        items {
            dynamic_content_field {
                __typename
                ... on HeaderComponent {
                    name
                    gallery {
                        url
                    }
                }
            }
        }
    }
} 

Social posts

Social posts can be one of the following types: InstagramPost, YouTubePost, FacebookPost, TwitterPost, SpotifyPlaylist, TikTokPost, VimeoPost, SoundCloudPost.

The returned urls are oEmbed (opens in a new tab) supported urls.

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on TwitterPost {
                    url
                }
            }
        }
    }
} 

Quote

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on Quote {
                    author
                    body
                }
            }
        }
    }
} 

Resource (external links)

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on Resource {
                    url
                    body
                }
            }
        }
    }
} 

Menu item (NavigationItem)

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on NavigationItem {
                    url
                    slug
                    body
                }
            }
        }
    }
} 

Location (Coordinates)

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on Coordinates {
                    latitude
                    longitude
                }
            }
        }
    }
} 

Remote content

The Remote content field allows an editor to reference content from an eCommerce platform, external CMS or legacy system in Prepr content items. A Remote Source has its own fields which are configured in the schema.

For example our ecommerce source has a product_id, category_id and image_url field.

If you add a Remote source to the Dynamic Content Editor a specific Remote Source Collection is generated

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on EcommerceCollection {
                    items {
                        _id
                        product_id
                        category_id
                        image_url
                    }
                }
            }
        }
    }
} 

Remote content before API version 2023-01-10 (deprecated)

In the API versions before 2023-01-10 Remote content fields are returned as generic ContentIntegrations and ContentIntegration type. Let's see the same example in the deprecated versions.

query {
    Posts {
        items {
            dynamic_content_field {
                __typename
                ... on ContentIntegrations {
                    items {
                        _id
                        data {
                            key
                            value
                        }
                    }
                }
            }
        }
    }
} 

Was this article helpful?

We’d love to learn from your feedback