{"id":1227,"date":"2020-07-28T17:33:55","date_gmt":"2020-07-28T17:33:55","guid":{"rendered":"https:\/\/utiawpguide.tennessee.edu\/?p=1227"},"modified":"2020-07-28T17:33:55","modified_gmt":"2020-07-28T17:33:55","slug":"accordion-block","status":"publish","type":"post","link":"https:\/\/utia-dev.tennessee.edu\/wpguide\/2020\/07\/28\/accordion-block\/","title":{"rendered":"Accordion Block"},"content":{"rendered":"\n<p>Accordion Block is a Kadence block that allows a way to add  a large amount of content to your page in a condensed way. Additional <a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/accordion-block\/\">Instructions<\/a> and  <a href=\"https:\/\/www.kadencewp.com\/kadence-blocks\/custom-blocks\/accordion-block\/\">demonstrations<\/a> can be found at their\u00a0website.<\/p>\n\n\n<style>#kt-layout-id_7cc015-45 > .kt-row-column-wrap{align-content:start;}:where(#kt-layout-id_7cc015-45 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}#kt-layout-id_7cc015-45 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var( --global-kb-row-default-top, 25px );padding-bottom:var( --global-kb-row-default-bottom, 25px );padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}#kt-layout-id_7cc015-45 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){#kt-layout-id_7cc015-45 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){#kt-layout-id_7cc015-45 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style>\n<div class=\"wp-block-kadence-rowlayout alignnone\"><div id=\"kt-layout-id_7cc015-45\" class=\"kt-row-layout-inner kt-layout-id_7cc015-45\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row\"><style>.kadence-column_c5f545-93 > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_c5f545-93 > .kt-inside-inner-col,.kadence-column_c5f545-93 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_c5f545-93 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_c5f545-93 > .kt-inside-inner-col{flex-direction:column;}.kadence-column_c5f545-93 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_c5f545-93 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_c5f545-93{position:relative;}@media all and (max-width: 1024px){.kadence-column_c5f545-93 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_c5f545-93 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-1 kadence-column_c5f545-93\"><div class=\"kt-inside-inner-col\">\n<h2 class=\"wp-block-heading\">1 &#8211; Where Do I Start?<\/h2>\n\n\n\n<p>Click on <strong>Accordion <\/strong>in Kadence Blocks.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column_e36c81-76 > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_e36c81-76 > .kt-inside-inner-col,.kadence-column_e36c81-76 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_e36c81-76 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_e36c81-76 > .kt-inside-inner-col{flex-direction:column;}.kadence-column_e36c81-76 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_e36c81-76 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_e36c81-76{position:relative;}@media all and (max-width: 1024px){.kadence-column_e36c81-76 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_e36c81-76 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-2 kadence-column_e36c81-76\"><div class=\"kt-inside-inner-col\">\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"103\" height=\"87\" src=\"https:\/\/utia.tennessee.edu\/training\/wp-content\/uploads\/sites\/18\/2019\/10\/AccordionIcon.png\" alt=\"Accordion Icon\" class=\"wp-image-210\" \/><\/figure>\n<\/div><\/div>\n<\/div><\/div><\/div>\n\n\n<style>.wp-block-kadence-spacer.kt-block-spacer-_2b62b4-b1 .kt-block-spacer{height:60px;}.wp-block-kadence-spacer.kt-block-spacer-_2b62b4-b1 .kt-divider{border-top-width:1px;height:1px;border-top-color:#333d47;width:80%;border-top-style:solid;}<\/style>\n<div class=\"wp-block-kadence-spacer aligncenter kt-block-spacer-_2b62b4-b1\"><div class=\"kt-block-spacer kt-block-spacer-halign-center\"><hr class=\"kt-divider\" \/><\/div><\/div>\n\n\n<style>#kt-layout-id_57addd-60 > .kt-row-column-wrap{align-content:start;}:where(#kt-layout-id_57addd-60 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}#kt-layout-id_57addd-60 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var( --global-kb-row-default-top, 25px );padding-bottom:var( --global-kb-row-default-bottom, 25px );padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}#kt-layout-id_57addd-60 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){#kt-layout-id_57addd-60 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){#kt-layout-id_57addd-60 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style>\n<div class=\"wp-block-kadence-rowlayout alignnone\"><div id=\"kt-layout-id_57addd-60\" class=\"kt-row-layout-inner kt-layout-id_57addd-60\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row\"><style>.kadence-column_0a28f2-ef > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_0a28f2-ef > .kt-inside-inner-col,.kadence-column_0a28f2-ef > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_0a28f2-ef > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_0a28f2-ef > .kt-inside-inner-col{flex-direction:column;}.kadence-column_0a28f2-ef > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_0a28f2-ef > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_0a28f2-ef{position:relative;}@media all and (max-width: 1024px){.kadence-column_0a28f2-ef > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_0a28f2-ef > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-1 kadence-column_0a28f2-ef\"><div class=\"kt-inside-inner-col\">\n<h2 class=\"wp-block-heading\">2 &#8211; Select the Accordion Style<\/h2>\n\n\n\n<p>Select the Accordion style from the options. (For Accessibility reasons &#8211; please do not select the style with the orange bar.)<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column_2fc7fc-52 > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_2fc7fc-52 > .kt-inside-inner-col,.kadence-column_2fc7fc-52 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_2fc7fc-52 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_2fc7fc-52 > .kt-inside-inner-col{flex-direction:column;}.kadence-column_2fc7fc-52 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_2fc7fc-52 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_2fc7fc-52{position:relative;}@media all and (max-width: 1024px){.kadence-column_2fc7fc-52 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_2fc7fc-52 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-2 kadence-column_2fc7fc-52\"><div class=\"kt-inside-inner-col\">\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"766\" height=\"591\" src=\"https:\/\/utia.tennessee.edu\/training\/wp-content\/uploads\/sites\/18\/2019\/10\/AccordionStyleOptions.png\" alt=\"Layout options for Accordion style of Kadence Blocks\" class=\"wp-image-211\" srcset=\"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionStyleOptions.png 766w, https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionStyleOptions-300x231.png 300w\" sizes=\"auto, (max-width: 766px) 100vw, 766px\" \/><\/figure>\n<\/div><\/div>\n<\/div><\/div><\/div>\n\n\n<style>.wp-block-kadence-spacer.kt-block-spacer-_8fcb2e-55 .kt-block-spacer{height:60px;}.wp-block-kadence-spacer.kt-block-spacer-_8fcb2e-55 .kt-divider{border-top-width:1px;height:1px;border-top-color:#333d47;width:80%;border-top-style:solid;}<\/style>\n<div class=\"wp-block-kadence-spacer aligncenter kt-block-spacer-_8fcb2e-55\"><div class=\"kt-block-spacer kt-block-spacer-halign-center\"><hr class=\"kt-divider\" \/><\/div><\/div>\n\n\n<style>#kt-layout-id_53ee92-ba > .kt-row-column-wrap{align-content:start;}:where(#kt-layout-id_53ee92-ba > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}#kt-layout-id_53ee92-ba > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var( --global-kb-row-default-top, 25px );padding-bottom:var( --global-kb-row-default-bottom, 25px );padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}#kt-layout-id_53ee92-ba > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){#kt-layout-id_53ee92-ba > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){#kt-layout-id_53ee92-ba > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style>\n<div class=\"wp-block-kadence-rowlayout alignnone\"><div id=\"kt-layout-id_53ee92-ba\" class=\"kt-row-layout-inner kt-layout-id_53ee92-ba\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row\"><style>.kadence-column_b9ab81-c4 > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_b9ab81-c4 > .kt-inside-inner-col,.kadence-column_b9ab81-c4 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_b9ab81-c4 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_b9ab81-c4 > .kt-inside-inner-col{flex-direction:column;}.kadence-column_b9ab81-c4 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_b9ab81-c4 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_b9ab81-c4{position:relative;}@media all and (max-width: 1024px){.kadence-column_b9ab81-c4 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_b9ab81-c4 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-1 kadence-column_b9ab81-c4\"><div class=\"kt-inside-inner-col\">\n<h2 class=\"wp-block-heading\">3 &#8211; Select Options for the Accordion Style<\/h2>\n\n\n\n<p>Select Accordion style options in the right sidebar.<\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column_e69606-ac > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_e69606-ac > .kt-inside-inner-col,.kadence-column_e69606-ac > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_e69606-ac > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_e69606-ac > .kt-inside-inner-col{flex-direction:column;}.kadence-column_e69606-ac > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_e69606-ac > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_e69606-ac{position:relative;}@media all and (max-width: 1024px){.kadence-column_e69606-ac > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_e69606-ac > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-2 kadence-column_e69606-ac\"><div class=\"kt-inside-inner-col\">\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"279\" height=\"672\" src=\"https:\/\/utia.tennessee.edu\/training\/wp-content\/uploads\/sites\/18\/2019\/10\/AccordionRightSidebarOptions.png\" alt=\"Options for Accordion\" class=\"wp-image-212\" srcset=\"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionRightSidebarOptions.png 279w, https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionRightSidebarOptions-125x300.png 125w\" sizes=\"auto, (max-width: 279px) 100vw, 279px\" \/><\/figure>\n<\/div><\/div>\n<\/div><\/div><\/div>\n\n\n<style>.wp-block-kadence-spacer.kt-block-spacer-_0c1b1f-49 .kt-block-spacer{height:60px;}.wp-block-kadence-spacer.kt-block-spacer-_0c1b1f-49 .kt-divider{border-top-width:1px;height:1px;border-top-color:#333d47;width:80%;border-top-style:solid;}<\/style>\n<div class=\"wp-block-kadence-spacer aligncenter kt-block-spacer-_0c1b1f-49\"><div class=\"kt-block-spacer kt-block-spacer-halign-center\"><hr class=\"kt-divider\" \/><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">4 &#8211; Finished Product<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"432\" src=\"https:\/\/utia.tennessee.edu\/training\/wp-content\/uploads\/sites\/18\/2019\/10\/AccordionDemo-1024x432.png\" alt=\"Accordion Demo\" class=\"wp-image-214\" srcset=\"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionDemo-1024x432.png 1024w, https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionDemo-300x127.png 300w, https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionDemo-768x324.png 768w, https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-content\/uploads\/sites\/212\/2019\/10\/AccordionDemo.png 1374w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Accessibility Tips<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Please do not use the option with the orange background.  It uses white text which the orange\/white combination fails the color contrast test.<\/li><li>Ensure that all fonts used in this block is at least 16px for accessibility purposes.<\/li><\/ul>\n\n\n<div class=\"utia-accentbar\"><hr style=\"background-color:#ff8300\" align=\"left\" \/><\/div>\n\n\n<h2 class=\"wp-block-heading\">Disclaimer<\/h2>\n\n\n\n<p>As a public university it is crucial to ensure our information is accessible to everyone that visits our websites. To assist content owners in this effort, UTIA has created certain boundaries within the UTIA WordPress environment. These boundaries are designed to help content owners from inadvertently violating established accessibility standards. Therefore, instructions at external websites may show features that we have disabled.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Accordion Block is a Kadence block that allows a way to add a large amount of content to your page in a condensed way. Additional Instructions and demonstrations can be\u2026<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_searchwp_excluded":"","footnotes":""},"categories":[4,5],"tags":[11,37],"class_list":["post-1227","post","type-post","status-publish","format-standard","hentry","category-advanced-training","category-blocks","tag-accordion","tag-kadence"],"acf":[],"publishpress_future_action":{"enabled":false,"date":"2026-04-29 22:54:36","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"category","extraData":[]},"publishpress_future_workflow_manual_trigger":{"enabledWorkflows":[]},"_links":{"self":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/posts\/1227","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/comments?post=1227"}],"version-history":[{"count":0,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/posts\/1227\/revisions"}],"wp:attachment":[{"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/media?parent=1227"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/categories?post=1227"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/utia-dev.tennessee.edu\/wpguide\/wp-json\/wp\/v2\/tags?post=1227"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}