Paragraphs jQuery UI Accordion - Backdrop CMS - Representative image

Why should you install this module?

Sometimes you might have a page with a lot of content that the reader may not need to access all of.  A common example is a frequently asked questions page or installation instructions that might have different parts for different systems.  An accordion structure can reduce the amount of scrolling needed to find the right information, particularly on mobile devices.

Where that information is structured using Paragraphs this module allows the paragraphs in a field to be displayed in an accordion.

Features

Displays the Paragraphs of a Paragraphs field as an accordion using one text field as the Title and another simple field type as the Description:

  • Ability to use it together with other paragraphs bundles
  • Ability to use several accordions on the same page
  • Unique SEO link hashes (multilanguage support)
  • Optional autoscroll to active paragraph (admin toolbar support)
  • Configurable accordion options
  • Completely standalone and flexible (not depends on specific entity types and fields)

If you need to include more than one field as the Description or you need to include an Entity Reference field, you could use Paragraphs jQuery UI Accordion 2, which is a fork of this module that uses paragraph display modes instead of selecting an individual Description field.

Key contributions

I joined as a co-maintainer of this module at the same time as I forked this module to create Paragraphs jQuery UI Accordion 2 due to the similarities in some of the features.

  • Review, testing and feedback on community contributions
  • Fixed issue with "Start closed" and "Auto scroll" settings
  • Fixed issue with the HTML ids when multiple accordions were nested in a paragraph field.