Join our Spam free Facebook group today support@elegantmarketplace.com
  • Your cart is empty.

Divi Timeline Module

Another excellent product by Tortoise IT

*Support is provided by vendors directly. Please click here to access support for individual products
For payment or licensing issues, please click here to access EMP Support

Changelog

*
* < V1.3
* – Initial Release
*
* V1.3
* – Fixed responsive text size/line height issues
* – Added more configuration options in advanced design settings across all modules
*
* V1.4
* – Added new module for posts based timeline
* – Added title, content and gallery modules to compliment post timeline module
*
* V1.5
* – Added more styling settings for each module
* – Fixed bug whereby bullet points didn’t style properly
*

Add to Wish List
View Docs

A lot of developers and designers just love the look and feel that a timeline gives you. Whether you’re presenting a step by step item, showing chronological data or just featuring some interesting content, a timeline can be the right layout of choice. I have created a couple of modules module which do just this. Simply add either of the modules and either add each timeline item, content, read more link then style it OR select where the items should come from (ie, posts, pages, portfolio items!). It couldn’t be easier.

See the excellent blog post written by Randy Brown on the Elegant Themes blog for use cases and how to use as well 

And this one written by Donjetë Vuniqii on The Elegant Themes Mini Series on how to do things with Divi.

This works responsively also. The alternating item layout in the screenshots works when in 1 column mode and in 1/4, 1/3, 1/2 etc the timeline bar is offset to the left (see screenshots). Each timeline item can have it’s own icon, colour, content and/or read more link so you can showcase your content as you see fit. You can also use Advanced Design Settings within the module to change fonts, colours, padding etc.

To use

  • Install the plugin as normal
  • Visit any page with a Divi Page Builder active
  • Add the Timeline module and configure accordingly

Best used in 1 column layout but will work well (and still responsively) in the smaller column layouts.

How the sub-layout works

Using the Posts Timeline module that comes with this plugin you can create a very flexible and configurable layout for your timeline. To make this as flexible as possible we create a layout which is used repeatedly for each item in the timeline.

Making a new layout is simple.. we first create a ‘timeline item’ template in the Divi library (Divi Library > Add new > Layout (non global)). This will feature normally an image, title and content modules.. Once that is saved you can go ahead and set up your timeline module and select in the first option the layout you just made in the Divi library. It works best with 1 or 2 cols in the sub layout but by all means have a tinker and see what you can come up with! I have included three companion modules to aid the creation of new content.. these being title, content and featured image. To make a really cool timeline with loads of extra information try my Advanced Custom Fields module plugin also available in the store here.

For any support issues, please visit this link http://docs.tortoise-it.co.uk/

Licensing

You may install this product on any number of websites that you build for yourself or your clients. You will receive 6 months support and life time updates, after which you may have to purchase a support contract in 6 month packages.

General Note: You MAY need to purchase the Divi Theme or the Elementor page builder to use this product. Please see the product description notes above for more information.

Licensing

You may install this product on any number of websites that you build for yourself or your clients. You will receive 6 months support and life time updates, after which you may have to purchase a support contract in 6 month packages.

Add to Wish List
View Docs

A lot of developers and designers just love the look and feel that a timeline gives you. Whether you’re presenting a step by step item, showing chronological data or just featuring some interesting content, a timeline can be the right layout of choice. I have created a couple of modules module which do just this. Simply add either of the modules and either add each timeline item, content, read more link then style it OR select where the items should come from (ie, posts, pages, portfolio items!). It couldn’t be easier.

See the excellent blog post written by Randy Brown on the Elegant Themes blog for use cases and how to use as well 

And this one written by Donjetë Vuniqii on The Elegant Themes Mini Series on how to do things with Divi.

This works responsively also. The alternating item layout in the screenshots works when in 1 column mode and in 1/4, 1/3, 1/2 etc the timeline bar is offset to the left (see screenshots). Each timeline item can have it’s own icon, colour, content and/or read more link so you can showcase your content as you see fit. You can also use Advanced Design Settings within the module to change fonts, colours, padding etc.

To use

  • Install the plugin as normal
  • Visit any page with a Divi Page Builder active
  • Add the Timeline module and configure accordingly

Best used in 1 column layout but will work well (and still responsively) in the smaller column layouts.

How the sub-layout works

Using the Posts Timeline module that comes with this plugin you can create a very flexible and configurable layout for your timeline. To make this as flexible as possible we create a layout which is used repeatedly for each item in the timeline.

Making a new layout is simple.. we first create a ‘timeline item’ template in the Divi library (Divi Library > Add new > Layout (non global)). This will feature normally an image, title and content modules.. Once that is saved you can go ahead and set up your timeline module and select in the first option the layout you just made in the Divi library. It works best with 1 or 2 cols in the sub layout but by all means have a tinker and see what you can come up with! I have included three companion modules to aid the creation of new content.. these being title, content and featured image. To make a really cool timeline with loads of extra information try my Advanced Custom Fields module plugin also available in the store here.

For any support issues, please visit this link http://docs.tortoise-it.co.uk/

