{"id":64,"date":"2017-01-31T01:24:17","date_gmt":"2017-01-31T01:24:17","guid":{"rendered":"http:\/\/tommustester.wpengine.com\/?page_id=64"},"modified":"2017-01-31T01:24:17","modified_gmt":"2017-01-31T01:24:17","slug":"accordions","status":"publish","type":"page","link":"https:\/\/radialcircle.com\/index.php\/accordions\/","title":{"rendered":"Elements – Accordions"},"content":{"rendered":"

[vc_row full_width=\u201dstretch_row\u201d][vc_column]\n\t\t\t

\n\t\t\t\t

$\"\"$ <\/div>\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t\t\t

[vc_column_text]<\/p>\n

Accordions<\/h1>\n
These modular elements can be readily used and customized across pages and in different blocks.<\/p>\n
\n
Explore all of Stack\u2019s modular elements
\nat the\u00a0Element Index Page \u2192<\/a>[\/vc_column_text]<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\n\t\t\t<\/section>\n\t\t[\/vc_column][\/vc_row][vc_section css=\u201d.vc_custom_1498220753999{padding-top: 0px !important;}\u201d ebor_docs=\u201d\u201d][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d6\/12\u2033][vc_column_text el_class=\u201dboxed bg\u2013secondary boxed\u2013lg boxed\u2013border\u201d]<\/p>\n

Button Style \u2014 Multiple Open<\/h4>\n
The default behaviour for the accordion is to allow users to open multiple panes by clicking on the title. Panes are closed by clicking again on the title.[\/vc_column_text][\/vc_column][vc_column width=\u201d1\/12\u2033][\/vc_column][vc_column width=\u201d5\/12\u2033]
\n\t\t
\n\t\t\t
\n\t\t\t\tCode Quality<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack follows the BEM naming convention that focusses on logical code readability that is reflected in both the HTML and CSS. Interactive elements such as accordions and tabs follow the same markup patterns making rapid development easier for developers and beginners alike.<\/p>\n
Add to this the thoughtfully presented documentation, featuring code highlighting, snippets, class customizer explanation and you\u2019ve got yourself one powerful value package.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tVisual Design<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack offers a clean and contemporary to suit a range of purposes from corporate, tech startup, marketing site to digital storefront. Elements have been designed to showcase content in a diverse yet consistent manner.<\/p>\n
Multiple font and colour scheme options mean that dramatically altering the look of your site is just clicks away \u2014 Customizing your site in the included Visual Composer\u00a0Page Builder makes experimenting with styles and content arrangements dead simple.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tStack Experience<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
TommusRhodus\u00a0is an elite author known for offering high-quality, high-value products backed by timely and personable support. Recognised and awarded by Envato on multiple occasions for producing consistently outstanding products, it\u2019s no wonder over 40,000 customers enjoy using TommusRhodus Themes.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t<\/ul>[\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d6\/12\u2033][vc_column_text el_class=\u201dboxed bg\u2013secondary boxed\u2013lg boxed\u2013border\u201d]<\/p>\n
Minimal Style \u2014 Multiple Open<\/h4>\n
The default behaviour for the accordion is to allow users to open multiple panes by clicking on the title. Panes are closed by clicking again on the title.[\/vc_column_text][\/vc_column][vc_column width=\u201d1\/12\u2033][\/vc_column][vc_column width=\u201d5\/12\u2033]
\n\t\t
\n\t\t\t
\n\t\t\t\tCode Quality<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack follows the BEM naming convention that focusses on logical code readability that is reflected in both the HTML and CSS. Interactive elements such as accordions and tabs follow the same markup patterns making rapid development easier for developers and beginners alike.<\/p>\n
Add to this the thoughtfully presented documentation, featuring code highlighting, snippets, class customizer explanation and you\u2019ve got yourself one powerful value package.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tVisual Design<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack offers a clean and contemporary to suit a range of purposes from corporate, tech startup, marketing site to digital storefront. Elements have been designed to showcase content in a diverse yet consistent manner.<\/p>\n
Multiple font and colour scheme options mean that dramatically altering the look of your site is just clicks away \u2014 Customizing your site in the included Visual Composer\u00a0Page Builder makes experimenting with styles and content arrangements dead simple.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tStack Experience<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
TommusRhodus\u00a0is an elite author known for offering high-quality, high-value products backed by timely and personable support. Recognised and awarded by Envato on multiple occasions for producing consistently outstanding products, it\u2019s no wonder over 40,000 customers enjoy using TommusRhodus Themes.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t<\/ul>[\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d6\/12\u2033][vc_column_text el_class=\u201dboxed bg\u2013secondary boxed\u2013lg boxed\u2013border\u201d]<\/p>\n
Button Style \u2014 One Open<\/h4>\n
Allows only one panel to remain active at any time. Clicking a new panel automatically closes the previously active panel. This is achieved using the\u00a0.accordion\u2013one-open\u00a0class.[\/vc_column_text][\/vc_column][vc_column width=\u201d1\/12\u2033][\/vc_column][vc_column width=\u201d5\/12\u2033]
\n\t\t
\n\t\t\t
\n\t\t\t\tCode Quality<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack follows the BEM naming convention that focusses on logical code readability that is reflected in both the HTML and CSS. Interactive elements such as accordions and tabs follow the same markup patterns making rapid development easier for developers and beginners alike.<\/p>\n
Add to this the thoughtfully presented documentation, featuring code highlighting, snippets, class customizer explanation and you\u2019ve got yourself one powerful value package.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tVisual Design<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack offers a clean and contemporary to suit a range of purposes from corporate, tech startup, marketing site to digital storefront. Elements have been designed to showcase content in a diverse yet consistent manner.<\/p>\n
Multiple font and colour scheme options mean that dramatically altering the look of your site is just clicks away \u2014 Customizing your site in the included Visual Composer\u00a0Page Builder makes experimenting with styles and content arrangements dead simple.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tStack Experience<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
TommusRhodus\u00a0is an elite author known for offering high-quality, high-value products backed by timely and personable support. Recognised and awarded by Envato on multiple occasions for producing consistently outstanding products, it\u2019s no wonder over 40,000 customers enjoy using TommusRhodus Themes.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t<\/ul>[\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d6\/12\u2033][vc_column_text el_class=\u201dboxed bg\u2013secondary boxed\u2013lg boxed\u2013border\u201d]<\/p>\n
Minimal Style \u2014 One Open<\/h4>\n
Allows only one panel to remain active at any time. Clicking a new panel automatically closes the previously active panel. This is achieved using the\u00a0.accordion\u2013one-open\u00a0class.[\/vc_column_text][\/vc_column][vc_column width=\u201d1\/12\u2033][\/vc_column][vc_column width=\u201d5\/12\u2033]
\n\t\t
\n\t\t\t
\n\t\t\t\tCode Quality<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack follows the BEM naming convention that focusses on logical code readability that is reflected in both the HTML and CSS. Interactive elements such as accordions and tabs follow the same markup patterns making rapid development easier for developers and beginners alike.<\/p>\n
Add to this the thoughtfully presented documentation, featuring code highlighting, snippets, class customizer explanation and you\u2019ve got yourself one powerful value package.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tVisual Design<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
Stack offers a clean and contemporary to suit a range of purposes from corporate, tech startup, marketing site to digital storefront. Elements have been designed to showcase content in a diverse yet consistent manner.<\/p>\n
Multiple font and colour scheme options mean that dramatically altering the look of your site is just clicks away \u2014 Customizing your site in the included Visual Composer\u00a0Page Builder makes experimenting with styles and content arrangements dead simple.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t\n\t\t
\n\t\t\t
\n\t\t\t\tStack Experience<\/span>\n\t\t\t<\/div>\n\t\t\t
\n\t\t\t\t<\/p>\n
TommusRhodus\u00a0is an elite author known for offering high-quality, high-value products backed by timely and personable support. Recognised and awarded by Envato on multiple occasions for producing consistently outstanding products, it\u2019s no wonder over 40,000 customers enjoy using TommusRhodus Themes.<\/p>\n
\n\n\t\t\t<\/div>\n\t\t<\/li>\n\t<\/ul>[\/vc_column][\/vc_row][\/vc_section][vc_row][vc_column][vc_column_text]<\/p>\n
Looking for styled accordion sections?<\/h2>\n
VIEW ACCORDION SECTIONS<\/a><\/p>\n
or try the\u00a0 admin demo \u2197<\/a><\/p>\n
[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/body>","protected":false},"excerpt":{"rendered":"
[vc_row full_width=\u201dstretch_row\u201d][vc_column][\/vc_column][\/vc_row][vc_section css=\u201d.vc_custom_1498220753999{padding-top: 0px !important;}\u201d ebor_docs=\u201d\u201d][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d6\/12\u2033][vc_column_text el_class=\u201dboxed bg\u2013secondary boxed\u2013lg boxed\u2013border\u201d] Button Style \u2014 Multiple Open The default behaviour…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"spay_email":"","footnotes":""},"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/P8yNrc-12","_links":{"self":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/pages\/64"}],"collection":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/comments?post=64"}],"version-history":[{"count":0,"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/pages\/64\/revisions"}],"wp:attachment":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/media?parent=64"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}