2018.1

1. Navigate to where you want to insert the element, using the arrow keys, the mouse, the
Breadcrumbs (see "Selecting an element" below) or the Outline pane.
2.
Click the respective toolbar button. Alternatively, click the element on the Insert menu.
3. Add an ID and/or a class. ID's and classes are particularly useful with regard to variable
data (see "Personalizing Content" on page278) and styling (see "Styling templates with
CSS files" on page239).
4.
Use the Location drop-down (if available) to select where to insert the element.
l
At cursor position inserts it where the cursor is located in the template.
l
Before element inserts it before the HTML element in which the cursor is currently
located. For example if the cursor is within a paragraph, the insertion point will be
before the <p> tag.*
l
After start tag inserts it within the current HTML element, at the beginning, just after
the start tag.*
l
Before end tag inserts it within the current HTML element, at the end, just before
the end tag.*
l
After element inserts it after the element in which the cursor is currently located. For
example if the cursor is within a paragraph, the insertion point will be after the end
tag of the paragraph (</p>).*
* If the current element is located inside another element, use the Elements drop-down to
select which element is used for the insertion location. The list displays every element in
the breadcrumbs, from the current selection point down to the root of the body.
For a list of links to the different types of elements, see "Element types" on page163.
Selecting an element
When an element is selected, the Attributes pane shows the attributes of that element, and the
Styles pane, next to the Attributes pane, shows which styles are applied to it.
To select an element in the content, you can of course click on it, but this isn't always as easy
as it seems, especially when the element has elements inside it.
Tip
Click the Edges button on the toolbar to make borders of elements visible on the Design
Page 166