Graphical HTML Editor (Landing Pages)
- 3 Minutes to read
- Print
- DarkLight
Graphical HTML Editor (Landing Pages)
- 3 Minutes to read
- Print
- DarkLight
Article summary
Did you find this summary helpful?
Thank you for your feedback
Navigation Path
In the main mavigation, click Content > Landing Pages.
Create or Edit an existing landing page.
Go to step 2. Build & Design Landing Page and click the HTML-Editor button.
Graphical HTML Editor
The graphical HTML editor allows you to create a landing page without advanced HTML knowledge. Following the WYSIWYG (What You See Is What You Get) principle, the content display here is largely identical to what the landing page viewer sees. The content is displayed without any markup language. Moving your mouse over the symbols in the menu bar provides information about the function of each button.
Complex Personalisations are highlighted within the code with an If. All other Engage Variables and Personalisations are highlighted with a P.
When creating forms, input fields for storing personalizations are represented in the graphical HTML editor with the <ecpers be id=0></ ecpers> placeholder.
The graphical editor interface is designed for ease of use. Move the mouse over each icon in the toolbar for additional information about each.
The structure of the email is displayed at the bottom of the editor.
Complex Personalisations are highlighted within the email code with 
. All other Engage Variables and Personalisations are highlighted with 
.
Toolbar
Action | Description |
|---|---|
| Removes the last change. |
| Restores the last change. |
| Opens the Find and Replace window. Search for text with this input field. |
| Opens the Find and Replace window. Search for and replace text with these input fields. |
| Selects all the available HTML code. |
| Select text or an image in your email. Click the Link button to open a window in which the link can be defined. |
| Removes the link without removing the text or picture. |
| Inserts an anchor in your email. |
 Image | Opens the Image Properties Window. You can select an image to insert into your code in this window. For information about loading an image from the Content Store, see Use a Content Store Element in an Email. In the Advanced Settings, images are hosted in Engage (see Select Message Channel Type). |
| Select an image. Clicking the Image Map button opens the Insert/Edit Image Map window. There you can assign links to the desired areas of the image (see Insert or Edit Image Map (window)). |
| Opens the Table Properties window. This window defines the table structure. |
| Inserts an hr tag which creates a horizontal line in the email. |
| Opens the Select Special Character window. It is possible to insert special characters into your text in this window (characters such as ü, é, ß are automatically replaced and do not need to be selected in the window). |
| Opens the WYSIWYG editor without displaying the Engage navigation area. |
Font Name | This drop-down list defines which font is used to display the text. |
Font Size | This drop-down list defines the size of the font that is used to display the text. |
| Inserts a span tag which defines the colour of the text. |
| Inserts a span tag which defines the background colour of the text. |
| Inserts a strong tag which formats the font weight of the text as bold. |
| Inserts an em tag which formats the font style of the text as italic. |
| Inserts a u tag which places a line underneath the text. |
| Inserts a strike tag which places a line through the text. |
| Inserts a sub tag which places the text slightly lower than the surrounding text. |
| Inserts a sup tag which places the text half a character above the baseline. |
| Inserts or removes a li tag which creates a numbered list. |
| Inserts or removes an ul tag which creates a bulleted list. |
| Inserts a style attribute which defines the left margin. |
| Inserts a style attribute which defines the right margin. |
| Inserts a style attribute which aligns text to the left. |
| Inserts a style attribute which aligns text to the center. |
| Inserts a style attribute which aligns text to the right. |
| Inserts a style attribute which justifies both sides of the text. |
Undo
Redo
Find
Replace
Select All
Link
Unlink
Anchor
Image Map
Table
Insert Horizontal Line
Insert Special Character
Maximize
Text Colour
Background Colour
Bold
Italic
Underline
Strike Through
Subscript
Superscript
Numbered List
Bulleted List
Decrease Indent
Increase Indent
Align Left
Center
Align Right
JustifyKeyboard Shortcuts
Action | Description |
|---|---|
Ctrl+Z | Undo. |
Ctrl+Y or Ctrl+Shift+Z | Redo. |
Ctrl+L | Opens the hyperlink window. |
Ctrl+B | Bold. Inserts strong tags around the selected text to make it bold. |
Ctrl+I | Italic. Inserts em tags around the selected text to make it italic. |
Ctrl+U | Underline. Inserts u tags around the selected text to create a line under the text. |
Ctrl+C or Ctrl+Insert | Copy. Copies the selected area of the email. |
Ctrl+V or Shift+Insert | Paste. Pastes the selected area into the email. |
Ctrl+X or Shift+Delete | Cut. Removes the selected area of the email. |
Ctrl+left arrow or Ctrl+right arrow | Jumps to the previous or next word. |
Ctrl+Backspace | Deletes the previous word. |
Ctrl+Delete | Deletes the currently selected word. |
Shift+Enter | Inserts a new line in the currently selected paragraph or list item. The new line is created by a br tag. |
Alt+F10 | Moves the window focus area from the email editing area to the toolbar. |
Was this article helpful?