General Note: You MAY need to purchase the Divi Theme or the Elementor page builder to use this product. Please see the product description notes above for more information.

You may also like these items

No Downloads found

37 Comments

  1. Isabel Clever

    Hi there,

    Is this plugin GDPR compliant (in terms of collecting any personal data etc.)?

    Thank you!

  2. Jamain Freeman

    Are you able to use this within a tab module to show something like a schedule for each day of a conference?

  3. Kepa Atela

    Divi throws me an error where it tells me that it is not completely compatible with the latest version of divi. So the plugin is quite difficult not to say impossible to work with, I can not see what I’m changing in the timeline.

    • Sean Barton

      It’s not necessarily an error. The latest version of divi added third party modules to the visual builder. Plugins that don’t explicitly declare visual builder support will show a grey box and that message but it’s nothing to worry about. The norm in this case is to use the original Divi Builder as that’s what this plugin was designed for. In the coming months I shall be adding support for the visual builder but it’s extremely difficult to do so watch this space 🙂

  4. Lynn van der meer

    Can you use an own image instead of the icons. I would like years instead of hearts and arrows.

  5. gianfranco ruggeri

    hi there, i have one question and one problem with timeline.
    Why have different timeline? I don’t find documentation about the settings of the other timeline.

    The problem is if i’d like to add a gallery, it doesn’t work.
    If i use the gallery of wordpress, inside the text in every single label of the timeline, in front end the picture are visible but i cannot open and watch them in lightbox.
    If I use the divi gallery shortcode inside the text, the gallery is visible but the text is no more editable, so i have to restart everything from scratch.
    Can someone have my same problems?
    Thx
    gian

  6. PHILIPPE ALBRAND

    This plugin seems great but not compatible with “Divi – Filterable Blog Module”.

    When both are enable, media library don’t work (no media display, upload not possible) and it’s impossible to delete any plugin.

    When one is enable and other one disable there is no problem.

    How can i fix it ?

    • PHILIPPE ALBRAND

      i fix this problem by changing

      function sb_dtm_init()
      {
      add_action(‘init’, ‘sb_dtm_theme_setup’, 9999);
      add_action(‘admin_head’, ‘sb_dtm_admin_head’, 9999);
      add_action(‘wp_enqueue_scripts’, ‘sb_dtm_enqueue’, 9999);
      }

      to

      function sb_dtm_init()
      {
      add_action(‘init’, ‘sb_dtm_theme_setup’);
      add_action(‘admin_head’, ‘sb_dtm_admin_head’);
      add_action(‘wp_enqueue_scripts’, ‘sb_dtm_enqueue’);
      }

      in the main plugin file.

      It works now !

  7. soufyan amenzou

    Hi guys, !

    I’ve just purchase the plugin and it doesn’t work.

    I need, timeline – content.

    When I open it, then click “add new vertical timeline item” it only open the color picker on the same window.
    Then when I click on a color I got a big content with that color. (see => https://ibb.co/n7VDL6)

    I also notice a JS error (color-picker.min.js?ver=4.9:1 Uncaught TypeError: Cannot read property ‘removeClass’ of undefined), see => https://ibb.co/dEKUtR

    I’m using Chrome 62 on mac os. I also tried in private navigation.

    Any help please ?

    Thank you

  8. Heriberto Noguera

    Hi! Is there a way to reverse the order in the post-based timeline? I mean, to show older posts first.
    Thank you

  9. Stephen R. Smith

    I’ve just started trying to use this plugin, and a couple of things don’t make any sense.

    There’s a ‘Timeline – Post Title’ module that has all the configuration for font size etc., but nowhere to enter any text for the title. The ‘Timeline – Content’ module is the same. I can pick a background image, choose ‘Excerpt only’ and enable ‘Read more’, but there’s nowhere to enter any actual content.

    Is this a bug with the current Divi theme? Or with the current version of WordPress (the site is at WordPress 4.8.3)

    I purchased this for a project I need to get done this weekend based on the Elegant Themes review of the plugin, and it doesn’t appear to work.

    • Stephen R Smith

      For anyone else that stumbles over this in the future having the same problem:

      From William Hale on the support forum: “The modules you mentioned above are for use with the loop archive module for showing posts from a post type. You need to create a layout containing the loop item modules which will be used in each post of the timeline. Then add the timeline loop archive module wherever you wish on your site, selecting the loop item layout you have previously created and select the post type you’d like to be included in your loop archive. ”

      This makes sense, but I didn’t find this clearly explained in the documentation – I’ve been able to get a basic timeline working now

  10. Vale

    Hello! If I purchase this plugin, will I receive lifetime updates? (I understand that support is limited after 6 months, but not sure about updates.

    • Andrew Palmer

      Yes, support is limited to 6 months and all updates on this product are for lifetime.

  11. Esteban

    I’d like to know if you can add videos to the the Timeline?

    Thanks

    • Sean

      Yes you should be able to add them easily enough

  12. K C Nelson

    I’ve been playing with the Divi Timeline all morning, so far it meets my needs. The Timeline Vertical is self adjusting on iPhone, iPad and my Laptop. I have no regrets.

  13. Katie

    Is it possible to adjust the module so it displays as it does on a mobile or tablet on desktop as well. Meaning all the items in the timeline are stacked as opposed to some on the right and some on the left?

  14. Andrew Hochheimer

    Is there a demo page for the Timeline Module? I wanted to see how it looks as I could use a timeline module..

  15. Broadway

    Is there a way to create a timeline in which the events all appear on the same side of the timeline, rather than alternating left and right?

  16. Belen

    Hello, are updates for life or do I have to renew license each 6 months to get them? Thank you.

  17. Roba Morena

    Thanks Andy. I’m new at this, where do the Taxonomy’s appear?

    Please & thanks 🙂

  18. Josh

    The timeline ID and class tags do nothing. Would be nice if they worked because I would like to anchor link to different boxes on the timeline.

  19. Roba Morena

    Hi 🙂
    How can I only post a Timeline of a certain category?

    Please & Thanks 🙂

  20. Roba Morena

    Hi. PayPal is very limited in my country (Panama). Is there a way to buy it via credit card?
    Please & thanks 🙂

    • Andrew Palmer

      We are sorry but not currently. You may pay by credit card through paypal though.

      • Roba Morena

        Thanks a lot, got it 🙂

  21. Zoltán

    Hello, could you tell me how can i use Timeline (Posts) – Vertical, if i only want to show one post category? What I need to write into the “Include Taxonomy Only:” part? The category ID not work, the category name same not, what I have to write into this part to the timeline plugin Only show me my “news” category post elements? Thank you.

  22. Zoltán

    Hello,

    We found a bug, if I choose in “Timeline (Posts) – Vertical” to show pagination, then in builder my sidebar module go below the timeline, but if I turn off “show pagination”, than it’s ok, and stay each other “timeline (in left) | sidebar (in right)”. Please see, what you can do with it, thank you.

    And another thing, is there any way to add meta fields to my blog time line (date, author, categories, comments)?

    Thank you for your help.

  23. YesPapa

    Hi,

    Sweet module! Perhaps you could add some features like :
    – Possibility to align the Timeline Title (left, center, right) ;
    – Possibility to aligne the Item Text too (left, center, right) ;
    – Possibility to change the size of the central line and the size of the circle.

    I have an issue when I put the same color to the central line and the icon background. I have a little circle between us.

    Thank you.

    • Lisa

      Is it possible to have an image on the opposite site of the timeline center line that goes with the text of a specific item?

      • Suzanne S.

        I figured out a way to “cheat” the system:

        I created a background image where the left is transparent and the right side is the picture. Then I uploaded this as the background image. (for the second timeline item I put the transparent on the right and picture on the left).
        Add this css to the main element:
        background: no-repeat;

        For tablets and iphone, I copied the timeline to a new row and removed the background images, and put the images with the text using the MEDIA button

        EXAMPLE HERE:

        http://dfwmedicalspas.com/welcome/services/lets-talk-faces/

        I also figured out how to add text over the image. Add this css to your child theme or globally in Divi
        It will make the label text larger and add a semi-transparent white background

        /*————————————————*/
        /*—[Divi TImeline Module – LABEL]—*/
        /*————————————————*/

        .cd-date {
        font-size: 40px;
        text-align: left;
        background-color: rgba(255, 255, 255, 0.84)
        }

        • Stephen R. Smith

          Your site looks great! How did you get the timeline posts to span the whole width? I can only get them to alternate on the left and right side of the center line.

Submit a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Divi is a registered trademark of Elegant Themes, Inc. This website is not affiliated with nor endorsed by Elegant Themes.

External links on this website may be affiliate links that could result in us receiving compensation (payment) when you purchase a product or service from that link. For example, we may receive pay per click revenue or commission on sales of products. This helps us to pay the bills and deliver great content for you to enjoy when you are browsing these web pages. You do not pay any extra fees for these items.

By purchasing a product from The Elegant Marketplace you are agreeing to these terms. We do not offer custom support queries, although suggestions will be accepted and acted upon if possible. We do hold data that allows us to connect with you for product updates when you purchase a product. This is not an email marketing list. Should you wish to sign up to our marketing list, please visit our homepage where you will see an optin - We send out around two emails a week to keep you informed of product updates, You may opt out of our marketing communications at anytime by using the unsubscribe facility found at the bottom of each email.

Get the latest news!

Join our mailing list to receive the latest news and updates from our team.

Thanks, we appreciate your support

Pin It on Pinterest

Share This

    Support Form


    The author will normally get back to you within the next 48 hours. All requests are processed one after the other. If you do not receive an answer within this time, please check your spam folder and make sure that you have entered the correct email address.

    You can help us to help you faster. If errors occur, first deactivate all plugins and go back to the parent theme if you are using a child theme (which you should). Check again. Then first turn on your child theme again and then step by step your plugins. Check again every time. Where does the error occur? You can also enable debug.log to get more information to share with us. Use the following snippet to write the debug.log to your "wp-content" folder: Enable debug.log

    Please submit some screenshots showing the problem. The JPG and PNG format and several files are allowed (optional).

    7 + 6 =