Skip to navigation

Making text editable with template tags

In a custom HTML template, you can use tags to specify which elements may be edited when creating a campaign. For text, use <lp-singleline> for a single line and <lp-multiline> for a block of multiple lines. The text you place between the tags will appear in the editor as the default value.

These tags only apply to an imported HTML template, not to the drag & drop editor. You can read how to import such a template in Importing your own HTML template.

A single line with <lp-singleline>

Use <lp-singleline> to make a short piece of text editable, such as a heading or a caption.

When filling in the template, the editor can add a link to the text and adjust the alignment (left, right or centre). If the tag in your HTML is already inside a link, the editor will use that link as the default value. Apart from this, no design changes are possible by design.

Options

You can use five attributes to determine what the editor can do with the line.

lp-label

Shows the value of this attribute in the editor above the text field.

lp-disable-href

Disables the option to turn the line into a link. If there was already a link around the line in the template, it can no longer be edited.

lp-toc

Places this line in the table of contents by default, including all repetitions if the line is inside a repeater. When filling in the newsletter, the editor can still choose for each individual line whether to include it in the table of contents.

lp-disable-align

Disables adjusting the alignment.

lp-toolbar

Restricts the alignment options, for example to left and right only: lp-toolbar="alignLeft,alignRight". The possible values are alignLeft, alignRight and alignCenter. Specifying a single value serves no purpose, and specifying all three is the same as omitting the attribute.

Examples

A heading that the editor can turn into a link in the editor:

<h2><lp-singleline lp-label="Heading above newsletter">The latest news</lp-singleline></h2>

The same heading with a fixed link that cannot be edited. Note that the a tags are placed outside the singleline:

<a href="http://example.net"><lp-singleline lp-label="Heading above newsletter" lp-disable-href>The latest news</lp-singleline></a>

A text block with <lp-multiline>

Use <lp-multiline> for multiple lines of text, such as a paragraph. When the editor clicks on this element, an editor opens where they can format the text and insert links, subscriber variables, social media and more.

A multiline can also contain an image. The text will wrap around it, and when editing, the editor can place the image on the left, on the right or across the full width. You can read how to set this up in your template in Making images editable with template tags.

Options

lp-label

Shows the value of this attribute above the text field editor.

lp-toolbar

Determines which buttons are shown in the editor toolbar. Without this attribute, all twelve buttons are shown. If you specify a few values, only those buttons will be visible.

These are the twelve values for lp-toolbar:

ValueButton
boldbold
italicitalic
strikestrikethrough
linklink
bulletListbulleted list
orderedListnumbered list
heading2heading 2
heading3heading 3
alignLeftalign left
alignCentercentre
alignRightalign right
separatordivider line between buttons

Examples

A paragraph that appears in the editor under the label ‘Main paragraph’:

<lp-multiline lp-label="Main paragraph">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</lp-multiline>

A toolbar with only bold, italic, a link and two headings, with a divider line in between:

<lp-multiline lp-label="Main paragraph" lp-toolbar="bold,italic,link,separator,heading2,heading3">Lorem ipsum</lp-multiline>