Adding a Divi timeline to your website allows you to display events chronologically in a visually simple style that is quick and easy for your viewers to understand.
By using a timeline, you are able to display your information more clearly than using standard text and ensure your key information is understood. There are many situations where you may want to add a timeline to your Divi website, but some of the most common use cases would include;
- To display your company history timeline
- To display your product updates timeline
- To display your work experience timeline
- To display your project roadmap timeline
There are a few different options to add a timeline in Divi including;
- Use a Divi plugin that is designed for creating timelines or one that features a timeline module
- Use a pre-made Divi timeline layout
- Create a timeline yourself from scratch in Divi using various default Divi modules
In this article, we’ll compare the most popular ways to add timeline elements to your Divi website.
Affiliate disclosure* – Links to layouts on Elegant Themes and 3rd party websites may contain affiliate code. You will never pay any extra for using these links. Thanks for supporting Divi Theme Examples.
Your options for creating a Divi timeline
- Divi timeline layout
- Divi timeline plugins
- Build it from scratch yourself
1. Using a Divi timeline layout
There are many free and premium Divi timeline layouts available to download that range in price from free to around $30.
Using a premade Divi timeline layout is a quick and easy way to add a timeline to your website without the need to design one yourself from scratch. There are a number of free timeline layouts available that cover most use cases. To use a timeline layout you can usually just drag and drop the layout file onto your Divi page and edit the content with your own.
For those of you running an agency or building lots of websites, you may want to buy one of the timeline layout packs that include multiple timeline designs in a single package. From what I have seen, the premium timeline layouts rarely offer any more advanced features or better designs than the free ones available to download but you do get a larger choice of designs.
The layouts released by Elegant Themes on their blog all come with an in-depth tutorial of how the layout was created so you can either just download and use the layout, or use the tutorial to build the layout yourself. Whilst it takes a lot longer, following the tutorial will give you valuable Divi skills so you are able to create your own layouts using Divi in the future.
Below are a few of the best Divi timeline layouts available to buy or download for free.
Divi timeline layout with scroll effects layout (+ tutorial)
This Divi layout is created by Elegant Themes and comes with a step-by-step tutorial so you can create the layout yourself from scratch. The timeline uses scroll effects to animate a red dot that animates down the timeline and highlights the icon as it passes each step of the process. This timeline is optimized to display nicely on mobile devices too and would be easy to customize to your own website branding and style.
Price – FREE
More information
Elegant Theme anniversary layout pack
This Divi timeline layout was created by Elegant Themes for their 10th anniversary and is available to download for free. The design is for a full-page timeline that covers the various achievements that have occurred year by year. This layout allows you to include a large amount of information for each year, or step of a process, and can easily be used as a standard WordPress page or as part of a blog post.
There is no tutorial for this layout as usual with Elegant Themes but you are able to download the layout file using the download button located at the bottom of the page before the comments section.
Price – FREE
More information
Divi gallery timeline layout
This Divi layout is created by Elegant Themes and comes with a step-by-step tutorial so you can create the layout yourself from scratch. This layout is a vertical sticky timeline to display gallery images by year and month. As the user scrolls down the page, the images associated with that year and month will stick to the top of the screen until the next month’s images scroll onto the screen. You can easily swap the image galleries for your own content and swap the year and month titles to suit your needs too.
Price – FREE
More information
Divi Blurb module timeline layout
This Divi layout is created by Elegant Themes and comes with a step-by-step tutorial so you can create the layout yourself from scratch. This layout uses the Divi Blurb module to create a simple 3-step process Divi timeline horizontally for your website. The design is a vertical timeline for desktop devices and on mobile, the 3 Blurb modules will stack on top of each other.
Price – FREE
More information
Divi timeline layout pack (paid)
This Divi layout is created by Divi Professional and is available to buy from the official Divi marketplace and comes with 210 timeline designs to choose from. If you are an agency creating many websites with timelines then this large pack may be useful.
The layout pack includes;
- 150 Vertical Timeline
- 10 Horizontal Timeline
- 15 Blog Vertical Timeline
- 15 Blog Horizontal Timeline
- 10 Woo Vertical Timeline
- 10 Woo Horizontal Timeline
Price – $19
More information
2. Using a Divi timeline plugin
Most of the multi-feature Divi plugins offer a timeline module as part of their multi-feature plugin and there are a few Divi plugins that are designed solely to create a timeline on your website.
The multi-feature plugins mostly have very nice designs and features and offer great value as the timeline feature is only 1 of many features offered by the plugin.
There are also a number of WordPress timeline plugins that work with Divi and offer advanced design and features for your timeline. We often search only for Divi timeline plugins but using a general WordPress timeline plugin is often a great option too. Elegant Themes have a good roundup of WordPress timeline plugins on your blog if you want to check out this option further.
Below are a few of the Divi-specific plugins that either are created for timelines or have a timeline module included as part of a multi-feature plugin.
Divi Plus plugin timeline module
The DiviPlus plugin is a multi-feature plugin by Divi Extended that includes a timeline module for creating timelines on your website. Divi Plus is currently the 5th most popular plugin in the Divi marketplace and has a number of good reviews. The timeline module comes with a number of stylish designs and as part of the whole plugin offers great value.
Timeline module features;
- Use Image on Stem or on Item
- Multiple Layout Option
- Styling Option For Single Timeline Item
- Sideline Alignment For Mobile
This plugin is available to buy via the Elegant Themes marketplace.
Buy via the Elegant Themes official marketplace;
- This plugin is available to buy via the Elegant Themes marketplace as an unlimited site license for $79.00.
- The price includes 1 year of updates and support.
- There is a 30-day money-back guarantee when buying products via the Elegant Themes marketplace.
Price – $79
More information
Divi Essential plugin timeline module
The Divi Essential plugin is a multi-feature plugin created by Divi Next that includes the Divi Next timeline module for creating timelines on your website. You can use the model to create your own timeline or download one of the pre-designed timeline layouts that are compatible with the plugin.
This plugin is available to buy via the Elegant Themes marketplace or via the developers’ website at Divi Next.
Buy via the Elegant Themes official marketplace;
- This plugin is available to buy via the Elegant Themes marketplace as an unlimited site license for $79.00.
- The price includes 1 year of updates and support.
- There is a 30-day money-back guarantee when buying products via the Elegant Themes marketplace.
Price – $79
More information
Divi Timeline Plus plugin
The Divi Timeline Plus plugin is a 3rd party plugin designed specifically for creating timelines on your website and comes with a number of horizontal and vertical Divi timeline templates to choose from.
This plugin is available to buy via the Elegant Themes marketplace.
Buy via the Elegant Themes official marketplace;
- This plugin is available to buy via the Elegant Themes marketplace as an unlimited site license for $12.00.
- The price includes 1 year of updates and support.
- There is a 30-day money-back guarantee when buying products via the Elegant Themes marketplace.
Price – $12
More information
Divi Pixel plugin timeline module
The Divi pixel plugin is a multi-feature plugin that includes the Divi Pixel timeline module for creating timelines on your website.
The layout pack includes;
- Add date for each timeline item
- Responsive layout settings
- Individual settings for each item
- Interactive timeline line and icons
- Add links/buttons to each timeline card
- 3 Timeline Layouts (Mixed/Left/Right)
- Custom CSS for all elements
The Divi Pixel plugin is available to buy directly from the developers at divi-pixel.com with a number of pricing options available. Each pricing option comes with a 14-day money-back guarantee if you are not happy with the plugin.
The cost of the plugin is as follows;
- €49/year for 1 site
- €99/year for 3 sites
- €149/year for unlimited sites
- €299 for unlimited sites and lifetime support & updates
Price – €49+
More information
Which method do you use for your timeline?
As always with Divi and WordPress there are many ways to achieve the same goal and creating a timeline in Divi is no different. For most, a free timeline layout will work but some may prefer the convenience of using a plugin or a feature of a plugin they may already be using.
If you have any comments on this post or have a live example of the Divi timeline on your website you are welcome to drop a comment below.
Divi Supreme also has a timeline module but it is not shown in the description on Elegant Themes but it is on their own website. As the best selling Divi product a lot of people will already have DS. works great too!
Interesting article and very helpful to me. Thank you for publishing this blog. I’ll wait for your next blog!