A Content interaction allows you to manipulate existing content (images, text) on a web page and replace it by other content.
This example shows a BlueConic Content interaction:
Configuring a Content interaction
Content property settings
Content styling settings
To use content styling settings, open the Properties widget in the right hand side of the page and use the Styling settings pulldown menu.
These are the styling options:
Contents: Click Load examples to see prebuilt content templates you can customize to create forms, collect email addresses, manage privacy, offer customer codes/coupons, manage subscriptions, launch a survey, or deliver a text message. You can also add a new example of your own in the Load examples window.
CSS URL: Enter the URL of an external CSS library.
CSS styling: Enter custom CSS to add styling to your content interaction.
This URL will be loaded for this specific interaction and will only be added on the frontend page and the BlueConic simulator.
The advanced settings option is relevant when you want to register conversions for this content interaction. To register a conversion, BlueConic needs to register a click event first:
Click event selector: Select an element in the page to register a click for this dialogue if the visitor or customer clicks the selected element. Use the Visual picker to choose a position on the page. A visual picker page opens where you can select the position. Learn more about selecting a content position to register a click event using the Visual picker.
Note that there are several instances where you do not need to specify a click event selector. See the What tab documentation for Dialogues for details.
Keeping up with content changes
When you select a position on the page to be used for the content interaction, the original content of that position will be the starting value of your content interaction. The original content is copied to BlueConic and now part of this content interaction. This means that future changes in the original page will not be reflected in this content interaction, but will be replaced by the content that you have edited and saved for this interaction.
Using prebuilt content examples
To make it easier to build content interactions, you can use the prebuilt content examples in the Properties widget on the righthand side of the page, under Styling settings > Contents > Load examples. Clicking Load examples open a popup window of samples you can use to get started. You can add your own examples by selecting Add new example in the popup window.
For example, to create a content area where you can collect customers' email addresses, choose "Collect email address" from the Load examples window. A warning message informs you that the new content will replace any existing content in the selected position. If you select OK, the new content fills the selected position, and you can customize it as needed.
Note that the form is part of the content and can be edited as well! Click the field to modify the form.