Connected Data allows you to connect site s to data that is maintained in external sources and/or inside the site’s My Images & Files. 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 s are connected through Connected Data, you no longer need to manually change the data in each of the s as they are controlled through the Content Library.
Collect and Edit Data
In order to connect My Images & Files. There are several ways of adding data to the My Images & Files:
s through Connected Data, the content must be stored in the- Manually. In the left panel, click Content to go to the My Images & Files and add content: business information (addresses, phone numbers, social links, and so on), text, images, and more.
- Collect from Client Form. All content your customer includes in the content collection form is added automatically to the My Images & Files.
-
API. Use the My Images & Files API to push content to the My Images & Files and connect it to the different site s. This is especially useful if you keep business data in an external source (for example, Salesforce, your own contact form, and so on).
If you are populating the My Images & Files through the API, remember that the site can be republished directly through the API as well.
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
Make sure the labels you choose are meaningful and unique. This helps you easily pick which content element should connect to which and help prevent changing the label in the future. Changing the My Images & Files label while a is connected will disconnect the .
on the site. - Content. The information (for example, text, image, phone) that is in the My Images & Files and once connected to a displays on the site.
You can populate the My Images & Files with two types of content: text and images. Each text section in the Business info can contain up to 4000 characters.
Some My Images & Files 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 Data
The data you can connect to the
s on your site is summarized in the following table:Widgets | My Images & Files Data |
---|---|
Text: paragraph, titles |
Business text: all options Business info:
|
Icon |
|
Image |
Business info (link):
|
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 Widgets (Connected Data only) |
|
Photo gallery |
Collections (Image, Description, Title, Link, Link Text, and Image Alt Text) |
Image slider |
Collections (Image, Description, Title, Link, Link Text, and Image Alt Text) |
Media slider | Collections (Image, Description, Title, Link, Link Text, and Image Alt Text) |
List |
Collections (Image, Description, Title, Link, Link Text, and Image Alt Text) |
Background Image |
Business images:
|
Background slider | Collections |
Business hours | Update via API only |
Video Widget (Dynamic Pages only) |
Video link: YouTube, Vimeo or Dailymotion |
Text & Image Widget | Image and text |
Shape Widget |
|
Accordion Widget | Collections (Image, Description, Title, Link, Link Text, and Image Alt Text) and inline binding |
HTML Widget |
Collections:
Business info:
Business text:
|
Contact Form |
Collections: Business info:
|
Table Widget |
Collections:
|
SEO Fields
You can connect the SEO Title and SEO Description to any text field in the My Images & Files.
Connect Data to Site Elements
To connect data to site elements:
- Right-click the you want to connect to a data field.
- From the context menu, click Connect to data.
- In the Connect Data dialog, select the data field that you want to connect this to.
- Any My Images & Files is marked with a blue Connected Data () icon. you successfully connect to the data in the
If you are connecting text data, the text inherits Theme Text styles. In order to change the text style, go to the
’s design editor. The inline text editing menu is not available for text s that are connected.Edit Data
The content that is being synced through Connected Data can be edited directly in the pop up, in the My Images & Files, or in the external source 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.
Inline Binding
Inline binding is the ability to use Connected Data for a specific word or words within supported
s. The connected text can be designed and linked just like regular text.To use inline binding for text
s:- Type {{{ in the text editor to trigger the Connect Data pop up.
- Select the label you want connected.
- 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 () icon.
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}}.
To use inline binding for the Accordion
:Add an accordion widget to the desired page.
Open the
's content tab.Select any accordion item.
In the description field text box, click the Data Binding button in the top left of the toolbar.
-
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.
Disconnect Data
To disconnect a
from Connected Data:- Right-click the , and click Change connection.
- In the menu, select None.
For
s that have content editing menus, if you are already in the content editor, you can hover on the blue icon in the top-right corner and click Disconnect.Disconnecting a
reverts the text and its style to the previously used style.Dynamic Filters
You can use Dynamic filters to filter widgets that are connected to collections in dynamic pages. This allows you to display only the content that is relevant to a page item. Dynamic filters are available for every widget that connects to a collection when added to dynamic pages, including: Gallery, List, Accordion, Slider, and Custom widgets and are accessible from the Connect Data popup.
To use Dynamic filters:
In the side panel, click Content, then click Collections.
-
Click +Create Collection and create 2 collections:
Data collection. Contains your data with a category name field. In step 9 this collection is referenced as Collection A.
Categories collection. Contains all the categories and their details (category name, image, etc). In step 9 this collection is referenced as Collection B.
In the side panel, click Pages, then click +New Page.
Create a Dynamic Page from each collection you created in step 2.
Navigate to a regular page of your choice and in the side panel, click Widgets, then drag and drop the Gallery widget onto the page.
Right-click the Gallery widget to open the settings menu, and click Connect to Data. Connect it to the categories collection you created in step 2. Map the link field to its Dynamic Page.
Navigate to the categories Dynamic Page and in the side panel, click Widgets, then drag and drop the Gallery widget onto the page.
Right-click the Gallery widget to open the settings menu, and click Connect to Data. Connect it to the data collection you created in step 2. Before closing the Connected Data popup, open the Filter & Sort tab and in the Dynamic Filter section click +Add Filter.
Map between the category name field in the data collection (Collection A) and the category name field in the categories collection (Collection B).
Troubleshooting
- If you do not see the Connected Data option in a My Images & Files is empty. Make sure there is data here. ’s context menu, it could be that the
- If you do not see a label you are looking for in the menu, double-check that the My Images & Files 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 , make sure the is connected to the correct label.