Phlox Accordion

With Phlox Accordion Widget, you can create multiple section in a vertical list box. The sections or elements come with label and content. Each section is expandable and by clicking on the section title, the content will be displayed.

Follow below steps to add Phlox Accordion Widget to a widget area or in a page content:

  1. Go to your WordPress admin panel
  2. Click on the Appearance on the Dashboard
  3. Then click on the Widgets
  4. Find [Phlox] Accordion among the available widgets and add it to your desired Widget Area

Video Tutorial

Access Accordion Options in Elementor Page Builder

  1. Go to your WordPress Admin Panel
  2. Click the Pages on the Dashboard
  3. Click the Add New
  4. Navigate to the top left hand of the WordPress text-box and find Edit with Elementor button.
  5. Check out Elements
  6. Scroll down to PHLOX - GENERAL section
  7. Choose Accordion
After adding accordion to your post or page, you are able to customize it by available options:

  • Content

Accordion Items

This section lets you add, duplicate, or remove an accordion item. After that, you can select the accordion item you want and change its Title & Content.

Type

There are two types of accordion: Accordion (auto close other open tabs) and Toggle Accordion expands the sections one at a time and when you open a new section, the previous one will be closed. Toggle, however, can expand all the sections without closing any of them.

Title HTML Tag

With this option, you are able to change the title from H1 to H6. It can be div or section, too.

 

  • Style

Title Bar

You can change many options on this section. When you hover over title bar, your Mouse Curser can be Default, Pointer, Zoom, and Help.

Paddings, Margins, and Border Radius can be changed. Also, you can set different paddings and margins on mobile and tablet.

Box Shadow and Border Type of title bar has different settings. This section lets you change these on Normal, Hover, or Selected mode. Width and Color are editable and Background Type can be Classic or Gradient.

Title

You can change the Color and Typography of the title on Normal or Hover.

Content

Many options are available here that let you change Typography, Color, Paddings, Margins, Border Radius, Size and Position of accordion content. Besides, you can set a Background for your content.

Check out this article to know more about Advanced tab and start working with Elementor.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.