{"id":372,"date":"2022-11-04T00:42:57","date_gmt":"2022-11-04T00:42:57","guid":{"rendered":"https:\/\/dornsife.usc.edu\/components\/?page_id=372"},"modified":"2022-12-15T01:07:20","modified_gmt":"2022-12-15T01:07:20","slug":"interactive-content-pane","status":"publish","type":"page","link":"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/","title":{"rendered":"Interactive Content Pane"},"content":{"rendered":"  \n    \n\n\n\n\n\n\n<div\n  class=\"cc--component-container cc--spacer \"\n\n  \n  \n  \n  \n  \n  \n  >\n  <div class=\"c--component c--spacer\"\n    \n      >\n\n    \n\n  <\/div><\/div>\n\n\n\n\n  \n    \n\n\n\n\n\n\n<div\n  class=\"cc--component-container cc--rich-text \"\n\n  \n  \n  \n  \n  \n  \n  >\n  <div class=\"c--component c--rich-text\"\n    \n      >\n\n    \n      \n<div class=\"f--field f--wysiwyg\">\n\n    \n  <p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-16x9_1280 wp-image-353\" src=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_pane-1280x720.jpg\" alt=\"\" width=\"1280\" height=\"720\" srcset=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_pane-1280x720.jpg 1280w, https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_pane-300x169.jpg 300w, https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_pane-768x432.jpg 768w, https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_pane-1920x1080.jpg 1920w, https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_pane.jpg 1948w\" sizes=\"(max-width: 1280px) 100vw, 1280px\" \/><\/p>\n<hr \/>\n<p>upload image minimum: 2000 x 1150px<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-373\" src=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_content_page_style.jpg\" alt=\"\" width=\"1134\" height=\"50\" srcset=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_content_page_style.jpg 1134w, https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/interactive_content_page_style-300x13.jpg 300w\" sizes=\"(max-width: 1134px) 100vw, 1134px\" \/><\/p>\n\n\n\n<\/div>\n\n\n  <\/div><\/div>\n\n\n\n\n  \n    \n\n\n\n\n\n\n<div\n  class=\"cc--component-container cc--rich-text \"\n\n  \n  \n  \n  \n  \n  \n  >\n  <div class=\"c--component c--rich-text\"\n    \n      >\n\n    \n      \n<div class=\"f--field f--wysiwyg\">\n\n    \n  <h2>How to Video<\/h2>\n<div class=\"video-embed\"><iframe loading=\"lazy\" title=\"Interactive Content Pane\" src=\"https:\/\/player.vimeo.com\/video\/778311507?h=74cf2a0780&amp;dnt=1&amp;app_id=122963\" width=\"500\" height=\"273\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write\"><\/iframe><\/div>\n\n\n\n<\/div>\n\n\n  <\/div><\/div>\n\n\n\n\n\n  \n  \n    \n    \n        \n    \n    \n        \n    \n    \n        \n    \n  \n\n  \n    \n\n\n\n\n\n\n<div\n  class=\"cc--component-container cc--interactive-content-pane \"\n\n  \n  \n  \n  \n  \n  \n  >\n  <div class=\"c--component c--interactive-content-pane\"\n    \n      >\n\n    \n<div class=\"inner-wrapper\">\n  <div class=\"left\">\n              \n<div class=\"f--field f--section-title\">\n\n    \n  <h2>\n          Interactive Content Pane\n      <\/h2>\n\n\n<\/div>\n      \n    <div class=\"pagination-wrapper\">\n      <ul class=\"interactive-content-pane-pagination\"><\/ul>\n    <\/div>\n  <\/div>\n\n  <div class=\"right\">\n          <div class=\"swiper\">\n        <div class=\"swiper-wrapper\">\n                      <div class=\"swiper-slide\">\n              <h3 class=\"pane-title\">\n                Item 1\n              <\/h3>\n                                  \n<div class=\"f--field f--description\">\n\n    \n  <p>The passage experienced a surge in popularity during the 1960s when Letraset used it on their dry-transfer sheets, and again during the 90s as desktop publishers bundled the text with their software. Today it&#8217;s seen all around the web; on templates, websites, and stock designs. Use our\u00a0<a title=\"Lorem Ipsum Generator\" href=\"https:\/\/loremipsum.io\/#generator\">generator<\/a>\u00a0to get your own, or read on for the authoritative history of\u00a0<em>lorem ipsum<\/em>.<\/p>\n\n\n\n<\/div>\n                          \n  \n                          <\/div>\n                      <div class=\"swiper-slide\">\n              <h3 class=\"pane-title\">\n                Item 2\n              <\/h3>\n                                  \n<div class=\"f--field f--description\">\n\n    \n  <p><em>Lorem ipsum<\/em>, or\u00a0<em>lipsum<\/em>\u00a0as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero&#8217;s\u00a0<em>De Finibus Bonorum et Malorum<\/em>\u00a0for use in a type specimen book. It usually begins with:<\/p>\n\n\n\n<\/div>\n                          \n  \n                              <ul>\n                                            <li>\n                                \n<div class=\"f--field f--link\">\n\n    \n    \n  \n<a \n  class=\"link\"\n  href= https:\/\/dornsife.usc.edu\/components\/image-gallery\/\n    aria-label=\"Read more about Image Gallery\"  \n>\n    Image Gallery \n  <svg version=\"1.1\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 35 35\" enable-background=\"new 0 0 35 35\" width=\"25\" height=\"25\" xml:space=\"preserve\"><polygon fill-rule=\"evenodd\" clip-rule=\"evenodd\" fill=\"#FC0\" points=\"19.3,27.5 29.3,17.5,19.3,7.5 16.3,10.4 21.4,15.4 6.7,15.4 6.7,19.6 21.4,19.6 16.3,24.6 \"\/><\/svg>\n<\/a>\n\n\n<\/div>\n                        <\/li>\n                                    <\/ul>\n                          <\/div>\n                      <div class=\"swiper-slide\">\n              <h3 class=\"pane-title\">\n                Item 3\n              <\/h3>\n                                  \n<div class=\"f--field f--description\">\n\n    \n  <p>Integer ullamcorper, metus ac pellentesque vehicula, nunc nisi mattis velit, at viverra nisl orci sit amet nisi. Curabitur quam elit, pharetra non augue vitae, mollis tristique libero. Maecenas quis quam metus. Vestibulum ut dapibus eros, eu tristique metus. Fusce dictum orci turpis, sit amet finibus urna tempus non. Sed id mattis leo. Praesent odio nulla, vestibulum eget risus hendrerit, vehicula ornare dui. Suspendisse consectetur egestas ante, vitae cursus est rhoncus et. Curabitur eu efficitur orci. Aliquam mollis vitae ante sed mollis. Nulla vitae facilisis ipsum. Sed sed finibus augue. Mauris mauris justo, sagittis in enim quis, faucibus tincidunt dolor. In semper sem eu aliquam laoreet. Nam tempor risus id tortor tempus molestie.<\/p>\n\n\n\n<\/div>\n                          \n  \n                              <ul>\n                                            <li>\n                                \n<div class=\"f--field f--link\">\n\n    \n    \n  \n<a \n  class=\"link\"\n  href= https:\/\/dornsife.usc.edu\n    aria-label=\"Read more about USC dornsife\"  \n>\n    USC dornsife \n  <svg version=\"1.1\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 35 35\" enable-background=\"new 0 0 35 35\" width=\"25\" height=\"25\" xml:space=\"preserve\"><polygon fill-rule=\"evenodd\" clip-rule=\"evenodd\" fill=\"#FC0\" points=\"19.3,27.5 29.3,17.5,19.3,7.5 16.3,10.4 21.4,15.4 6.7,15.4 6.7,19.6 21.4,19.6 16.3,24.6 \"\/><\/svg>\n<\/a>\n\n\n<\/div>\n                        <\/li>\n                                    <\/ul>\n                          <\/div>\n                      <div class=\"swiper-slide\">\n              <h3 class=\"pane-title\">\n                Item 4\n              <\/h3>\n                                  \n<div class=\"f--field f--description\">\n\n    \n  <p>Integer ullamcorper, metus ac pellentesque vehicula, nunc nisi mattis velit, at viverra nisl orci sit amet nisi. Curabitur quam elit, pharetra non augue vitae, mollis tristique libero. Maecenas quis quam metus. Vestibulum ut dapibus eros, eu tristique metus. Fusce dictum orci turpis, sit amet finibus urna tempus non. Sed id mattis leo. Praesent odio nulla, vestibulum eget risus hendrerit, vehicula ornare dui. Suspendisse consectetur egestas ante, vitae cursus est rhoncus et. Curabitur eu efficitur orci. Aliquam mollis vitae ante sed mollis. Nulla vitae facilisis ipsum. Sed sed finibus augue. Mauris mauris justo, sagittis in enim quis, faucibus tincidunt dolor. In semper sem eu aliquam laoreet. Nam tempor risus id tortor tempus molestie.<\/p>\n\n\n\n<\/div>\n                          \n  \n                              <ul>\n                                            <li>\n                                \n<div class=\"f--field f--link\">\n\n    \n    \n  \n<a \n  class=\"link\"\n  href= https:\/\/dornsife.usc.edu\n    aria-label=\"Read more about Dornsife USC\"  \n>\n    Dornsife USC \n  <svg version=\"1.1\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 35 35\" enable-background=\"new 0 0 35 35\" width=\"25\" height=\"25\" xml:space=\"preserve\"><polygon fill-rule=\"evenodd\" clip-rule=\"evenodd\" fill=\"#FC0\" points=\"19.3,27.5 29.3,17.5,19.3,7.5 16.3,10.4 21.4,15.4 6.7,15.4 6.7,19.6 21.4,19.6 16.3,24.6 \"\/><\/svg>\n<\/a>\n\n\n<\/div>\n                        <\/li>\n                                    <\/ul>\n                          <\/div>\n                  <\/div>\n      <\/div>\n      <\/div>\n  \n<\/div>\n\n\n\n  <div class=\"background-images\">\n          <div class=\"swiper swiper-background-images\">\n        <div class=\"swiper-wrapper\">\n                      <div class=\"swiper-slide\">\n                                                                  \n<div class=\"f--field f--image\">\n\n    \n    \n    \n    \n    \n    \n              \n      <img decoding=\"async\"\n                            src=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg\"\n          srcset=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1920x1080.jpg 1920w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1280x720.jpg 1280w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg 768w\"          sizes=\"(min-width:1200px) 75vw, (min-width:768px) 83vw, 100vw\"\n        \n                  role=\"none\"\n        \n        \n                                      \/>\n\n    \n    \n  \n  \n\n<\/div>\n                          <\/div>\n\n                      <div class=\"swiper-slide\">\n                                                                  \n<div class=\"f--field f--image\">\n\n    \n    \n    \n    \n    \n    \n              \n      <img decoding=\"async\"\n                            src=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg\"\n          srcset=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1920x1080.jpg 1920w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1280x720.jpg 1280w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg 768w\"          sizes=\"(min-width:1200px) 75vw, (min-width:768px) 83vw, 100vw\"\n        \n                  role=\"none\"\n        \n        \n                                      \/>\n\n    \n    \n  \n  \n\n<\/div>\n                          <\/div>\n\n                      <div class=\"swiper-slide\">\n                                                                  \n<div class=\"f--field f--image\">\n\n    \n    \n    \n    \n    \n    \n              \n      <img decoding=\"async\"\n                            src=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg\"\n          srcset=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1920x1080.jpg 1920w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1280x720.jpg 1280w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg 768w\"          sizes=\"(min-width:1200px) 75vw, (min-width:768px) 83vw, 100vw\"\n        \n                  role=\"none\"\n        \n        \n                                      \/>\n\n    \n    \n  \n  \n\n<\/div>\n                          <\/div>\n\n                      <div class=\"swiper-slide\">\n                                                                  \n<div class=\"f--field f--image\">\n\n    \n    \n    \n    \n    \n    \n              \n      <img decoding=\"async\"\n                            src=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg\"\n          srcset=\"https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1920x1080.jpg 1920w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-1280x720.jpg 1280w,https:\/\/dornsife.usc.edu\/components\/wp-content\/uploads\/sites\/33\/2022\/11\/usc_background_2_2000x1150-768x432.jpg 768w\"          sizes=\"(min-width:1200px) 75vw, (min-width:768px) 83vw, 100vw\"\n        \n                  role=\"none\"\n        \n        \n                                      \/>\n\n    \n    \n  \n  \n\n<\/div>\n                          <\/div>\n\n                  <\/div>\n      <\/div>\n      <\/div>\n\n\n\n  <\/div><\/div>\n\n\n  \n    \n\n\n\n\n\n\n<div\n  class=\"cc--component-container cc--spacer \"\n\n  \n  \n  \n  \n  \n  \n  >\n  <div class=\"c--component c--spacer\"\n    \n      >\n\n    \n\n  <\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-372","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.1.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Interactive Content Pane - Wordpress CMS Components<\/title>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Interactive Content Pane - Wordpress CMS Components\" \/>\n<meta property=\"og:url\" content=\"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/\" \/>\n<meta property=\"og:site_name\" content=\"Wordpress CMS Components\" \/>\n<meta property=\"article:modified_time\" content=\"2022-12-15T01:07:20+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/\",\"url\":\"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/\",\"name\":\"Interactive Content Pane - Wordpress CMS Components\",\"isPartOf\":{\"@id\":\"https:\/\/dornsife.usc.edu\/components\/#website\"},\"datePublished\":\"2022-11-04T00:42:57+00:00\",\"dateModified\":\"2022-12-15T01:07:20+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/dornsife.usc.edu\/components\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Interactive Content Pane\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/dornsife.usc.edu\/components\/#website\",\"url\":\"https:\/\/dornsife.usc.edu\/components\/\",\"name\":\"Wordpress CMS Components\",\"description\":\"CMS components\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/dornsife.usc.edu\/components\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Interactive Content Pane - Wordpress CMS Components","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"en_US","og_type":"article","og_title":"Interactive Content Pane - Wordpress CMS Components","og_url":"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/","og_site_name":"Wordpress CMS Components","article_modified_time":"2022-12-15T01:07:20+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/","url":"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/","name":"Interactive Content Pane - Wordpress CMS Components","isPartOf":{"@id":"https:\/\/dornsife.usc.edu\/components\/#website"},"datePublished":"2022-11-04T00:42:57+00:00","dateModified":"2022-12-15T01:07:20+00:00","breadcrumb":{"@id":"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/dornsife.usc.edu\/components\/interactive-content-pane\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/dornsife.usc.edu\/components\/"},{"@type":"ListItem","position":2,"name":"Interactive Content Pane"}]},{"@type":"WebSite","@id":"https:\/\/dornsife.usc.edu\/components\/#website","url":"https:\/\/dornsife.usc.edu\/components\/","name":"Wordpress CMS Components","description":"CMS components","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/dornsife.usc.edu\/components\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/pages\/372","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/comments?post=372"}],"version-history":[{"count":15,"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/pages\/372\/revisions"}],"predecessor-version":[{"id":1993,"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/pages\/372\/revisions\/1993"}],"wp:attachment":[{"href":"https:\/\/dornsife.usc.edu\/components\/wp-json\/wp\/v2\/media?parent=372"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}