{"id":949,"date":"2020-09-07T09:13:39","date_gmt":"2020-09-07T09:13:39","guid":{"rendered":"https:\/\/dentalia.orionthemes.com\/documentation\/?page_id=949"},"modified":"2021-01-12T09:21:35","modified_gmt":"2021-01-12T09:21:35","slug":"timeline-widget","status":"publish","type":"page","link":"https:\/\/dentalia.orionthemes.com\/documentation\/timeline-widget\/","title":{"rendered":"Timeline widget"},"content":{"rendered":"<div id=\"pl-949\"  class=\"panel-layout\" ><div id=\"pg-949-0\"  class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch divider-no-animation tablet-1-in-row mobile-default desktop-default bg-altsitebg panel-row-style panel-row-style-for-949-0\" data-stretch-type=\"full\" ><div id=\"pgc-949-0-0\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><div id=\"pgc-949-0-1\"  class=\"panel-grid-cell panel-grid-cell-mobile-last\" ><div id=\"panel-949-0-1-0\" class=\"so-panel widget widget_orion_heading_w panel-first-child\" data-index=\"0\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-0-1-0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-orion_heading_w so-widget-orion_heading_w-base\"\n\t\t\t\n\t\t> \r\n\t\t\t<div class=\"row orion-heading\" style=\"margin-bottom:0px;\">\r\n\t\t<div class=\"col-md-12   text-center style-display-2 style-primary-color\">\r\n\t\t\t<h1 class=\"primary-color text-uppercase display-2\">\r\n\t\t\t\tTimeline Widget\t\t\t<\/h1>\r\n\t\t<\/div>\r\n\t<\/div>\r\n\r\n\t<\/div><\/div><\/div><div id=\"panel-949-0-1-1\" class=\"so-panel widget widget_sow-editor panel-last-child\" data-index=\"1\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-0-1-1\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-editor so-widget-sow-editor-base\"\n\t\t\t\n\t\t>\n<div class=\"siteorigin-widget-tinymce textwidget\">\n\t<p class=\"lead\" style=\"text-align: center;\">Create a timeline to display company history or team\u00a0member biography. You can add dates, titles and descriptions of events.<\/p>\n<\/div>\n<\/div><\/div><\/div><\/div><div id=\"pgc-949-0-2\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><div id=\"pg-949-1\"  class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch divider-no-animation tablet-1-in-row mobile-1-in-row desktop-default clear panel-row-style panel-row-style-for-949-1\" data-stretch-type=\"full\" ><div id=\"pgc-949-1-0\"  class=\"panel-grid-cell\" ><div class=\"clear panel-cell-style panel-cell-style-for-949-1-0\" ><div id=\"panel-949-1-0-0\" class=\"so-panel widget widget_orion_heading_w panel-first-child\" data-index=\"2\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-1-0-0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-orion_heading_w so-widget-orion_heading_w-base\"\n\t\t\t\n\t\t> \r\n\t\t\t<div class=\"row orion-heading\" style=\"margin-bottom:12px;\">\r\n\t\t<div class=\"col-md-12   text-left style-h2 style-primary-color\">\r\n\t\t\t<h2 class=\"primary-color\">\r\n\t\t\t\tAdding elements\t\t\t<\/h2>\r\n\t\t<\/div>\r\n\t<\/div>\r\n\r\n\t<\/div><\/div><\/div><div id=\"panel-949-1-0-1\" class=\"so-panel widget widget_sow-editor\" data-index=\"3\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-1-0-1\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-editor so-widget-sow-editor-base\"\n\t\t\t\n\t\t>\n<div class=\"siteorigin-widget-tinymce textwidget\">\n\t<ul class=\"list-arrow lead-list\">\n<li><strong>Add+<\/strong> creates a new, empty element.<\/li>\n<li>For each element, you can add the <strong>Date<\/strong>, <strong>Event title,<\/strong> and <strong>Event description<\/strong>.<\/li>\n<li><strong>Highlight:<\/strong> Checking the \"highlight\" checkbox will make the date stand out.<\/li>\n<\/ul>\n<\/div>\n<\/div><\/div><\/div><div id=\"panel-949-1-0-2\" class=\"so-panel widget widget_orion_dividers_w\" data-index=\"4\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-1-0-2\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-orion_dividers_w so-widget-orion_dividers_w-base\"\n\t\t\t\n\t\t>\t<hr style=\"border-top-width:2px; border-top-color:rgba(0,0,0,0.05); border-style: dashed; width: 100%;  margin-top:11px; margin-bottom:47px;\"><\/div><\/div><\/div><div id=\"panel-949-1-0-3\" class=\"so-panel widget widget_orion_heading_w\" data-index=\"5\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-1-0-3\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-orion_heading_w so-widget-orion_heading_w-base\"\n\t\t\t\n\t\t> \r\n\t\t\t<div class=\"row orion-heading\" style=\"margin-bottom:24px;\">\r\n\t\t<div class=\"col-md-12   text-left style-display-3 style-secondary-color\">\r\n\t\t\t<h3 class=\"secondary-color text-uppercase display-3\">\r\n\t\t\t\tSettings\t\t\t<\/h3>\r\n\t\t<\/div>\r\n\t<\/div>\r\n\r\n\t<\/div><\/div><\/div><div id=\"panel-949-1-0-4\" class=\"so-panel widget widget_sow-editor panel-last-child\" data-index=\"6\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-1-0-4\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-editor so-widget-sow-editor-base\"\n\t\t\t\n\t\t>\n<div class=\"siteorigin-widget-tinymce textwidget\">\n\t<ul class=\"list-arrow lead-list\">\n<li><strong>Skin:<\/strong> Select a skin for the widget to go with its background. The dark skin will change the text color of the timeline elements to dark, while the light skin will make the text light. The highlight color will also change depending on the chosen skin.<\/li>\n<\/ul>\n<\/div>\n<\/div><\/div><\/div><\/div><\/div><div id=\"pgc-949-1-1\"  class=\"panel-grid-cell\" ><div id=\"panel-949-1-1-0\" class=\"so-panel widget widget_orion_image_w panel-first-child panel-last-child\" data-index=\"7\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-1-1-0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-orion_image_w so-widget-orion_image_w-base\"\n\t\t\t\n\t\t>\r\n<div class=\"image-w relative  img-frame shadow-4\">\r\n\r\n\t\t\t\t\t\t\t\t\t\t<a rel=\"orion-images\" class=\" overlay-none overlay-hover-none\" href=\"https:\/\/dentalia.orionthemes.com\/documentation\/wp-content\/uploads\/2020\/09\/dentalia-timeline-widget.jpg\" title=\"\" data-caption=\"\" data-fancybox=\"https:\/\/dentalia.orionthemes.com\/documentation\/wp-content\/uploads\/2020\/09\/dentalia-timeline-widget.jpg\">\r\n\t\t\r\n\t\t\t\t\t<img width=\"960\" height=\"799\" src=\"https:\/\/dentalia.orionthemes.com\/documentation\/wp-content\/uploads\/2020\/09\/dentalia-timeline-widget.jpg\" class=\"attachment- size-\" alt=\"\" loading=\"lazy\" \/>\t\t\t<div class=\"overlay\"><\/div>\r\n\t\t\r\n\t\t\t\t\t<\/a>\r\n\t\t\t\r\n\t\r\n\t<div class=\"absolute\">\r\n\t\t<div class=\"hover-desc table-wrap\">\r\n\t\t\t<div class=\"cell-wrap\">\r\n\t\t\t\t<h4 class=\"text-light\"><\/h4>\r\n\t\t\t<\/div>\r\n\t\t<\/div>\r\n\t<\/div>\t\t\t\t\t\r\n<\/div>\r\n\r\n<\/div><\/div><\/div><\/div><\/div><\/div><div id=\"pg-949-2\"  class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch divider-no-animation tablet-default mobile-default desktop-default bg-altsitebg panel-row-style panel-row-style-for-949-2\" data-stretch-type=\"full\" ><div id=\"pgc-949-2-0\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><div id=\"pgc-949-2-1\"  class=\"panel-grid-cell panel-grid-cell-mobile-last\" ><div id=\"panel-949-2-1-0\" class=\"so-panel widget widget_orion_heading_w panel-first-child\" data-index=\"8\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-2-1-0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-orion_heading_w so-widget-orion_heading_w-base\"\n\t\t\t\n\t\t> \r\n\t\t\t<div class=\"row orion-heading\" style=\"margin-bottom:24px;\">\r\n\t\t<div class=\"col-md-12   text-center style-display-3 style-text-default\">\r\n\t\t\t<h3 class=\"text-default text-uppercase display-3\">\r\n\t\t\t\tExample:\t\t\t<\/h3>\r\n\t\t<\/div>\r\n\t<\/div>\r\n\r\n\t<\/div><\/div><\/div><div id=\"panel-949-2-1-1\" class=\"so-panel widget widget_orion_timeline_w panel-last-child\" data-index=\"9\" ><div class=\"orion custom default panel-widget-style panel-widget-style-for-949-2-1-1\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-orion_timeline_w so-widget-orion_timeline_w-base\"\n\t\t\t\n\t\t>\r\n<div class=\"timeline text-dark\">\r\n\t\t\r\n\t    <div class=\"timeline-item primary-color \">\r\n        <div class=\"timeline-year font-2 white-rgba white-rgba-bg text-center \">\r\n        <span class=\" text-dark\">1.1.2020<\/span>\r\n        <\/div>\r\n    \t<div class=\"timeline-content\">\r\n        \t<h3 class=\"item-title\">Event Title<\/h3>\r\n        \t<div class=\"timeline-text text-dark\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/div>\r\n   \t\t<\/div>\r\n\t<\/div>\r\n\t\t\r\n\t    <div class=\"timeline-item primary-color  highlight\">\r\n        <div class=\"timeline-year font-2 primary-color primary-color-bg text-center \">\r\n        <span class=\"text-bold text-light\">5.5.2016<\/span>\r\n        <\/div>\r\n    \t<div class=\"timeline-content\">\r\n        \t<h3 class=\"item-title\">Highlighted Event<\/h3>\r\n        \t<div class=\"timeline-text text-dark\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/div>\r\n   \t\t<\/div>\r\n\t<\/div>\r\n\t\t\r\n\t    <div class=\"timeline-item primary-color \">\r\n        <div class=\"timeline-year font-2 white-rgba white-rgba-bg text-center \">\r\n        <span class=\" text-dark\">12.12.2012<\/span>\r\n        <\/div>\r\n    \t<div class=\"timeline-content\">\r\n        \t<h3 class=\"item-title\">Event Title<\/h3>\r\n        \t<div class=\"timeline-text text-dark\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/div>\r\n   \t\t<\/div>\r\n\t<\/div>\r\n\t<\/div><\/div><\/div><\/div><\/div><div id=\"pgc-949-2-2\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>Create a timeline to display company history or team\u00a0member biography. You can add dates, titles and descriptions of events. Add+ creates a new, empty element. For each element, you can add the Date, Event title, and Event description. Highlight: Checking the &#8220;highlight&#8221; checkbox will make the date stand out. Skin: Select a skin for the<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/pages\/949"}],"collection":[{"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/comments?post=949"}],"version-history":[{"count":11,"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/pages\/949\/revisions"}],"predecessor-version":[{"id":3143,"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/pages\/949\/revisions\/3143"}],"wp:attachment":[{"href":"https:\/\/dentalia.orionthemes.com\/documentation\/wp-json\/wp\/v2\/media?parent=949"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}