Features

  • Title bar text alignment
  • Use preset or custom colors
  • Adjust content padding
  • Easily re-order accordion items with drag-and-drop ease
  • Set the Accordion Items' title bar text size at each different breakpoint
  • Add an icon to individual title bars
  • Use rounded or squared corners
  • Specify which items start opened

Example


Using Accordion

Accordion Title

Font Size
Used to set the text size of the Accordion Items’ title bar. Accordion lets you set the title bar’s text size at each of the three breakpoints (Mobile, Tablet and Desktop). This allows the title to change sizes based on your visitor’s browser size or device.

Alignment
Allows you to set the justification of the Accordion Items’ title bar text. You can set the alignment to Left, Center or Right. This affects all title bars within the Accordion stack.

Title Background
Set the color of the title bar to match your site. Use one of Foundry’s color swatch presets or make use of custom color pickers to style the title bar.

Title Text
Use a color picker to set the Accordion Item’s title bar text color.

Icon Alignment
When using icons on your individual Accordion items you can choose here whether you wish the icons to show up on the left- or right-hand side of the Accordion item.

Accordion Content

Text & Background
Use two separate color pickers to set the content background and text colors for all Accordion Items.

Content Padding
Set a consistent padding around your Accordion Items’ content area to give your content room to breathe.

General

Remove Rounded Corners
Used to remove the smooth rounded corners from the Accordion Items.

Spacing
Adjust the amount of space between each of your Accordion Items to achieve a different look and feel.

Accordion Item (Child Stack)

Each Accordion Item has the ability to override some of the main Accordion stack’s features allowing you to customize them all individually to meet your specific needs. Here’s a look at the settings for the individual Accordion Item child stacks.

Start Open
Setup one, or more, of your Accordion Items to be open when the page loads, allowing your visitor to see its content right away without needing to open that particular Accordion Item.

Icon
Include an icon in an individual Accordion Item’s title bar. Choose from over 300 different icons to help customize your Accordion.

Override Colors
Make an individual Accordion Item stand out. You can adjust the title bar text and background and well as the content text and background to set one of your Accordion Items apart from the rest.

Sign up for The Forge newsletter

Stay up to date on future versions of Foundry, as well as important news, updates and more!

This site is built using Foundry for RapidWeaver

© 2006-2016 Elixir Graphics | Contact Us