Share

To Link to a Collapsible Section

Create an anchored link to the collapsible section using the collapsible section's anchor id.

When such a link is clicked, the topic is opened in the browser, and the browser navigates to, and expands, the corresponding collapsible section.

However, to be able to link to a collapsible section, it must first have an anchor id assigned to it.

To assign an anchor id to a collapsible section (Markdown)

Append the desired anchor id to the label of the collapsible section's style helper.

For example, a collapsible section is defined with a style helper with the label ui-x-collapsible such as

{{#style "ui-x-collapsible"}}
...
{{/style}}

To assign the anchor id "anchor-to-collapsible-section" to such a collapsible section, append the label ui-x-collapsible with anchor-to-collapsible-section such as

{{#style "ui-x-collapsible anchor-to-collapsible-section"}}
...
{{/style}}

To assign an anchor id to a collapsible section (DITA)

Append the desired anchor id to the collapsible section's outputclass attribute.

For example, a collapsible section is defined with a section element with the outputclass ui-x-collapsible such as

<section outputclass="ui-x-collapsible" id="GUID-28344292-FC3C-4603-8C7B-396CAC825F93">
...
</section>

To assign the anchor id "anchor-to-collapsible-section" to such a collapsible section, append the outputclass attribute value ui-x-collapsible with anchor-to-collapsible-section such as

<section outputclass="ui-x-collapsible anchor-to-collapsible-section" id="GUID-28344292-FC3C-4603-8C7B-396CAC825F93">
...
</section>
Note: An existing id value will be replaced by the anchor id in the resulting HTML markup.

Here is an example anchor link to the collapsible section with id "anchor-to-collapsible-section"

Markdown for the preceding example link:

Here is an example anchor link to the [collapsible section with id "anchor-to-collapsible-section"](collapsible-section.html#anchor-to-collpasible-section)

Was this information helpful?