Advanced Website: Dynamic content overview

Dynamic content is a versatile feature that turns your website elements into dynamic, data-driven components. This means that instead of manually updating each piece of content across your site, you can link elements to a single data source—either managed within the editor or from external sources. This ensures your website remains consistent, accurate, and up-to-date with minimal effort.

You can create your own Dynamic Content: Dynamic Pages, which serve as templates that automatically populate multiple pages with the same layout and structure. Additionally, dynamic content powers built-in features such as blog posts and product pages, seamlessly integrating and displaying your data.

In essence, dynamic content simplifies your workflow by centralizing data management, reducing manual updates, and ensuring your website always reflects the most current information.

What is dynamic content

Dynamic content is content on a site that is automatically generated or updated based on data from a collection or database. Instead of manually updating the site, updates can be made in the collection or database.

This feature powers built-in tools (such as blogs), semi-customizable content like dynamic business content, and fully customizable solutions like dynamic pages.

Continue reading to learn more about where dynamic content is stored, how it can be used, and how it connects to your site in the sections that follow.

Where dynamic content is stored

There are several places where content can be stored, and the location may depend on your end goal.

• Connected Data: Business Info, Text, and Images (inside the editor). These areas are ideal for storing static content that may need updates, such as phone numbers, team images, and more. When updated, this content will automatically refresh across all connected elements on the site. See Dynamic Content: Business Info, Text, and Images.
• Collections (Internal, Google Sheets, Airtable, and External): Collections are similar to databases in that they contain lists of items that have the same type of information (name, location, image, and so on). The typical use for collections is to generate multiple pages from a dynamic page, some examples may be real estate listings, team pages, and more. Collections can be store internally, or externally. See Dynamic Content: Collections. However, if you may need to manage static content that requires occasional updates and want more flexibility than the Business Info area provides, you can also use collections on regular pages (see Dynamic Content: Collections for Regular Pages).
• Integrated Features: Within built-in functionalities like blog posts and product pages. 

Where dynamic content can be used

Dynamic content can be used in various areas, depending on where it's stored or how it's set up.

• Widgets.
  • For details on what widgets are available for the different types of storage options, see Widget and Settings Binding below.
• Canvas Elements.
  • Row and column backgrounds.
• Settings.
  • Page specific SEO.
  • Page specific open graph.
  • Page specific Header HTML (inline binding).

Tip:
The integrated features, blog posts and product pages, are pre-built with nearly everything you need, though come with the flexibility to be able to edit them.

Widget and settings binding

Widgets and elements	Connected data (Business info, text, and images) & collections set up to use on regular pages	Collections (when connected to a dynamic page)
Text: paragraph, titles
Icon
Image
Map
Multi-location (Connected Data only)
Button/Click To Call/Click-to-email (text on button)
Social Widgets
Photo gallery
Image slider
Media slider
List
Background slider
Background Image
Business hours (Update via API only)
Text & Image Widget
Shape Widget
HTML Widget
Contact Form
Accordion widget
Table widget

How dynamic content is connected

There are 2 ways dynamic content is connected:

Whole widget and settings binding. Entire widgets and certain settings can be connected.

Inline binding. Connect specific portions of text, such as a company name or description, within a larger section of text that is not connected.

Whole widget and settings binding

Tip:
The integrated features, blog posts and product pages, come with widgets already connected.

To connect a widget or canvas element (row and column backgrounds):

1. Right-click on the widget or element you want to connect, and select Connect to Data.
2. Select the desired data using the drop-down (only relevant data options are shown).
3. Select Done.

The Connected Data icon appears on the widget or element indicating that it is connected.

To connect SEO settings and the header HTML:

1. In the side panel, click Pages, then click the settings () icon for the desired dynamic page.
2. Click Edit Page SEO.
3. Click the Connect Data icon for the desired field. Tip: Continue to scroll to reach the Header HTML field.
4. Select the desired data using the drop down (only relevant data options are shown).
5. Click Done.

Inline binding

Inline binding is the ability to use Dynamic for a specific word or words within supported widgets. The connected text can be designed and linked just like regular text.

The Content Library design overrides the text editor design for connected text.

To use inline binding for text widgets:

1. Type {{{ in the text editor to trigger the Connect Data pop up.
2. Select the label you want connected.
3. Click Save.

While editing, the label appears in the editor within curly brackets (for example, ). The connected text displays after closing the editor. You can also display the connected text by clicking the Connected Data () icon.

Only users with Connected Data in their account see the Connected Data icon, but all users see the label in curly brackets while editing.

Alternatively, you can type the label directly into the text editor surrounded by two curly brackets to connect the text using inline binding. For example,.

Inline Binding for the Accordion widget

To use inline binding for the Accordion widget:

1. Add an accordion widget to the desired page.
2. Open the widget's content tab.
3. Select any accordion item.
4. In the description field text box, click the Data Binding button () in the top left of the toolbar.
5. From the connected data popup choose any field you want to connect.
   • The chosen field will be added to the description field as an inline binding item - this indicates you can add static text to the description as well and combine it with the dynamic data.

Only the description currently supports inline binding. All other fields (title, image, and button) are static. If not needed, the image and button fields can be hidden.

Disconnect data

To disconnect a widget:

1. Right-click the widget, and click Change connection.
2. In the menu, select None.
3. For widgets that have content editing menus, if you are already in the widget content editor, you can hover on the blue icon in the top-right corner and click Disconnect.

Disconnecting a widget reverts the text and its style to the previously used style.

To disconnect SEO settings and the header HTML:

1. In the side panel, click Pages, then click the settings () icon for the desired dynamic page.
2. Click Edit Page SEO.
3. Click the Connect Data () icon for the desired field. Tip: Continue to scroll to reach the Header HTML field.
4. Click into the drop-down list and select None.
5. Click Done.