Bootstrap 1
Toggles/Accordion
[toggles class="yourcustomclass"] [toggle title="Accordion number 1" class="in"]Toggle 1 content goes here.[/toggle] [toggle title="Accordion number 2"]Toggle 2 content goes here.[/toggle] [toggle title="Accordion number 3"]Toggle 3 content goes here.[/toggle] [toggle title="Accordion number 4"]Toggle 4 content goes here.[/toggle] [/toggles]
Toggle 1 content goes here.
Toggle 2 content goes here.
Toggle 3 content goes here.
Toggle 4 content goes here.
Tabs
[tabs class="yourcustomclass"] [tab title="Tab number 1" active="active"]Tab 1 content goes here.[/tab] [tab title="Tab number 2"]Tab 2 content goes here.[/tab] [tab title="Tab number 3"]Tab 3 content goes here.[/tab] [tab title="Tab number 4"]Tab 4 content goes here.[/tab] [/tabs]
Tab 1 content goes here.
Tab 2 content goes here.
Tab 3 content goes here.
Tab 4 content goes here.
List Group
[list] [li type="glyphicon-ok"]your list content[/li] [li type="glyphicon-ok"]your list content[/li] [li type="glyphicon-ok"]your list content[/li] [/list]
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
- your list content
List Group
[dl] [dlitem heading="Heading 1"]Description 1[/dlitem] [dlitem heading="Heading 2"]Description 2[/dlitem] [dlitem heading="Heading 3"]Description 3[/dlitem] [/dl]
- Heading 1
- Description 1
- Heading 2
- Description 2
- Heading 3
- Description 3
- Heading 1
- Description 1
- Heading 2
- Description 2
- Heading 3
- Description 3
Button
[button style="btn-default btn-lg" type="link" target="false" title="Button" link="#"]
Button Group Toolbar
[btngrptoolbar class="yourcustomclass"]
Button Group
[buttongroup][button style="btn-default " type="link" target="false" link="#" title="Button" ] [button style="btn-primary " type="link" target="false" link="#" title="Button" ] [button style="btn-success " type="link" target="false" link="#" title="Button" ] [button style="btn-info " type="link" target="false" link="#" title="Button" ] [button style="btn-warning " type="link" target="false" link="#" title="Button" ] [button style="btn-danger " type="link" target="false" link="#" title="Button" ] [button style="btn-link " type="link" target="false" link="#" title="Button" ] [/buttongroup]
Notification
[notification type="alert-warning" close="true" ]Your notification[/notification]
Your notification
Your notification
Your notification
Your notification
Your notification
Your notification
Your notification
Your notification
Columns
[row] [column lg="6" md="6" sm="6" xs="6" ] text
[/column] [column lg="6" md="6" sm="6" xs="6" ] text
[/column] [/row]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
Table
[table width ="100%" style ="" responsive ="false"] [table_head] [th_column]Heading-1[/th_column] [th_column]Heading-2[/th_column] [th_column]Heading-3[/th_column] [th_column]Heading-4[/th_column] [/table_head] [table_body] [table_row] [row_column]value-1[/row_column] [row_column]value-2[/row_column] [row_column]value-3[/row_column] [row_column]value-4[/row_column] [/table_row] [/table_body] [/table]
Heading-1 | Heading-2 | Heading-3 | Heading-4 |
---|---|---|---|
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
Heading-1 | Heading-2 | Heading-3 | Heading-4 |
---|---|---|---|
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
Heading-1 | Heading-2 | Heading-3 | Heading-4 |
---|---|---|---|
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
Heading-1 | Heading-2 | Heading-3 | Heading-4 |
---|---|---|---|
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
value-1 | value-2 | value-3 | value-4 |
Tooltip
[tooltip type="link" link="#" tooltip="Tooltip" style="top" ]Hover Me[/tooltip]Left Top Bottom Right Auto
Icon Heading
[iconheading type="h1" style="glyphicon glyphicon-adjust"]Heading[/iconheading]
Heading
Heading
Heading
Heading
Heading
Heading
Panel
[panel style="panel-default"] [panel-header] Heading goes here
[/panel-header] [panel-content] Content goes here
[/panel-content] [/panel]
Heading goes here
Content goes here
Heading goes here
Content goes here
Heading goes here
Content goes here
Heading goes here
Content goes here
Heading goes here
Content goes here
Heading goes here
Content goes here
Heading goes here
Content goes here
Popover
[popover title="A title" pop_content="Your Content" trigger="click" style="top" size="" type="btn-default" ]Popover[/popover]
Button DropDown
[dropdown dropup="dropdown"] [dropdownhead style="btn-default" size="" split=""] Dropdown
[/dropdownhead] [dropdownbody] [dropdownitem type="menuitem" link="#" ]Dropdown Item[/dropdownitem] [/dropdownbody] [/dropdown]
Label
[label type="label-default"] LabelLabel Label Label Label Label Label
[/label]
Progress Bar
[progressbar value="50" bartype="progress-bar-success" label="Progress Bar"]
Well
[well type=""]
Your Content
[/well]
Your Content
Your Content
Your Content