DITA Best Practices : outputclass and Transformations

What is outputclass?

When you need an element to appear differently in the output from other elements with the same semantics (elements and attributes), you can provide a value in the element's outputclass attribute.

Most block and phrase elements in DITA have an outputclass attribute. This attribute is used to provide output styling information, when necessary.

When published to an HTML-based output format, the value in the outputclass attribute of an element will be passed through to the CSS class attribute in the HTML code.

How does InfoDev use outputclass?

The information Development team uses outputclass to modify the transformed appearance of specific elements that would otherwise be transformed generically. The purpose is to provide a specific outcome when no other element or attribute is available "out of the box" to meet the need.

The file that controls the code completion: D:\frameworks\dita\resources\cc_config.xml

Custom outputclass within WKFS Transformations

The following is a list of the custom outputclass options available for use within WKFS InfoDev transformations.

outputclass Name	Element applied to	Result	Example (click image for larger view)
QA_	div	Creates a container for the question and answer DIVs. This consists of a rounded blue border.
QA_q	div	Formats the div as a question, including inserting the leading "Q:"
QA_a	div	Formats the div as an answer, including inserting the leading "A:"
title_sectiondiv	p	Transforms p element to section title
btn_revision	ph	Transforms ph element to button
bottomrulethin	section	Places a thin black horizontal rule below section
bottomrulemedium	section	Places a medium black horizontal rule below section
bottomrulethick	section	Places a thick black horizontal rule below section
toprulethin	section	Places a thin black horizontal rule above section
toprulemedium	section	Places a medium black horizontal rule above section
toprulethick	section	Places a thick black horizontal rule above section
rntitle	stentry	Formats the text as a title (blue bold 40px) - for use with Changelogs

How to use outputclass

1. Select the element to which you wish to apply the custom transform.
2. Within the Attributes panel, double-click the Value cell of the outputclass Value entry to display the options available for the element selected.
   
   
   OR
   
   Within the Author editor pane, press Alt+Enter to display the Attributes popup form, then double-click the Value cell of the outputclass Value entry to display the options available for the element selected.
   
   
   
3. Select the desired option.