Accordions for DMS

The Way You Want Them

Purchase on Pagelines

Accordion Features

Each accordion is a separate post that is assigned to an accordions set (category).

Screenshot_1_5_13_8_57_AM

 

 

Write each accordion as you would a post or a page adding media, formatting text and even using shortcodes within the accordion.

Screenshot_1_5_13_4_35_PM

 

 

Have multiple accordion sets to display on one page, it’s easy with Accordions.  And, you can have different options for each accordion set (like different colored accordion sets).

Screenshot_1_5_13_4_42_PM

 

 

Just install the Post Type Order Plugin from the WordPress Repository and easily change the order of accordions in your accordion set.

Screenshot_1_5_13_4_56_PM

Customize the text and background colors for your Accordions Section.  Or, if you are displaying more than one set of Accordions on your page, different colors for each accordion set.

Screenshot_1_5_13_11_23_AM

 

Screenshot_1_5_13_11_24_AM

Click on an accordion, it opens, click on the next accordion in the section…you can have the previous accordion collapse back down (default) or have it stay open.

Screenshot_1_5_13_5_00_PM

Accordions Directions

NOTE: Directions still show options for Pagelines V2. New directions will be posted in the next few days

Accordion Sets

There are two ways to create a new accordion set category:

Through Accordion Sets under the Accordions Menu

Screenshot_1_5_13_8_50_AM-2

 

Screenshot_1_5_13_8_51_AM

 

Or you can create an Accordion Set when adding a new accordion

Screenshot_1_5_13_8_57_AM

 

 

Screenshot_1_5_13_8_58_AMScreenshot_1_5_13_8_59_AM

 

 

Accordions are easy to create.  Go to Accordions –> Add New Accordion

Screenshot_1_5_13_8_57_AM

 

Screenshot_1_5_13_9_20_AM

 

Now, give your Accordion a title and add your content.  You can add media, use shortcodes and style your text just like you were writing a post or page.

Select an Accordion Set or Sets the accordion belongs to.  You can also create a new Accordion Set here as well.

Screenshot_1_5_13_9_23_AM

 

And, when you are done, click on Publish.

Add or edit a page that you want the Accordion Set to display.  Make sure the template has the Accordions Section active.  If you are changing the template under Page Attributes you need to either Save Draft or Publish for the template to change.  I’ve create a page and saved the draft with Template 4.

Screenshot_1_5_13_10_03_AM-4

 

 

Scroll down to Pagelines Meta Settings and select Accordions

Screenshot_1_5_13_10_09_AM

 

Select your Accordion Set and give it a title if you want.

Screenshot_1_5_13_10_24_AM

There are other options but let’s publish our page and see what the Accordion Set looks like.

Screenshot_1_5_13_10_28_AM

Accordion Options

The first option is to select the accordion set to display in the section.

Screenshot_1_5_13_11_45_AM

 

 

If you want to display more than one accordion set you can clone the Accordions Section in Pagelines –> Drag & Drop.

Optionally, you can title the Accordions Section.  This is helpful if you are displaying more than one Accordions Section on a page.

Screenshot_1_5_13_11_49_AM

Accordions let’s you select the display order of your accordions in the accordion set or you can use the Post Type Order plugin and re-order your accordions in the order you want them to display.

Screenshot_1_5_13_10_38_AM

By default an an accordion set, the open accordion will close when another is opened.  You can change this behavior by checking the box “Keep Accordion Open.”

Screenshot_1_5_13_11_18_AM

 

For Accordion Sets that have long accordions there is an option to scroll the accordion to the top of the content.  The Accordion Sets on this page are long so scrolling is set. Useful for mobile devices!

Screenshot_1_7_13_9_35_AM

Accordions is setup to display your accordion sets in a neutral gray color.

Screenshot_1_5_13_11_25_AM

You can easily change the colors using color options

Screenshot_1_5_13_11_20_AM

 

 

 

Here I am going to change the title text and title background colors.

Screenshot_1_5_13_11_23_AM

 

The end result

Screenshot_1_5_13_11_24_AM

Additional Directions

You may want to display multiple accordion sets in your sidebar yet Pagelines –> Page Options only lets you select the default for one set.  To overcome this obstacle, go to a page using the Accordions Section and you will see your Accordions Clone also showing in Pagelines Meta Options.  There you can control the options even though it is not displayed on the page.

Screenshot_1_18_13_12_34_PM

Accordions can also be in your sidebar and/or sidebar wrap.  It is important to use a clone of the Accordions Section if you have Accordions active on the template, otherwise the opening and closing behavior of the accordions will not work properly.

