SSL Labs ScoreSecurityHeaders.io ScoreHSTS Preloaded

MooAccordion - Using the plugin tag

Article Index

Using the plugin tag

One plugin tag within the content per accordion group to be modified. Groups with no modifications will be displayed with defaults. It is not necessary to include plugin options for every accordion group that you intend to be displayed with defaults.

  • id='cssid': HTML ID of the parent item which these settings will apply.
  • allowallclosed: Flags the accordion group to allow all items to be closed
  • display='number': Logical number of the item to be open by default. Note, the first item in an accordion list is 0.
  • openedclass='[classnames]': CSS classes applied to open accordion items.
  • closedclass='[classnames]': CSS classes applied to closed accordion items.
  • template='number': Pre-defined CSS template to be used on this accordion group. Using this feature overrides the openedclass and closedclass options. Three pre-defined templates are included with this plugin and are numbered 1, 2 and 3.

Examples

<div id="myaccordionid">
  <strong class="mooaccordion">Accordion Label 1</strong>
  <div>Accordion Content 1 ...</div>
  <strong class="mooaccordion">Accordion Label 2</strong>
  <div>Accordion Content 2 ...</div>
  <strong class="mooaccordion">Accordion Label 3</strong>
  <div>
    <p>Accordion Content 3 paragraph 1 ...</p>
    <p>Accordion Content 3 paragraph 2 ...</p>
  </div>
</div>
  • {content-mooaccordion id='myaccordionid' allowallclosed}
    • This accordion will be displayed with defaults and all items will be hidden.
  • {content-mooaccordion id='myaccordionid' default='2'}
    • The third item will be opened on page load.
  • {content-mooaccordion id='myaccordionid' template='2'}
    • The 2nd template will be used
  • {content-mooaccordion id='myaccordionid' openedclass='mymooopenclass'}
    • 'mymooopenclass' will be added to the toggler class list when an item is opened. When the item is closed, the class will be removed.
  • {content-mooaccordion id='myaccordionid' closedclass='mymoocloseclass'}
    • 'mymoocloseclass' will be added to the toggler class list when an item is closed. When the item is opened, the class will be removed.
  • {content-mooaccordion id='myaccordionid' closedclass='mymoocloseclass' id='myaccordionid2' template='2'}
    • Customizing 2 accordions.