How to Create a Divi Timeline + Free Layout

How to Create a Divi Timeline + Free Layout

There are plenty of options in Divi to display content besides your standard modules, and being creative with them can pay off. One of the more interesting approaches you can use is to display your content is using timeline.

Timelines are perfect for telling stories and visualizing processes. You can use a timeline to give an overview of events, to highlight important points in time, and reveal things that people might have missed.



Here is a preview of the timeline you can use in your projects.

How to Import the Layout


Step 1. Download Layout


  1. Fill out the form below and from received email download the .zip file. 
  2. Unpack File.

Step 2. Import Layout

  1. Create New Page
  2. Click Import/Export
  3. Choose Divi Space Timeline.json file
  4. Click “Import Divi Builder Layout”

    Step 3. Add CSS

    Divi users can choose between five different methods to add custom CSS to their websitesIn this case, we recommend adding CSS to your divi child theme or using Divi Builder Page Settings of an individual page.


    1. Open up the Divi Page Settings console,

    2. Go to the Advanced Tab and scroll to the Custom CSS box.
    3. Copy CSS from “Timeline CSS” file and paste to the Custom CSS Box.

    Get your Free timeline layout!

    There you have it, with just 3 step you can present your story in the timeline! If you have any questions or suggestions, make sure you leave a comment in the comment section below!