{"id":28992,"date":"2023-02-21T04:34:14","date_gmt":"2023-02-21T03:34:14","guid":{"rendered":"https:\/\/www.markhendriksen.com\/?p=28992"},"modified":"2023-09-26T05:53:10","modified_gmt":"2023-09-26T03:53:10","slug":"how-to-create-a-divi-timeline-layout","status":"publish","type":"post","link":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/","title":{"rendered":"How to Create a Divi Timeline Layout"},"content":{"rendered":"\n<p><strong>Want to create an impressive Divi timeline layout for your website?<\/strong><\/p>\n\n\n\n<p>Creating a Divi Timeline layout is an easy way to break up the look of your site with timelines. It\u2019s a great tool for highlighting dates and milestones in history or within your company, as well as providing visitors with an easier way to navigate through content.&nbsp;<\/p>\n\n\n\n<p>You can easily create this type of layout from scratch or with the help of a plugin.<\/p>\n\n\n\n<p>With the right Divi timeline module, creating timeline layouts has never been easier! The best plugins allow you to quickly design beautiful layouts while keeping them dynamic and interactive \u2013 perfect for any online business! <\/p>\n\n\n\n<p>These plugins will save you time when building your pages and make it fun to display information in an engaging and visually appealing manner.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Table of contents<\/h3>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li><a href=\"#divi-timeline-tutorial\">How to create a Divi timeline from scratch<\/a><\/li><li><a href=\"#divi-timeline-et\">Divi timeline tutorials by Elegant Themes<\/a><\/li><li><a href=\"#timeline-plugins\">The best Divi plugins to create a timeline layout<\/a><\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"divi-timeline-tutorial\">How to create a Divi timeline from scratch<\/h2>\n\n\n\n<p>The <a href=\"https:\/\/www.markhendriksen.com\/how-to-make-a-website-with-wordpress-and-divi-theme\/\">Divi Theme<\/a> doesn&#8217;t come with a timeline module but we can create one from scratch. I will guide you step-by-step on how to create a Divi timeline layout.<\/p>\n\n\n\n<p>I have created a timeline layout in Divi with a scroll animation effect. You can view the demo here:<\/p>\n\n\n<div class=\"gb-button-wrapper gb-button-wrapper-3d840ae7\">\n\n<a class=\"gb-button gb-button-72c9ce72 gb-button-text button-for-posts\" href=\"https:\/\/www.demo.markhendriksen.com\/divi-timeline\/\" target=\"_blank\" rel=\"noopener noreferrer\">See the Demo<\/a>\n\n<\/div>\n\n\n<h3 class=\"wp-block-heading\">Step 1: Create a section<\/h3>\n\n\n\n<p>Enable the visual builder on any page and start by inserting a new section. Use the following settings for this section:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Content tab<\/h4>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Background color: #eef0f7<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-background-color.jpg\" alt=\"Section background color\" class=\"wp-image-29019\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-background-color.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-background-color-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-background-color-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-background-color-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-background-color-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-background-color-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Design tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Spacing:<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>top and bottom padding 150px<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-padding.jpg\" alt=\"Section padding\" class=\"wp-image-29020\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-padding.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-padding-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-padding-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-padding-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-padding-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Section-padding-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 2: Create a row<\/h3>\n\n\n\n<p>Place a 2-column row in the section and use the following settings for this row.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Design tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Sizing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Enable the use of custom gutter width.<\/li><li>Set the custom gutter width to 1.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-custom-gutter-width.jpg\" alt=\"Gutter width for the row\" class=\"wp-image-29021\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-custom-gutter-width.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-custom-gutter-width-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-custom-gutter-width-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-custom-gutter-width-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-custom-gutter-width-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-custom-gutter-width-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p class=\"tut-tabs\"><strong>Spacing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the top and bottom padding to 50px.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-padding-for-the-row.jpg\" alt=\"Padding for the row\" class=\"wp-image-29022\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-padding-for-the-row.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-padding-for-the-row-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-padding-for-the-row-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-padding-for-the-row-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-padding-for-the-row-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-padding-for-the-row-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Advanced tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Position<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Under position set the z-index to 1.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-z-index-to-1.jpg\" alt=\"Set the z-index of the row\" class=\"wp-image-29023\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-z-index-to-1.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-z-index-to-1-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-z-index-to-1-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-z-index-to-1-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-z-index-to-1-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-z-index-to-1-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p class=\"tut-tabs\"><strong>Scroll effects<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Enable vertical motion<\/li><li>Set starting to 0<\/li><li>Set mid to 0 and 35%<\/li><li>Set end to -2.5<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-vertical-motion.jpg\" alt=\"Set a vertical position\" class=\"wp-image-29025\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-vertical-motion.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-vertical-motion-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-vertical-motion-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-vertical-motion-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-vertical-motion-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-a-vertical-motion-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Switch to responsive tab &gt; tablet<\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the ending to 0%<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-ending-to-0.jpg\" alt=\"Set the ending to zero\" class=\"wp-image-29026\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-ending-to-0.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-ending-to-0-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-ending-to-0-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-ending-to-0-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-ending-to-0-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-ending-to-0-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Switch to Fading in and out tab. Then back to the desktop tab. And use the following settings:<\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Enabling Fading in and out<\/li><li>Starting 25%<\/li><li>Mid 100%<\/li><li>Ending 25%<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Fade-in-settings.jpg\" alt=\"Fade in settings\" class=\"wp-image-29027\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Fade-in-settings.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Fade-in-settings-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Fade-in-settings-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Fade-in-settings-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Fade-in-settings-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Fade-in-settings-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Switch to responsive tab &gt; tablet<\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the starting and ending to 100%.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-starting-and-ending-to-100.jpg\" alt=\"Set the starting and ending to 100\" class=\"wp-image-29028\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-starting-and-ending-to-100.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-starting-and-ending-to-100-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-starting-and-ending-to-100-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-starting-and-ending-to-100-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-starting-and-ending-to-100-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-starting-and-ending-to-100-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 3: First column<\/h3>\n\n\n\n<p>Open the first column of this row.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Open-the-first-column.jpg\" alt=\"Open the first column\" class=\"wp-image-29029\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Open-the-first-column.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Open-the-first-column-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Open-the-first-column-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Open-the-first-column-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Open-the-first-column-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Open-the-first-column-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Go to the Design tab and set the right padding to 50px.<\/p>\n\n\n\n<p>After that switch to the tablet and set the right padding to 0px.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-right-padding-to-50px.jpg\" alt=\"Set the right padding to 50px\" class=\"wp-image-29030\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-right-padding-to-50px.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-right-padding-to-50px-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-right-padding-to-50px-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-right-padding-to-50px-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-right-padding-to-50px-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-right-padding-to-50px-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Place an image module in the first column and place an image in the image tab.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/place-an-image-module.jpg\" alt=\"Place an image module\" class=\"wp-image-29031\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/place-an-image-module.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/place-an-image-module-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/place-an-image-module-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/place-an-image-module-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/place-an-image-module-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/place-an-image-module-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Then go over to the Design tab and set the alignment to Right.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Step 4: Second column<\/h3>\n\n\n\n<p>Place a blurb module in this column.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Content tab<\/h4>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>In the Title field place a year number.<\/li><li>In the image field place an image (I used an image of 50x50px)<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Place-an-image-in-the-blurb-module.jpg\" alt=\"Place an image in the blurb module\" class=\"wp-image-29033\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Place-an-image-in-the-blurb-module.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Place-an-image-in-the-blurb-module-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Place-an-image-in-the-blurb-module-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Place-an-image-in-the-blurb-module-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Place-an-image-in-the-blurb-module-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Place-an-image-in-the-blurb-module-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Design tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Image &amp; Icon<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the image placement to the left<\/li><li>Set the image\/icon width to 50px<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-image-placement.jpg\" alt=\"Blurb image placement\" class=\"wp-image-29034\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-image-placement.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-image-placement-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-image-placement-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-image-placement-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-image-placement-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-image-placement-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p class=\"tut-tabs\"><strong>Sizing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the blurb content width to 1100px<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-content-width.jpg\" alt=\"Blurb content width\" class=\"wp-image-29035\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-content-width.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-content-width-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-content-width-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-content-width-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-content-width-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-content-width-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p class=\"tut-tabs\"><strong>Spacing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the spacing for the desktop to 75px top margin and -40px left margin.<\/li><li>For tablet\/mobile to 25px top padding and 0px left padding.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-spacing.jpg\" alt=\"Blurrb spacing settings\" class=\"wp-image-29036\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-spacing.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-spacing-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-spacing-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-spacing-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-spacing-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Blurb-spacing-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Advanced tab<\/h4>\n\n\n\n<p>Under custom CSS field &gt; blurb image place this in it:<\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set padding-left to 15px<\/li><\/ul>\n\n\n\n<p>Under custom CSS field &gt; blurb title place this in it:<\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set margin-top to 7px<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"361\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Custom-CSS-for-blurb-module.jpg\" alt=\"Custom CSS for blurb module\" class=\"wp-image-29037\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Custom-CSS-for-blurb-module.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Custom-CSS-for-blurb-module-380x202.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Custom-CSS-for-blurb-module-300x159.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Custom-CSS-for-blurb-module-510x271.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Custom-CSS-for-blurb-module-113x60.jpg 113w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Custom-CSS-for-blurb-module-170x90.jpg 170w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Place a text module under the blurb module.<\/p>\n\n\n\n<p>This will be the title for your first timeline. You can use an h2 or h3 title if you like I went with just text.<\/p>\n\n\n\n<p>In the Design tab, I use the following settings under Text.<\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Text Font Weight: Bold<\/li><li>Text Font Size: 24px<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"415\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-title-settings.jpg\" alt=\"Title settings\" class=\"wp-image-29038\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-title-settings.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-title-settings-380x232.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-title-settings-300x183.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-title-settings-510x311.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-title-settings-98x60.jpg 98w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Set-the-title-settings-147x90.jpg 147w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p class=\"tut-tabs\"><strong>Spacing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set margin-left to 42px<\/li><li>Set margin-left for tablet\/mobile to 0px<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"415\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Padding-for-title.jpg\" alt=\"Title left margin\" class=\"wp-image-29041\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Padding-for-title.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Padding-for-title-380x232.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Padding-for-title-300x183.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Padding-for-title-510x311.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Padding-for-title-98x60.jpg 98w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Padding-for-title-147x90.jpg 147w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Place another text module under this one and place a text here.<\/p>\n\n\n\n<p class=\"tut-tabs\"><strong>Spacing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set margin-left: 42px<\/li><li>Set margin-left for tablet\/mobile 0px.<\/li><li>Set padding-top: 15px.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"415\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Settings-for-text-field-spacing.jpg\" alt=\"Text padding and margin\" class=\"wp-image-29042\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Settings-for-text-field-spacing.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Settings-for-text-field-spacing-380x232.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Settings-for-text-field-spacing-300x183.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Settings-for-text-field-spacing-510x311.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Settings-for-text-field-spacing-98x60.jpg 98w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Settings-for-text-field-spacing-147x90.jpg 147w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 5: Duplicate the row<\/h3>\n\n\n\n<p>From here you can duplicate the first row and change your content in the text modules.<\/p>\n\n\n\n<p>You can make as many rows as you like.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"415\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Duplicate-row.jpg\" alt=\"Duplicate row\" class=\"wp-image-29043\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Duplicate-row.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Duplicate-row-380x232.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Duplicate-row-300x183.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Duplicate-row-510x311.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Duplicate-row-98x60.jpg 98w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Duplicate-row-147x90.jpg 147w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Step 6: Add middle line<\/h3>\n\n\n\n<p>Create a new row at the bottom and choose a 1-column structure.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Design tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Sizing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the height to 100%<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"560\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Row-for-the-midle-line.jpg\" alt=\"Row for the middle line\" class=\"wp-image-31964\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Row-for-the-midle-line.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Row-for-the-midle-line-380x313.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Row-for-the-midle-line-300x247.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Row-for-the-midle-line-510x420.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Row-for-the-midle-line-73x60.jpg 73w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Row-for-the-midle-line-109x90.jpg 109w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p class=\"tut-tabs\"><strong>Spacing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set padding-top to 0px<\/li><li>Set padding-bottom to 0px<\/li><\/ul>\n\n\n\n<h4 class=\"wp-block-heading\">Advanced tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Visibility<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Disable on mobile and tablet<\/li><\/ul>\n\n\n\n<p class=\"tut-tabs\"><strong>Position<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set to absolute<\/li><li>Set the position to top center<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"548\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Set-the-center-line-to-absolute-and-top-center.jpg\" alt=\"Set the center line to absolute and top center\" class=\"wp-image-31965\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Set-the-center-line-to-absolute-and-top-center.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Set-the-center-line-to-absolute-and-top-center-380x306.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Set-the-center-line-to-absolute-and-top-center-300x242.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Set-the-center-line-to-absolute-and-top-center-510x411.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Set-the-center-line-to-absolute-and-top-center-74x60.jpg 74w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Set-the-center-line-to-absolute-and-top-center-112x90.jpg 112w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Place a Divider module in this row.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Content tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Background<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the background color to #9e9e9e<\/li><\/ul>\n\n\n\n<h4 class=\"wp-block-heading\">Design tab<\/h4>\n\n\n\n<p class=\"tut-tabs\"><strong>Sizing<\/strong><\/p>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\"><li>Set the width to 1px<\/li><li>Set the module alignment to the center<\/li><li>Set the height to 100%<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"553\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Settings-for-the-divider.jpg\" alt=\"Settings for the divider\" class=\"wp-image-31967\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Settings-for-the-divider.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Settings-for-the-divider-380x309.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Settings-for-the-divider-300x244.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Settings-for-the-divider-510x415.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Settings-for-the-divider-74x60.jpg 74w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/09\/Settings-for-the-divider-111x90.jpg 111w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"divi-timeline-et\">Divi timeline tutorials by Elegant Themes<\/h2>\n\n\n\n<p>This Divi timeline layout is created by Elegant Themes and provides a simple, step-by-step guide to help you build the timeline design from the ground up.<\/p>\n\n\n\n<p>As you scroll down the page, an eye-catching red dot follows along and highlights each icon as it moves through the process.<\/p>\n\n\n\n<p>It&#8217;s designed to be mobile friendly too &#8211; so no matter which device you use, you can easily adjust the look and feel of your timeline to fit with your website&#8217;s branding and style.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"383\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Elegant-Themes-timeline-tutorial.jpg\" alt=\"Elegant Themes timeline \" class=\"wp-image-29044\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Elegant-Themes-timeline-tutorial.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Elegant-Themes-timeline-tutorial-380x214.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Elegant-Themes-timeline-tutorial-300x169.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Elegant-Themes-timeline-tutorial-510x287.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Elegant-Themes-timeline-tutorial-107x60.jpg 107w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Elegant-Themes-timeline-tutorial-160x90.jpg 160w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>The tutorial starts out with adding new elements to the page such as a row, section, or module; then adding background colors, animations, images, and icons.<\/p>\n\n\n\n<p>After setting up the basic layout, you&#8217;ll want to add a unique touch that helps bring your timeline design to life &#8211; for example, by setting up an animation effect so that when you scroll down the page a red dot appears in sync with each step of your process.<\/p>\n\n\n\n<p>Get started with this Divi timeline tutorial<\/p>\n\n\n<div class=\"gb-button-wrapper gb-button-wrapper-2efcab37\">\n\n<a class=\"gb-button gb-button-f4b89b02 gb-button-text button-for-posts\" href=\"https:\/\/www.elegantthemes.com\/affiliates\/idevaffiliate.php?id=44891&amp;url=79054\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Go to tutorial<\/a>\n\n<\/div>\n\n\n<h3 class=\"wp-block-heading\">Horizontal timeline<\/h3>\n\n\n\n<p>This is another tutorial by Elegant Themes for a horizontal timeline layout created with 3 blurb modules.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"312\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Horizontal-timeline.jpg\" alt=\"Horizontal timeline\" class=\"wp-image-29045\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Horizontal-timeline.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Horizontal-timeline-380x174.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Horizontal-timeline-300x138.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Horizontal-timeline-510x234.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Horizontal-timeline-131x60.jpg 131w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Horizontal-timeline-196x90.jpg 196w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>It is an easy and simple-to-follow tutorial to add a timeline to your Divi website. You can find this tutorial here.<\/p>\n\n\n<div class=\"gb-button-wrapper gb-button-wrapper-20a3a763\">\n\n<a class=\"gb-button gb-button-b6daa4e0 gb-button-text button-for-posts\" href=\"https:\/\/www.elegantthemes.com\/affiliates\/idevaffiliate.php?id=44891&amp;url=79055\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Go to tutorial<\/a>\n\n<\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"timeline-plugins\">The best Divi plugins to create a timeline layout<\/h2>\n\n\n\n<p>Divi Timeline modules make it easy to create beautiful, responsive timelines using the <a href=\"https:\/\/www.markhendriksen.com\/divi-builder-plugin-review-by-elegant-themes\/\">Divi Builder<\/a>. These modules come with tons of extra design options for your timelines.<\/p>\n\n\n\n<p>Take a look at some of the best Divi timeline layouts on the marketplace.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Divi Supreme Timeline Module<\/h3>\n\n\n\n<p>The <a href=\"https:\/\/www.markhendriksen.com\/divi-supreme-plugin-review\/\">Divi Supreme<\/a> Content Timeline Module is an incredibly powerful and user-friendly tool that can be used to create dynamic timelines of your content with ease.<\/p>\n\n\n\n<p>The Divi timeline module makes it easy for designers of any experience level to create compelling timelines with just a few clicks.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"828\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Supreme-timeline-module.jpg\" alt=\"Divi Supreme timeline module\" class=\"wp-image-29046\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Supreme-timeline-module.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Supreme-timeline-module-380x463.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Supreme-timeline-module-246x300.jpg 246w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Supreme-timeline-module-510x621.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Supreme-timeline-module-49x60.jpg 49w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Supreme-timeline-module-74x90.jpg 74w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>Thanks to its user-friendly interface, you can generate gorgeous visual timelines quickly and effortlessly.<\/p>\n\n\n\n<p>The Divi timeline module also provides a number of advanced features. With the ability to add images, and videos, customize fonts and colors, as well as animate elements on the timeline &#8211; there is no limit to what you can do!<\/p>\n\n\n\n<p>This makes it possible to craft an engaging story or timeline without needing any knowledge of coding or web design.<\/p>\n\n\n<div class=\"gb-button-wrapper gb-button-wrapper-f673d769\">\n\n<a class=\"gb-button gb-button-5635c91e gb-button-text button-for-posts\" href=\"https:\/\/www.elegantthemes.com\/affiliates\/idevaffiliate.php?id=44891&amp;url=78578\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">See the Demo<\/a>\n\n<\/div>\n\n\n<h3 class=\"wp-block-heading\">Divi Plus Timeline Module<\/h3>\n\n\n\n<p>The Divi Plus Timeline module allows you to bring an eye-catching look to your website. It&#8217;s designed specifically for creating engaging vertical timelines that tell stories about businesses, careers, or lives.<\/p>\n\n\n\n<p>With this module, you can easily show images, event dates, and other information in your Divi timeline without needing to know CSS or any complex coding.<\/p>\n\n\n\n<p>No matter what type of story you&#8217;re trying to tell on your website, the Divi Plus Timeline module makes it easy to do so with visually appealing and professionally constructed timelines.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"566\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Plus-timeline-layout-module.jpg\" alt=\"Divi Plus timeline layout module\" class=\"wp-image-29047\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Plus-timeline-layout-module.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Plus-timeline-layout-module-380x316.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Plus-timeline-layout-module-300x250.jpg 300w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Plus-timeline-layout-module-510x425.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Plus-timeline-layout-module-72x60.jpg 72w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Plus-timeline-layout-module-108x90.jpg 108w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>You can choose from several different styling options according to the look you want for the timeline.<\/p>\n\n\n\n<p>You can adjust the font size and color of text elements such as headings and descriptions, as well as change the alignment of text elements like titles and subtitles.<\/p>\n\n\n\n<p>You can also choose from several different background colors that will help ensure your timeline stands out from other content on the page.<\/p>\n\n\n\n<p>Furthermore, if you need more control over your timeline\u2019s appearance, you can also customize its individual elements using custom CSS code.<\/p>\n\n\n<div class=\"gb-button-wrapper gb-button-wrapper-5b3cfa46\">\n\n<a class=\"gb-button gb-button-471aed4b gb-button-text button-for-posts\" href=\"https:\/\/www.elegantthemes.com\/affiliates\/idevaffiliate.php?id=44891&amp;url=78581\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">See the Demo<\/a>\n\n<\/div>\n\n\n<h3 class=\"wp-block-heading\">Divi Pixel plugin<\/h3>\n\n\n\n<p>It is important that websites are optimized to be viewed on mobile devices, and the Divi Pixel Timeline Module makes it easy to customize your timeline layout for any device.<\/p>\n\n\n\n<p>This module has specific settings for desktop, tablet, and mobile users so that each element of the timeline can be adjusted to your specifications \u2013 this includes changes to the text, the line separator between events, and even icons.<\/p>\n\n\n\n<p>With these settings, you can make sure that your timeline looks great on any device without compromising its functionality or readability.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"807\" src=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Pixel-Timeline-module.jpg\" alt=\"Divi Pixel Timeline module\" class=\"wp-image-29048\" srcset=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Pixel-Timeline-module.jpg 680w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Pixel-Timeline-module-380x451.jpg 380w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Pixel-Timeline-module-253x300.jpg 253w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Pixel-Timeline-module-510x605.jpg 510w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Pixel-Timeline-module-51x60.jpg 51w, https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Pixel-Timeline-module-76x90.jpg 76w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>In addition to these responsive settings, this Divi Timeline Module also provides plenty of additional options so you can customize it in order to create a beautiful timeline for your website.<\/p>\n\n\n\n<p>You&#8217;ll have control over how many events appear at once on a timeline, how far apart those events are spaced out from each other, what type of transition is used when moving from event to event, whether or not icons should appear alongside each item in the timeline, as well as color and font customizations.<\/p>\n\n\n\n<p>These features combine to give you full control over how your timeline looks so you can ensure it stands out amongst all of your other content.<\/p>\n\n\n<div class=\"gb-button-wrapper gb-button-wrapper-90b465a7\">\n\n<a class=\"gb-button gb-button-332111fc gb-button-text button-for-posts\" href=\"https:\/\/www.elegantthemes.com\/affiliates\/idevaffiliate.php?id=44891&amp;url=78587\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">See the Demo<\/a>\n\n<\/div>\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>Overall, creating a Divi timeline layout for your website is a great way to add some interactivity and visual interest to your site.<\/p>\n\n\n\n<p>I hope you liked this step-by-step tutorial on how to create a Divi timeline, and if you have any questions just let me know in the comments below.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">You might also like<\/h3>\n\n\n\n<ul class=\"listsquare listsquare-single wp-block-list\">\n<li><a href=\"https:\/\/www.markhendriksen.com\/wordpress-speed-optimization-guide\/\">How To Speed Up Your Divi Website (Guide)<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.markhendriksen.com\/divi-child-theme-essential-guide\/\">How to Make a Divi Child Theme<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.markhendriksen.com\/how-to-make-a-website-with-wordpress-and-divi-theme\/\">How to Make a Website With Divi Theme in 2024<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.markhendriksen.com\/best-divi-plugins\/\">The Best Divi Plugins For 2024<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.markhendriksen.com\/best-divi-child-themes\/\">The Best Divi Child Themes For 2024<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.markhendriksen.com\/10-divi-woocommerce-layouts\/\">The Best Divi WooCommerce Layouts For 2024<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/www.markhendriksen.com\/how-to-choose-the-best-hosting-for-your-divi-website\/\">How To Choose The Best Divi Hosting In 2024<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Want to create an impressive Divi timeline layout for your website? Creating a Divi Timeline layout is an easy way to break up the look of your site with timelines. It\u2019s a great tool for highlighting dates and milestones in history or within your company, as well as providing visitors with an easier way to [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":29050,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[29],"tags":[],"class_list":["post-28992","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-divi-tutorials"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.1.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Create a Divi Timeline Layout | MarkHendriksen.com<\/title>\n<meta name=\"description\" content=\"Learn how easy it is to create an amazing Divi timeline layout for your website using this step-by-step guide.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Create a Divi Timeline Layout | MarkHendriksen.com\" \/>\n<meta property=\"og:description\" content=\"Learn how easy it is to create an amazing Divi timeline layout for your website using this step-by-step guide.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/\" \/>\n<meta property=\"og:site_name\" content=\"Mark Hendriksen\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/madebymarkhendriksen\" \/>\n<meta property=\"article:published_time\" content=\"2023-02-21T03:34:14+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-09-26T03:53:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"720\" \/>\n\t<meta property=\"og:image:height\" content=\"400\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Mark Hendriksen\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Mark Hendriksen\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"13 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/\"},\"author\":{\"name\":\"Mark Hendriksen\",\"@id\":\"https:\/\/www.markhendriksen.com\/#\/schema\/person\/d40c4ac37512479c71b48ad2879fb765\"},\"headline\":\"How to Create a Divi Timeline Layout\",\"datePublished\":\"2023-02-21T03:34:14+00:00\",\"dateModified\":\"2023-09-26T03:53:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/\"},\"wordCount\":1625,\"commentCount\":4,\"publisher\":{\"@id\":\"https:\/\/www.markhendriksen.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg\",\"articleSection\":[\"Divi tutorials\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/\",\"url\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/\",\"name\":\"How to Create a Divi Timeline Layout | MarkHendriksen.com\",\"isPartOf\":{\"@id\":\"https:\/\/www.markhendriksen.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg\",\"datePublished\":\"2023-02-21T03:34:14+00:00\",\"dateModified\":\"2023-09-26T03:53:10+00:00\",\"description\":\"Learn how easy it is to create an amazing Divi timeline layout for your website using this step-by-step guide.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage\",\"url\":\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg\",\"contentUrl\":\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg\",\"width\":720,\"height\":400,\"caption\":\"Divi Timeline Layout\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.markhendriksen.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Divi tutorials\",\"item\":\"https:\/\/www.markhendriksen.com\/divi-tutorials\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to Create a Divi Timeline Layout\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.markhendriksen.com\/#website\",\"url\":\"https:\/\/www.markhendriksen.com\/\",\"name\":\"Mark Hendriksen\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.markhendriksen.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.markhendriksen.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.markhendriksen.com\/#organization\",\"name\":\"Mark Hendriksen\",\"url\":\"https:\/\/www.markhendriksen.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.markhendriksen.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2021\/01\/Mark-Hendriksen-Logo.png\",\"contentUrl\":\"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2021\/01\/Mark-Hendriksen-Logo.png\",\"width\":354,\"height\":40,\"caption\":\"Mark Hendriksen\"},\"image\":{\"@id\":\"https:\/\/www.markhendriksen.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/madebymarkhendriksen\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.markhendriksen.com\/#\/schema\/person\/d40c4ac37512479c71b48ad2879fb765\",\"name\":\"Mark Hendriksen\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.markhendriksen.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/1416c89ed4da57b902960a21b7fa25cb91558d39eff48c8b5017bd4c9bcc59a9?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/1416c89ed4da57b902960a21b7fa25cb91558d39eff48c8b5017bd4c9bcc59a9?s=96&d=mm&r=g\",\"caption\":\"Mark Hendriksen\"},\"url\":\"https:\/\/www.markhendriksen.com\/author\/twopixels\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Create a Divi Timeline Layout | MarkHendriksen.com","description":"Learn how easy it is to create an amazing Divi timeline layout for your website using this step-by-step guide.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/","og_locale":"en_US","og_type":"article","og_title":"How to Create a Divi Timeline Layout | MarkHendriksen.com","og_description":"Learn how easy it is to create an amazing Divi timeline layout for your website using this step-by-step guide.","og_url":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/","og_site_name":"Mark Hendriksen","article_publisher":"https:\/\/www.facebook.com\/madebymarkhendriksen","article_published_time":"2023-02-21T03:34:14+00:00","article_modified_time":"2023-09-26T03:53:10+00:00","og_image":[{"width":720,"height":400,"url":"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg","type":"image\/jpeg"}],"author":"Mark Hendriksen","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Mark Hendriksen","Est. reading time":"13 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#article","isPartOf":{"@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/"},"author":{"name":"Mark Hendriksen","@id":"https:\/\/www.markhendriksen.com\/#\/schema\/person\/d40c4ac37512479c71b48ad2879fb765"},"headline":"How to Create a Divi Timeline Layout","datePublished":"2023-02-21T03:34:14+00:00","dateModified":"2023-09-26T03:53:10+00:00","mainEntityOfPage":{"@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/"},"wordCount":1625,"commentCount":4,"publisher":{"@id":"https:\/\/www.markhendriksen.com\/#organization"},"image":{"@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage"},"thumbnailUrl":"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg","articleSection":["Divi tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/","url":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/","name":"How to Create a Divi Timeline Layout | MarkHendriksen.com","isPartOf":{"@id":"https:\/\/www.markhendriksen.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage"},"image":{"@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage"},"thumbnailUrl":"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg","datePublished":"2023-02-21T03:34:14+00:00","dateModified":"2023-09-26T03:53:10+00:00","description":"Learn how easy it is to create an amazing Divi timeline layout for your website using this step-by-step guide.","breadcrumb":{"@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#primaryimage","url":"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg","contentUrl":"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2023\/02\/Divi-Timeline-Layout.jpg","width":720,"height":400,"caption":"Divi Timeline Layout"},{"@type":"BreadcrumbList","@id":"https:\/\/www.markhendriksen.com\/how-to-create-a-divi-timeline-layout\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.markhendriksen.com\/"},{"@type":"ListItem","position":2,"name":"Divi tutorials","item":"https:\/\/www.markhendriksen.com\/divi-tutorials\/"},{"@type":"ListItem","position":3,"name":"How to Create a Divi Timeline Layout"}]},{"@type":"WebSite","@id":"https:\/\/www.markhendriksen.com\/#website","url":"https:\/\/www.markhendriksen.com\/","name":"Mark Hendriksen","description":"","publisher":{"@id":"https:\/\/www.markhendriksen.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.markhendriksen.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.markhendriksen.com\/#organization","name":"Mark Hendriksen","url":"https:\/\/www.markhendriksen.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.markhendriksen.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2021\/01\/Mark-Hendriksen-Logo.png","contentUrl":"https:\/\/www.markhendriksen.com\/wp-content\/uploads\/2021\/01\/Mark-Hendriksen-Logo.png","width":354,"height":40,"caption":"Mark Hendriksen"},"image":{"@id":"https:\/\/www.markhendriksen.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/madebymarkhendriksen"]},{"@type":"Person","@id":"https:\/\/www.markhendriksen.com\/#\/schema\/person\/d40c4ac37512479c71b48ad2879fb765","name":"Mark Hendriksen","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.markhendriksen.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/1416c89ed4da57b902960a21b7fa25cb91558d39eff48c8b5017bd4c9bcc59a9?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/1416c89ed4da57b902960a21b7fa25cb91558d39eff48c8b5017bd4c9bcc59a9?s=96&d=mm&r=g","caption":"Mark Hendriksen"},"url":"https:\/\/www.markhendriksen.com\/author\/twopixels\/"}]}},"_links":{"self":[{"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/posts\/28992","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/comments?post=28992"}],"version-history":[{"count":3,"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/posts\/28992\/revisions"}],"predecessor-version":[{"id":31968,"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/posts\/28992\/revisions\/31968"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/media\/29050"}],"wp:attachment":[{"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/media?parent=28992"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/categories?post=28992"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.markhendriksen.com\/wp-json\/wp\/v2\/tags?post=28992"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}