Accordion for SharePoint, Office 365
and SAP Portal

Add Accordion Element to your SharePoint sites and pages.
Use this ShortPoint if you want to show content in your SharePoint page as accordion display. Its useful to create FAQ pages
Live Preview

Accordion Examples

Accordion – Basic Usage

Accordion 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam vel dapibus turpis. Etiam viverra dolor ante, eget interdum arcu mollis in. Nam eu feugiat tortor. Integer sed sagittis arcu. Donec venenatis neque eget dolor porta, non vestibulum massa posuere. Etiam pellentesque, libero non eleifend scelerisque, lacus ipsum lacinia ipsum, ut vulputate orci tortor ut elit. Nullam vitae diam velit.

Accordion 2

In accumsan risus sed tortor dignissim, nec vehicula arcu dapibus. Ut pellentesque eget lacus quis dictum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris tortor lorem, tempor non justo id, mollis ornare mauris. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nunc venenatis a justo a vehicula. Phasellus accumsan ultricies dolor, at accumsan sapien lobortis tincidunt. Proin pulvinar sit amet diam ut commodo.

Accordion 3

Nam id vehicula turpis. Donec vel ante placerat, suscipit quam ac, ultrices lacus. Donec dolor risus, laoreet non massa sed, fermentum viverra libero. Curabitur a ante nulla. Aliquam ultrices, elit vel ultrices sollicitudin, dui lectus sagittis sapien, id euismod dui lorem nec massa. Integer sed sem molestie, convallis purus ac, pharetra arcu. Aliquam nec blandit justo, a lobortis lectus. Praesent euismod, tortor id dapibus fringilla, turpis augue malesuada erat, non cursus ante augue sed justo. Phasellus sit amet consectetur justo. Quisque tincidunt euismod rhoncus. Sed varius massa vitae magna lobortis, non condimentum justo ullamcorper.

Accordion – Without Divider

Accordion 1

Accordion 2

Accordion 3

Accordion – Icon Location

Accordion 1

Accordion 2

Accordion 3

Accordion – Different Colors

Color Danger

Accordion 1

Accordion 2

Accordion 3

Color Green

Accordion 1

Accordion 2

Accordion 3

Accordion – Custom Icons

Accordion 1

Accordion 2

Accordion 3

Accordion – Open By Default

Accordion 1

Accordion 2

Accordion 3

Accordion Features

Add Accordion

All what you need to do is just type the title and add some content.

Accordions ShortPoint Options

Option	Value	Default	Description
no-divider	–	–	Divider will not be used to as separator between accordions
right	–	–	Icon location will be on the right
left	–	–	Icon location will be on the left Useful in RTL sites
color	color name	primary	the active accordion color and hover style all colors available at ShortPoint Colors page
open	number	–	Open the accordion by its order location
icon-open	icon name	icon-plus-square-o	accordion open icon all icons available at Shortpoint Icons page
icon-close	icon name	icon-minus-square-o	accordion close icon all icons available at Shortpoint Icons page

Accordion ShortPoint Options

Option	Value	Default	Description
title	“text”		Required! Accordion title

Why Two Option Tables? Because this ShortPoint consist of two ShortPoints (Parent and Childs). The accordion shortpoint should be inside accordions shortpoint. Thats why we have to describe the options you can use in each one.