EditLive! for XML includes extensive support for the embedding of custom tags within HTML. As part of the support of EditLive! for XML for custom tags in HTML developers can provide custom rendering for these tags. Ephox CSS extensions can are used to customize the rendering of these tags. The styles with which custom tag rendering is specified in EditLive! for XML can be provided either as an external, linked style sheet or through an embedded style sheet. For more information on using style sheets with EditLive! for XML please see the section on Ephox EditLive! for XML and CSS.
Inline style information should not be used to specify rendering for a custom tag.
A CSS style can be used to specify the way in which a custom tag is to be rendered. The style should match the name of the custom tag. Developers can specify whether the custom tag is rendered as an inline (e.g. <SPAN>), block (e.g. <P>) or empty tag (e.g. <IMG>). Furthermore icons and labels can be specified to be used for rendering the tag.
Example 6.1. Declaring a CSS Style for Rendering a Custom Tag
The following example demonstrates how to specify rendering information for the custom tag <MyTag> and its closing tag </MyTag>. The icon myicon.jpg (mapped to by the URL http://www.server.com/icons/myicon.jpg), the start label Custom Tag and end label /Custom Tag are specified for rendering the custom tag. Also, the custom tag is displayed as a block tag.
When specifying a custom tag to be used with EditLive! for XML the display attribute must be assigned. The value of the display attribute affects the way in which the custom tag is processed by EditLive! for XML. For more information see the reference on the display attribute.
MyTag{
display: block;
ephox-icon: url(http://www.server.com/icons/myicon.jpg);
ephox-start-label: Custom Tag;
ephox-end-label: /Custom Tag
}For more information on the Ephox CSS Extensions for Custom Tags please see the chapter titled Ephox CSS Extensions for Custom Tags.
Copyright 2001-2005 Ephox Corporation. All Rights Reserved.