Dynamic Content: Business Info, Text, and Images

Connect site widgets to data that lives in the site's Content Library with the Connected Data feature. This enables you to have one source of truth to build websites more quickly, keep websites up-to-date and accurate, ensure site-wide consistency of important information, and more. When sites widgets are connected to fields in the Content Library, you no longer need to manually change the data in each of the widgets.

To access Business Info, in the side panel, click Content, then click the desired type of business content (Business Info, Business Text, Business Images). 

For information on what dynamic content is and more, see Dynamic Content Overview (cross reference). 

Note

In order to connect widgets through Connected Data, the content must be stored in the Content Library. For information on collecting content, see Import and Collect Content.

Connected Data Structure

For data to be connected through Connected Data, it must have a label and content.

  • Label. The label is the unique indication of the content in the library that binds it to the widget on the site. While there are built in labels (for example, the labels for Logo or Social icons fields are predefined), for custom text, make sure the labels you choose are meaningful and unique. This helps you easily pick which content element should connect to which widget and help prevent changing the label in the future.

    Warning

    Changing the Content Library label while a widget is connected will disconnect the widget.

  • Content. The information (for example, text, image, phone) that is in the Content Library and once connected to a widget displays on the site.

You can populate the Content Library with two types of content: text and images. Each text section in the Business info can contain up to 4000 characters.

Some Content Library fields have predefined labels. For example, the labels for Logo or Social icons fields are predefined. Other fields, such as Collections or non-default business text fields, have custom labels you need to define yourself.

Connect Business Data

The business data you can connect to the widgets on your site is summarized in the following table:

Widgets

Business Content Data

Text: paragraph, titles

Business text: all options

Business info:

  • Social links

  • Phone number

  • Email address

  • Locations (address)

  • Business name

Icon

  • Phone number

  • Email address

  • Social media

Image

Business info (link):

  • Phone number

  • email address

  • Image

  • Alt text

Map

Business info: Location

Multi-location (Connected Data only)

Business info: Locations

Button/Click To Call/Click-to-email (text on button)

Business info:

  • Social links

  • Phone number

  • Email address

  • Business text

Social Widgets

  • Facebook

  • Instagram

  • Twitter

Background Image

Business images:

  • Logo

  • Single image

Business hours

Update via API only

Text & Image Widget

Image and text

Shape Widget

  • Image

  • Title

  • Text

  • Link

HTML Widget

Business info:

  • Business name

  • Phone number

  • Location or address

  • Business hours

  • Email address

  • Social links

Business text:

  • About us

  • Company overview

  • Business services

Contact Form

Email address

Accordion widget

Text (inline binding only; see ???)
SEO Fields in Page Settings

You can connect the SEO Title and SEO Description to any text field in the Content Library.

Note

Connected data is available for individual pages. The site SEO settings are not able to be connected.

Data Connections and Site Elements

Note

To connect data to site elements, there must be content in the Content Library. If there is no content, the option to Connect Data does not appear on the site.

Customized Text Styles:

  • If the text style has been customized in the Business Text area, this style will carry over to the connected widget.

  • To reconnect the text to the Theme Text styles, go to the Business Text area and click the Clear Formatting icon for the specific text.

Inherited Text Styles:

  • When you connect text data, it will inherit the Theme Text styles by default unless the style has been customized in the Business Text area.

  • To override the inherited text style, you can change it in the widget’s design editor.

Editing Limitations:

  • Please note that the inline text editing menu is not available for text widgets that are connected to dynamic content.

Manage Data Connections for Site Elements
Connect Data to Site Elements

Note

To connect data to site elements, there must be content in the Content Library. If there is no content, the option to Connect Data does not appear on the site.

Connect a Widget or Canvas Element

To connect a widget or canvas element*:

  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 (connected-data-icon.png) icon appears on the widget or element indicating that it is connected.

*The canvas elements that can be connected are:

  • row and column backgrounds.

Connect Data to SEO Settings and the Header HTML

To connect SEO settings and the header HTML:

  1. In the side panel, click Pages, then click the settings (three_dots_horiz_icon.png) icon for the desired dynamic page.

  2. Click Edit Page SEO.

  3. Click the Connect Data (connected_data_icon.png) 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.

Note

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, {{label}} ). The connected text displays after closing the editor. You can also display the connected text by clicking the Connected Data (connected-data-icon.png) icon.

Note

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, {{content_library.global}}.

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 (inline-binding-icon.png) 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.

Note

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
Disconnect a Widget

To disconnect a widget:

  1. Right-click the widget, and click Change connection.

  2. In the menu, select None.

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.

Disconnect Data to SEO Settings and the Header HTML

To disconnect SEO settings and the header HTML:

  1. In the side panel, click Pages, then click the settings (three_dots_horiz_icon.png) icon for the desired dynamic page.

  2. Click Edit Page SEO.

  3. Click the Connect Data (connected_data_icon.png) 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.

Edit Data

The content that is being synced through Connected Data can be edited directly in the pop up, in the Content Library, or in the external source (connected to the Content Library) to which it is connected. Remember to republish the site after you make the changes. The design of the connected site elements can be changed at any point.

Connected Templates

Connected Data is not just for your site, it is for each and every template you build. The more you use it in your templates, the easier it is for you to move between them and update data.

Create Connected Template

A template is turned into a connected template by connecting the widgets in the template to the Content Library. A benefit to using a connected template is each time you create a site with the template, all connected elements are automatically populated by data in that site’s Content Library. This saves you time, as opposed to manually entering content into each individual widget on your site. In addition, you only have to update content once in the Content Library and it will update across all relevant connected widgets. For example, if your business phone number changes you can update it in the Content Library once and all connected widgets that display the business phone number will be updated.

To create a connected template you need to create a template, then connect the elements in the template to the Content Library.

Step 1: Create Template

To create a template:

  1. Log in to your account to access your Dashboard.

  2. Click Create New Site.

  3. At the top of the page, click Create Template.

  4. Browse the list of templates to find one you can use as a starting point for your design. You can hover over a template and click Preview to view the template on desktop, tablet, and mobile screen sizes.

  5. Once you know which template you want to use, hover over it and click Create & Customize.

  6. Type a name in the Template name field, then click Create & Customize. The name you type here is what will appear in the Custom Templates section.

  7. Customize your template in the editor by adding pages and widgets.

  8. In the side panel, click Content, then click Business Info and enter placeholder data. Do the same for Business Text and Business Images. The purpose of adding placeholder data is to give the widgets data to connect to in the next step, Connect Template Widgets to Content Library.

Next, you need to connect the widgets in your template to the placeholder data you entered in the Content Library.

Step 2: Connect Template Widgets to Content Library

To connect data to site widgets:

  1. Right-click the widget you want to connect to a data field.

  2. From the context menu, click Connect to data.

  3. In the Connect Data dialog, select the data field that you want to connect this widget to.

  4. Any widget you successfully connect to the data in the Content Library is marked with a blue Connected Data (connected-data-icon.png) icon.

When you are finished customizing the template design and connecting widgets, click Done in the upper right corner.

The template will be saved in the Custom Templates section of the template selection page.

Troubleshooting

  • If you do not see the Connected Data option in a widget’s context menu, it could be that the Content Library is empty. Make sure there is data here.

  • If you do not see a label you are looking for in the menu, double-check that the Content Library element you created with this label has content. You can only connect to empty labels in Template mode.

  • If you do not see updated data in a specific widget, make sure the widget is connected to the correct label.