XStandard XHTML (Strict or 1.1) WYSIWYG Editor

XStandard - Do it right. The rest will follow.

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:

NameValuesInitial valueApplies toInherited?PercentagesMedia groups
-xs-marker-labelelement-name | attr(<identifier>) | <string>element-nameh1, h2, h3, h4, h5, h6, p, blockquote, table, address, div, ul, ol, dl, a, abbr, acronym, cite, code, dfn, em, kbd, samp, strong, var, big, small, sub, sup, tt, img, object, label, q, span, [custom elements]non/aall
-xs-marker-color<color>blackh1, h2, h3, h4, h5, h6, p, blockquote, table, address, div, ul, ol, dl, a, abbr, acronym, cite, code, dfn, em, kbd, samp, strong, var, big, small, sub, sup, tt, img, object, label, q, span, [custom elements]non/ascreen
-xs-marker-background-color<color>#ffff99h1, h2, h3, h4, h5, h6, p, blockquote, table, address, div, ul, ol, dl, a, abbr, acronym, cite, code, dfn, em, kbd, samp, strong, var, big, small, sub, sup, tt, img, object, label, q, span, [custom elements]non/ascreen
-xs-marker-border-color<color>blackh1, h2, h3, h4, h5, h6, p, blockquote, table, address, div, ul, ol, dl, a, abbr, acronym, cite, code, dfn, em, kbd, samp, strong, var, big, small, sub, sup, tt, img, object, label, q, span, [custom elements]non/ascreen

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

  1. #content {
  2. -xs-marker-label: "Press release body text";
  3. }

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

  1. price {
  2. -xs-marker-label: attr(title);
  3. }

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

  1. #footer {
  2. -xs-marker-label: "Read-only: do not edit";
  3. -xs-marker-color: white;
  4. -xs-marker-background-color: red;
  5. -xs-lock: yes;
  6. }

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

  1. <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:

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

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

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

Note

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

  1. <p>
  2. Text text <span></span> text text.
  3. </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:

  1. <p>
  2. Text text <first-name></first-name> text text.
  3. </p>

Navigation

XStandard works for ...

AT&T, IBM, Microsoft, Xerox, Siemens, Philips, American Express, BP, HarperCollins Publishers, Penton, Colgate, FAA, NetIQ, Duke University Health System

What's New In XStandard Version 2.0

  • Support for OS X
  • Keyboard accessible interface
  • Find / replace
  • Support for JavaScript events
  • Enhancements to image and attachment libraries
  • Enhancements to table creation
  • Support for authoring definition lists
  • Ability to save images from the editor to My Computer

Full details on all new features

Most Popular FREE Downloads

  1. XStandard WYSIWYG Editor
  2. HTTP component
  3. ZIP component
  4. Image size component
  5. Base64 component