Defining a visibility condition
You can specify a visibility condition on a web page element: this element will only be visible if the condition is respected.
To add a visibility condition, select a block and enter the condition in the Visibility condition field using the expression editor.
Advanced expression editing is presented on this page .
These conditions adopt the XTK expression syntax (for example ctx.recipient.@email != "" or ctx.recipient.@status=="0" ). By default, all fields are visible.
Non-visible dynamic blocks, such as drop-down menus, cannot be edited.
Adding a border and background
You can add a border to a selected block. The borders are defined using three options: style, size and color.
You can also define a background color by selecting a color from the color chart.
Changing the data properties for a form
You can link database fields with input zone, radio button or checkbox type blocks.
The default fields are those in the Web application storage schema.
The field input zone lets you select a database field to link with the form field.
By default, the fields offered are those in the nms:recipient table.
The Required field option lets you only authorize the page's approval if the user has filled in the field. If a required field is not filled in, an error message will appear.
For radio buttons and checkboxes, additional configuration is required .
Indeed, if the template used does not contain a value by default, you must complete it in the editor.
To do this:
- Click the Edit icon.
- Enter the itemized list value (defined by the selected field) into the Value field.
Modifying form fields
Form fields such as radio buttons, input zones, drop-down lists, etc. can be modified from their toolbars.
This means you can:
- Delete the block containing the form fields using the Delete icon.
- Duplicate the selected field by creating a new block using the Duplicate icon.
- Edit the Form data window to link a database field to the form zone, using the Edit icon.
Changing font attributes
When you select a text element, you can modify font attributes (style, format).
The available options are as follows:
- Enlarge font icon: increases the size of the selected text (add <span style="font size:"> )
- Reduce font icon: reduces the size of the selected text (add <span style="font size:"> )
- Bold icon: makes selected text bold (wrap text with the <strong> </strong> tag)
- Italic icon: makes selected text italic (wrap text with the <em> </em> tag)
- Underline icon: makes selected text underlined (wrap text with the <span style="text-decoration: underline;"> tag)
- Align left icon: aligns text to the left of the selected block (add style="text-align: left;")
- Center icon: centers the text for the selected block (add style="text-align: center;")
- Align right icon: aligns text to the right of the selected block (add style="text-align: right;")
- Change the background color icon: lets you change the background color for the selected block (add style="background-color: rgba(170, 86, 255, 0.87))
- Change text color icon: lets you change the text color of the selected block or just the selected text ( <span style="color: #CODE"> )
- Delete icon: deletes the block and all its content.
- Duplicate icon: duplicates the block as well as all the styles related to the block.
Managing images and animations
The Digital Content Editor lets you work on any type of image compatible with browsers.
To be compatible with the DCE, "Flash" type animations must be inserted into an HTML page in the following way:
<object type="application/x-shockwave-flash" data="https://www.mydomain.com/flash/your_animation.swf" width="200" height="400"> <param name="movie" value="https://www.mydomain.com/flash/your_animation.swf" /> <param name="quality" value="high" /> <param name="play" value="true"/> <param name="loop" value="true"/> </object>
You must not call up external files in a script tag of the HTML page. These files will not be imported onto the Adobe Campaign server.
Adding / Deleting / Duplicating an image
To insert an image, select an Image type block and click the Image icon.
Select an image file saved locally.
The Delete icon deletes the tag containing the image.
The Duplicate icon duplicates the tag and its content.
When you duplicate an image, the identifiers related to the new image are deleted.
Editing image properties
When you select a block containing an image, you access the following properties:
- Caption lets you define the caption linked to the image (corresponds to the alt HTML attribute).
- Dimensions lets you specify the image size, in pixels.
Adding personalization content
Inserting a personalization field
The Personalization field option for the insert icon lets you add a database field into the content, such as the recipient's name. This option is only available for text type blocks.
By default, the fields offered are from the Recipient table. Where necessary, edit the Web application properties to select another table.
The field name appears in the editor, highlighted in yellow. It will be replaced by the profile of the targeted recipient when the personalization is generated (for example, when previewing a landing page).
An example is presented in the Inserting a personalization field section.
Inserting a personalization block
The Personalization block option lets you insert dynamic and personalized blocks into the content. For example, you can add a logo or a greeting message. It is not available for Text type blocks.
Once inserted, the personalization block name appears in the editor, highlighted in yellow. It is automatically adapted to the recipient profile when personalization is generated.
For more on built-in personalization blocks and how to define custom personalization blocks, refer to this page .