The XHTML WYSIWYG Editor For Desktop & Web Applications

Markers

In WYSIWYG mode, areas of content can be flagged with markers. Markers are labels that denote the start and end of a specific element. Markers are created using the following CSS vendor-specific extensions:

The following example displays a marker around an element with ID "content":

#content {

-xs-marker-label: "Press release body text";

}

The following example will display a marker around a custom element <price> and use the data in the title attribute for a label.

price {

-xs-marker-label: attr(title);

}

The following example displays a red color marker around a locked element:

#footer {

-xs-marker-label: "Read-only: do not edit";

-xs-marker-color: white;

-xs-marker-background-color: red;

-xs-lock: yes;

}

The marker CSS properties can be added to a CSS file that is referenced by the following <param> tag:

<param name="CSS" value="http://yourserver/format.css" />

Or they can be added to an editor specific CSS file referenced by the following <param> tag:

<param name="EditorCSS" value="http://yourserver/editor.css" />

Marker properties can also be applied at run-time. Here is a Visual Basic example:

XHTMLEditor1.EditorCSS = "h1 {-xs-marker-label: 'Heading'}"

Note

By default, content within markers is displayed inside a dashed outline. To remove the dashed outline, set the CSS border to "none". For example:

#content {

-xs-marker-label: "Press release body text";

border: none;

}

XStandard removes inline elements that have no content. For example, given the following markup:

<p>

Text text <span></span> text text.

</p>

The element <span> will be removed because it has no content. If there is a marker on the empty <span> element, the marker will be removed as well. If you require markers on inline content, use custom elements like this: