Using the content editor

As you create content in BlueConic, you can edit content in these two modes:

  1. The in-line editor
    This mode allows you to directly edit text and graphics within the context of a webpage. This means you can directly view the effect of other elements on the page, such as external stylesheets. It is available in the content and lightbox dialogue types.How to use the BlueConic content editor in the customer data platform
  2. The rich text editor
    This mode allows you to edit text and graphics in a separate window. It is available as fallback option, when in-line editing is not possible. It is also used for the email dialogue type.How to use the BlueConic text editor and WYSIWYG editor to create content in dialogues

If you need to, you can also switch to HTML-mode to directly view or modify the source code.

In this section

Formatting the text
Inserting, editing, and replacing images
Inserting and editing hyperlinks
Insert profile property values
Switching edit modes
Viewing or modifying the HTML source code


Formatting the text

You can format the text in rich text editor using standard formatting such as bold, italic, bulleted lists, and so forth. Most of the formatting options in the toolbar are straightforward. If you want to know what a specific button does, hover over it with the mouse and a tooltip will appear. For example:

How do I format text in the BlueConic CDP dialogues and interactions?

You can apply formatting to all text, hyperlinks, and profile properties that appear in the content.

 


Inserting, editing, and replacing images

By clicking on the "insert image" button in the toolbar you will open a window where you can select an image or drag and drop it.
How do I add images to BlueConic dialogues and forms?How do I add an image in BlueConic?

After uploading an image you can edit the image.

How do I edit images in the BlueConic content editor?

 

General settings

These are the general settings you can make in this window:

Name Name of the selected image file. To change the image, select replace.
Title Title of the image. This is the text that will appear in a tooltip if you hover over the image.
Alt Text The Alt Text is used as an alternative for the image in text-oriented browsers.
Link If you add a link, the image becomes clickable and readers are forwarded to the entered URL. Here you can also configure profile properties that need to be set when people click this image.

 

Width and height

You can select the part of the image that needs to be displayed by changing the crop area in the image preview. The ratio of that crop area will be influenced by the selection you make in the width and height settings:

Width of the position The image will be scaled to fit the width of the position. The crop area can be chosen without limitations.
Dimensions of the position The image will be scaled to fit the dimensions of the position. The ratio of the crop area is fixed and you can only resize this area proportionally.
Dimensions of the previous image This option is only available if the image window is opened to edit an existing image. The image will be scaled to fit the dimensions of the original image. The ratio of the crop area is fixed and you can only resize this area proportionally.
Custom Here you can specify the exact size to which the image need to be scaled. The following situations can occur:
  • Both width and height are specified: The crop area has a fixed ratio and can only be resized proportionally.
  • Only width or height are specified: You can freely select a crop area. The image will be scaled to specified height or width.
  • No width and no height is specified: You can freely select a crop area. The image will not be scaled but displayed in the original resolution of the crop area.

 

You can also enter the edit image window by selecting an image in your content and then click the "edit" option below the image, or by double clicking it:

How to edit images and options in the BlueConic inline editor


Inserting and editing hyperlinks

You can insert hyperlinks to the content that leads to the specified URL when a visitor clicks the link. You also have the option to edit existing hyperlinks in the content. You can do this by clicking on the "insert hyperlink" button in the toolbar after highlighting the text that you want to link, or clicking on "edit" when you have selected an existing hyperlink.

How do I add hyperlinks and links in the BlueConic dialogues and forms content editor?

This will open up the edit hyperlink window:

How do I edit hyperlinks in the BlueConic content editor?

The following settings can be configured:

Link Text The actual text that is shown on the screen and that can be clicked.
Target URL The URL that the visitor should be directed to after clicking.
Profile property rules You have the option to add values to one or more profile properties when a visitor clicks this specific link. Add a rule for every profile property value that you want to add.

 

In the same way you can also add or edit hyperlinks to images in your content. This can be done in the insert or edit image window.

 


Personalizing content

Personalize a piece of content by adding profile property values inline with the text in the editor. To do so, follow the steps below.

  1. Click the Select Personalize button:

    How do I use the Personalize button to created individualized marketing in BlueConic?

    The Select Profile Property dialog box appears:

    How do I select profie properties to personalize content in BlueConic?
  2. Select the profile property whose value should be displayed.
  3. Click [Apply]. The profile property is added to the item you are working with as a placeholder item. The value of the profile property will appear at the location of the placeholder.

 

 


Additional edit modes

If you are working in the inline view you can open an additional rich text editor window by selecting the "Rich Text" button. Changes in the rich text editing window are immediately reflected in the inline view.

How do I use the Rich Text editor in BlueConic?

As an alternative to the rich text window you can also switch to the html-mode by clicking on the "HTML" button.

How do I edit HTML in BlueConic?


Inserting objects

You can also insert objects into the content by using the "Insert object" menu:

How do I insert objects into dialogues and forms content in BlueConic?

Which objects are available depends on which toolbar plugins have been installed in BlueConic.

 


Viewing or modifying the HTML source code

When you enter text in the editor, it appears as normal text, however it is actually formatted HTML code. If you select the "HTML" button in the toolbar of the editor, an extra window opens containing the source code of content that you are editing. Here you can add text to the content and modify the HTML markup. Changes that you make in the source code will immediately be reflected in the editing window. You can move the HTML window to any location in your screen that is convenient to you.

Back to top