Go to Pagelines –> Drag & Drop and select the sidebar area you want your Accordions Section. Here Sidebar Wrap is selected.

Now drag Accordions into the Active Sections area and open the Options. Here I have placed in in Sidebar 1.

Screenshot_1_18_13_12_12_PM

 

Now, clone the Accordions Section and then leave the cloned Accordions Section in the Active Sections and drag out the original Accordions Section.

Screenshot_1_18_13_12_14_PM

 

Since I am already using 3 Accordions Sections on my site, the clone is Accordions #4.

To select the Accordions Set to display and the options go to Pagelines –> Page Options, click on Site Defaults and Accordions.

Screenshot_1_18_13_12_23_PM-2

 

Now, select your Accordion Set and any options you want to change.  Your Accordions will now be in your sidebar.

Now create a page using the template with the Accordions Sections active and scroll down to Pagelines Meta Settings. There you will see the Accordions Section and the clone(s) you created.  Here I have three on a page.

Screenshot_1_18_13_11_58_AM

 

Each Accordions Section has its own options so you can have different colored accordions and such.

Screenshot_1_18_13_12_03_PM

 

In order to have more than one Accordion Set on a page you need to clone the Accordions Section in your template.  This is also true if you want to have an Accordions Set in your sidebar or sidebar wrap.

To clone the Accordions Section go to Pagelines -> Drag & Drop and select the template where your Accordion Sets will be.

Screenshot_1_18_13_11_50_AM

 

I’ve dragged the Accordion Section into my Active Sections and it is ready to be cloned.

Screenshot_1_18_13_11_52_AM

 

To clone the section, click on Options then Clone.

Screenshot_1_18_13_11_53_AM-2

 

Now you have Accordions and Accordions #2.

Screenshot_1_18_13_11_54_AM

 

You can clone as many times as needed and the position the sections where you want in the template.

 

Nested Accordions with Shortcode

There are two ways to create a new accordion set category:

Through Accordion Sets under the Accordions Menu

Screenshot_1_5_13_8_50_AM-2

 

Screenshot_1_5_13_8_51_AM

 

Or you can create an Accordion Set when adding a new accordion

Screenshot_1_5_13_8_57_AM

 

 

Screenshot_1_5_13_8_58_AMScreenshot_1_5_13_8_59_AM

 

 

Accordions are easy to create.  Go to Accordions –> Add New Accordion

Screenshot_1_5_13_8_57_AM

 

Screenshot_1_5_13_9_20_AM

 

Now, give your Accordion a title and add your content.  You can add media, use shortcodes and style your text just like you were writing a post or page.

Select an Accordion Set or Sets the accordion belongs to.  You can also create a new Accordion Set here as well.

Screenshot_1_5_13_9_23_AM

 

And, when you are done, click on Publish.

Add or edit a page that you want the Accordion Set to display.  Make sure the template has the Accordions Section active.  If you are changing the template under Page Attributes you need to either Save Draft or Publish for the template to change.  I’ve create a page and saved the draft with Template 4.

Screenshot_1_5_13_10_03_AM-4

 

 

Scroll down to Pagelines Meta Settings and select Accordions

Screenshot_1_5_13_10_09_AM

 

Select your Accordion Set and give it a title if you want.

Screenshot_1_5_13_10_24_AM

There are other options but let’s publish our page and see what the Accordion Set looks like.

Screenshot_1_5_13_10_28_AM

Each accordion is a separate post that is assigned to an accordions set (category).

Screenshot_1_5_13_8_57_AM

 

 

Write each accordion as you would a post or a page adding media, formatting text and even using shortcodes within the accordion.

Screenshot_1_5_13_4_35_PM

 

 

Have multiple accordion sets to display on one page, it’s easy with Accordions.  And, you can have different options for each accordion set (like different colored accordion sets).

Screenshot_1_5_13_4_42_PM

 

 

Just install the Post Type Order Plugin from the WordPress Repository and easily change the order of accordions in your accordion set.

Screenshot_1_5_13_4_56_PM

Customize the text and background colors for your Accordions Section.  Or, if you are displaying more than one set of Accordions on your page, different colors for each accordion set.

Screenshot_1_5_13_11_23_AM

 

Screenshot_1_5_13_11_24_AM

Click on an accordion, it opens, click on the next accordion in the section…you can have the previous accordion collapse back down (default) or have it stay open.

Screenshot_1_5_13_5_00_PM

 
Above Sidebar

Even in the sidebar you can select the options for the accordions.

Put brief, informative Accordions in your sidebar.

You can display Accordion Sets in your sidebar. Check out the directions.