<example>

<example> is a Sectional component which renders an auto-numbered block of content. Inline components such as paragraphs <p> and other components can be nested within an <example> to group and order content. Some examples are: another <example>, a <section>, a <figure>, or a <problem>.

Attributes and Properties

Example: <example> with default title

Within a DoenetML document, default titles for sectional components are auto-numbered. Each sectional component is on the same counter.

Example: <example> with custom title

<example><title>Neat example</title>
  
  <p><lorem generateWords="10"/></p>
 
</example>

A custom <example> title is creating by providing a <title> tag within the <example>.

Example: Nesting sectional components

<example>
  <p><lorem generateWords="10"/></p>
  
  <exercise>
    <title>This is an exercise within an example</title>
    <p><lorem generateWords="10"/></p>
  </exercise>
 
</example>

A hierarchy is created by nesting one or more sectional components within an <example>.

Example: Named <example> as a parent reference

When reference names are used more than once in the same document, they can be distinguished (when outside their parent component) by attaching the name of the parent component to the reference.

Above, the <example> named birdExample is the parent of the <text> named animal. Therefore, when referencing this specific instance of the component with that name, you should use $birdExample.animal as shown.

Example: includeParentNumber

The includeParentNumber attribute is false by default for the <example> component (and true by default for the <section> component).

In order to include the number of the parent sectional component, set includeParentNumber to true.

Attribute Example: includeAutoNumber

<example><title>An important example</title>
    <p>In this section, the custom title overrides the default numbering of the section.</p>
</example>
 
<example includeAutoNumber><title>Another important thing</title>
    <p>In this section, the number of the section is still rendered in addition to the custom title.</p>
</example>

The includeAutoNumber attribute is false by default for the <example> component. This means that if a section contains a nested <title>, it will not render the default numbering (although it will still be counted in the numbering scheme behind the scenes).

In order to display the example number in addition to the custom <title>, set the includeAutoNumber attribute to true.

Attribute Example: aggregateScores and sectionWideCheckWork

The aggregateScores and sectionWideCheckWork attributes together combine validation for all <answer> components within the <example> under a single “Check Work” button.

Attribute Example: boxed

<example boxed>
  <p><lorem generateWords="10"/></p>
</example>

The boxed attribute changes the default formatting for a sectional component to one that has a border and a shaded banner for the title.

Attribute Example: hide

The hide attribute takes a boolean as input and can be used with any rendered component.