Cool Timeline (Horizontal & Vertical Timeline)


Horizontal & Vertical Timeline, History Timeline

Showcase your story or company history in a precise and elegant way using a powerful and advanced Cool Timeline

It is really important to let your audience know about the history of your brand especially when you are promoting it through a website. Our plugin will help you to highlight events and stories precise way.

Check our Timeline plugins demos

  • Cool Timeline [Free]View Demo
  • Cool Timeline PRO [PRO]View Demo
  • Timeline Widget For Elementor [Free]View Demo
  • Timeline Widget For Elementor PRO [PRO]View Demo
  • Timeline Builder PRO [PRO]View Demo
  • Timeline Block For Gutenberg [Free]View Demo
  • Timeline Block For Gutenberg PRO [PRO]View Demo

Features Of Cool Timeline

Cool Timeline is a powerful WordPress plugin that enables you to create visually striking and informative timelines. It is built with pure HTML and CSS for maximum compatibility and offers both horizontal and vertical layout options.
Creating a timeline is straightforward and intuitive: simply create posts, set images, and assign dates. The plugin will automatically organize your posts in chronological order, whether you prefer ascending or descending.
With the simple shortcode [cool-timeline], you can easily display a timeline on any page of your website. The plugin is also fully responsive, ensuring that your timelines look great on any device.”

Cool Timeline Shortcode

[cool-timeline layout=”default” skin=”default” date-format=”F j” icons=”YES” show-posts=”20″ order=”DESC” story-content=”full”]

  • Gutenberg Timeline Block:- An advanced Timeline Block for Gutenberg, which allows you to easily create elegant timelines using pre-made presets. With this block, you can create any type of timeline, from roadmaps to process steps and events, opening up endless possibilities for showcasing your content in a visually compelling way.

  • Compact Timeline:-Our free users can also create a compact timeline, which means a timeline without a lot of space between stories.

  • Clean Layout:- If you love a clean and clear look without a lot of colors then you can showcase your story via our clean layout.
  • Horizontal Roadmap Timeline:- With the help of the Roadmap design, you can represent your Project/Company Plans and Phases.
  • Advanced Design & Optimized Code:- We have also made it developer-friendly, you can easily customize the timeline story default query.
  • The ability to create both one-sided and two-sided vertical timelines.
  • The option to display timeline images in a pop-up or link to the full story.
  • The ability to include cool icons alongside stories.
  • Customizable background colors for stories and year circles.
  • The option to specify different title colors for stories.
  • You can specify different colors for the story post’s title.
  • A read more button for linking to the full story page.
  • The ability to sort stories in either ascending or descending order.
  • Easy to use shortcode to place the cool timeline wherever your heart desires – [cool-timeline].
  • The plugin is Translation ready and has already been translated into 4 languages – German, French, Indonesian, and Italian.
  • TinyMCE button to generate the timeline shortcode or easily add the shortcode on any page using Gutenberg ready blocks.
  • Responsive and mobile-ready timeline.

Where can you use the Cool Timeline plugin?

You can show history/future stories, events, appointments, and many other cool things using our Cool Timeline plugin. Here are all areas where you can use this plugin:-

  • Highlight your company’s achievements and significant milestones.
  • Creating a historical timeline to showcase a company’s history.
  • Presenting tutorial or process steps in a timeline format.
  • Illustrating a program’s timeline.
  • Using a timeline as a visually effective way to depict historical events.
  • Building a timeline to highlight job stories or accomplishments.
  • Representing a personal story through a timeline.
  • Detailing work experience through a timeline format.
  • Providing a step-by-step guide using a timeline.
  • Creating an events timeline.
  • Developing a product roadmap.
  • Telling a brand’s story through a timeline format.
  • Showcasing a project or company’s roadmap.”

We have tried our best to create an awesome timeline plugin but still, if you face any installation, coding, or design error, you can contact us anytime. Also, remember to try our Cool Timeline Pro version for extra cool features and design options.

Buy Cool Timeline Pro | Check Timeline Pro Documentation

Cool Timeline Pro Features

“Cool Timeline Pro is an advanced version of our popular timeline plugin that offers even more design options and functionalities to help you create stunning timelines. Whether you’re looking to create a historical timeline for your company, showcase your personal story, or plan a product roadmap, the pro version gives you more flexibility and control to make your timelines truly unique.
With the pro version, you’ll have access to a range of advanced features such as:

  • 40+ Timeline Designs
    Cool Timeline Pro Provides 4 Timeline Layouts:-

    • Vertical Timeline
    • Vertical Compact Timeline
    • Vertical One-Side Timeline
    • Horizontal Timeline

    Every Timeline Layout Supports 6+ Design Options & 3 Skins(light, dark):-

    • Default Design
    • Flat Design
    • Elegant Design
    • Clean Design
    • Classic Design
    • Modern Design

    Check All Demos…

  • Timeline Settings, Colors & Typography:-
    Cool Timeline Pro provides an advanced setting panel to easily manage timeline visibility settings, background/timeline elements colors and fonts/typography styles, and color options.
  • Video, Images & Slider:-
    You can easily display small and big images, YouTube / Vimeo videos, and images slide-show inside Cool Timeline Pro. You can add them easily while adding a timeline story.
  • Custom Color Option For Every Story:-
    While adding stories in Cool Timeline Pro, you can provide different colors for different stories, which means you can easily create a multi-color timeline by using this advanced custom color feature provided by Cool Timeline Pro.
  • Multiple Timelines:-
    You can create multiple timelines in one website based on different categories by using the Cool Timeline Pro WordPress plugin. You can display these timelines in any layout(vertical/horizontal) or design.
  • Easily Add Shortcode Using Smart Generator:-
    If you are using a classic code editor inside WordPress while adding a new page or post then you can easily add a shortcode inside any page by using the smart shortcode generator tool inside your code editor.
  • Gutenberg / Elementor / WPBakery:-
    First, publish stories one by one then you can show these stories in a timeline layout easily inside any page builder:- Gutenberg blocks, Elementor, or WPBakery.
  • Show Custom Label Instead Of Date:-
    Cool Timeline Pro provides features to show custom text in place of date/time in the timeline. You can add custom text and custom story order easily via simple settings while adding a timeline story.
  • Timeline In Any Order ASC / DESC:-
    Timeline shortcode provides an option to show timelines in any order, you can show either ascending or descending order according to your needs.
  • Show Filters In Timeline:-
    You can show category-based filters above a timeline and users can see different category-based timelines on one page by selecting a filter/category.
  • Blog Posts Timeline:-
    You can show your website blog posts on any page in a timeline layout using Cool Timeline Pro. Also, you can represent any post type in the timeline layout by simply adding a post-type slug in the timeline shortcode.
  • Ajax Load More And Pagination Support:-
    Cool Timeline Pro provides both features – pagination and loads more. If you have a lot of stories inside your timeline then you can add pagination or load more buttons after a particular number of stories in your timeline.
  • Scrolling Navigation:-
    You can show small scrolling navigation on your timeline page for quick timeline navigation. A user can quickly and easily reach a particular year story through this small timeline navigation.
  • FontAwesome or Custom Image Icons:-
    You can show font awesome or custom image icons along with every story inside your timeline.
  • Show HTML or Read More Inside Timeline:-
    You can show links, bold text, or any custom HTML tag inside timeline stories or you can also show a read-more link to the full story page or any custom URL.
  • Add Any Date Format Inside Timeline:-
    You can represent timeline dates inside any date format, just add a date format inside your shortcode and it will show the date/year in your desired format. Check this URL:-
  • 15+ Animation Effects:-
    Cool Timeline Pro provides 15+ cool animation effects for a premium timeline design experience.
  • Premium Support For Pro Users:-
    We provide premium support services to our Pro users. If you face any issue while creating your dream timeline inside your website, just reach out to us here – Get Support and we will provide a solution in 24 hours.

Get the most out of your timelines with Cool Timeline Pro and elevate your website’s visual storytelling to the next level.”


  • WordPress Timeline plugin frontend view.
  • Cool Timeline story creation screen with instructions.
  • Timeline Block for Gutenberg preview.
  • Timeline Block for Gutenberg story preview.
  • Cool Timeline PRO Vertical Layout.
  • Cool Timeline PRO Single-Sided.
  • Cool Timeline PRO Horizontal view.


This plugin provides 3 blocks.

  • Cp Timeline Content Timeline
  • Cp Timeline Content Timeline Child
  • Cool Timeline Shortcode


Certainly! Here are the improved installation steps and guidelines for the Cool Timeline plugin:

3 Ways To Install Cool Timeline

1. Automatically Install via WordPress Admin Panel

  1. Open your WordPress admin panel.
  2. Navigate to Plugins > Add New.
  3. In the search bar, type ‘Cool Timeline‘.
  4. Locate the Cool Timeline plugin from the search results.
  5. Click the Install Now button.
  6. Once the installation is complete, click the Activate button to enable the plugin on your website.

2. Install via Zip File

  1. Download the Cool Timeline plugin from the WordPress plugin directory.
  2. Save the downloaded zip file to your computer.
  3. Open your WordPress admin panel.
  4. Navigate to Plugins > Add New.
  5. Click the Upload Plugin button.
  6. Select the downloaded zip file and click Install Now.
  7. Once the installation is complete, click the Activate Plugin button to enable Cool Timeline.

3. Install the Plugin via FTP

  1. Download the Cool Timeline plugin zip file from the WordPress plugin directory.
  2. Extract the zip file on your computer.
  3. Open your FTP manager (e.g., FileZilla).
  4. Connect to your website’s server.
  5. Navigate to the wp-content/plugins directory.
  6. Upload the extracted Cool Timeline folder (not the zip file) to this directory.
  7. After the upload is complete, go to your WordPress admin panel.
  8. Navigate to Plugins and find Cool Timeline in the list.
  9. Click the Activate button to enable the plugin.

Create Timeline

  1. Access Plugin Options:

    • After activating the plugin, you will see two new tabs in your WordPress admin sidebar: Timeline Stories and Cool Timeline.
  2. Customize Your Timeline:

    • Under the Cool Timeline tab, you can customize your timeline’s appearance by selecting different colors, fonts, and design options to match your website’s style.
  3. Add Timeline Stories:

    • Go to the Timeline Stories tab.
    • Click Add New to create a new story.
    • Enter the title, content, and select the appropriate date and year for each story.
    • Add images, icons, or other media as needed.
  4. Display Your Timeline:

    • Navigate to Pages > Add New to create a new page.
    • Use the built-in shortcode generator to insert the timeline shortcode, or simply add the following shortcode to the page content:
    • Publish the page to display your timeline on your website.

Additional Tips

  • Use Gutenberg Block: If you are using the Gutenberg editor, you can also add the Cool Timeline block to your page for a more intuitive experience.
  • Regular Updates: Keep the plugin updated to enjoy new features and improvements. Check for updates regularly in the WordPress admin panel under Plugins.

Final Words!

If you are facing any difficulty in Cool Timeline plugin installation then you can contact our support at here – contact us


How do I create a timeline using Cool Timeline?

Creating a timeline is easy. Simply create posts, set images, and assign dates to them. The plugin will automatically organize your posts in chronological order, either ascending or descending, based on your preference.

Can I choose any historical date/year?

The year starts from 1970 in the free version but in pro version you can choose any historical year from 1000 to 2050 to create a story inside Cool Timeline or you can also add custom text instead of date/year.

What is plugin shortcode & how can we use it?

Here is the full shortcode of the Cool Timeline plugin:-

[cool-timeline layout=”default” skin=”default” date-format=”F j” icons=”YES” show-posts=”20″ animation=”FadeInOut” order=”DESC” story-content=”full”]

  • [cool-timeline] = It is our default short-code syntax.
  • layout = We have five layout options (default, horizontal, one-side, simple, compact). In a simple timeline, you can create a timeline without a bigger year circle in between the stories.
  • skin = 2 skins available (default, clean)
  • date-format = You can choose any date-format to show with the stories according to your language and requirements.
  • icons = You can show(YES/NO) cool icons along with timeline stories.
  • show-posts = If you have a large timeline with a lot of stories then you can use this option to show the pagination option after a number of stories.
  • animation = We have only 1 animation effect (FadeInOut) in Cool Timeline free version. You can purchase Pro for more effects.
  • order = Now easily manage timeline stories order(ASC/DESC) from shortcode.
  • story-content = (short/full) Now show full HTML content or short description with read-more inside timeline stories.

Is the plugin responsive and mobile-friendly?

Yes, the Cool Timeline plugin is fully responsive and ensures that your timelines look great on any device.

Can I use Cool Timeline with the Gutenberg editor?

Yes, Cool Timeline includes an advanced Timeline Block for Gutenberg, allowing you to easily create elegant timelines using pre-made presets.

Can I create multiple timelines based on different categories?

The timeline category option is only available in our Pro version so you need to purchase Pro if you want to create category-specific multiple timelines.

What is the Horizontal Roadmap Timeline?

The Horizontal Roadmap Timeline design allows you to represent your project or company plans and phases in a visually compelling horizontal format..

Can I hide a bigger circular year circle?

Yes, You need to select “simple” layout while adding the shortcode. In this shortcode, you can create a timeline by hiding a bigger year circle.

Is it possible to create both horizontal & vertical timelines?

You can only create vertical timeline in our free version. But We have cool design options to create both vertical and horizontal timelines in our Pro version.

Is the plugin translation-ready?

Yes, the Cool Timeline plugin is translation-ready and has already been translated into four languages: German, French, Indonesian, and Italian.

What types of content can I showcase with Cool Timeline?

Cool Timeline is versatile and allows you to showcase various types of content such as company history, project milestones, personal achievements, event timelines, and product roadmaps.

Does Cool Timeline support RTL (Right-to-Left) languages?

Yes, Cool Timeline supports RTL languages, making it suitable for websites with languages such as Arabic, Hebrew, and Persian.

How does Cool Timeline help improve user engagement on my website?

By presenting your content in a visually appealing timeline, Cool Timeline can make your website more engaging and interactive, keeping visitors on your site longer and encouraging them to explore more of your content.

How often is Cool Timeline updated?

The developers regularly update Cool Timeline to add new features, improve performance, and ensure compatibility with the latest versions of WordPress.

Where can I find the Cool Timeline plugin on GitHub?

You can find the Cool Timeline plugin on its official GitHub repository at Github


June 7, 2024
This timeline is a great tool. You get nice features, even with the free version. Thank you for the plugin!
May 19, 2024 1 reply
After 3 hours of searching around, I realized that it was all just an advertisement for PRO.Finally, I had to delete the remnants from /plugins via FTP.
April 17, 2024 2 replies
This plugin produces timelines that do not conform with web accessibility standards, nor does it produce valid HTML markup – it won’t pass the W3’s automated validation tool’s inspection. Use at your own risk. Update: 4/14/2024. The developers have made noticeable accessibility improvements to this plugin. Keyboard navigation is much improved, being more consistent and intuitive. The markup it generates still doesn’t pass inspection by W3C’s Nu Html Checker which is not great, but the errors don’t trigger a browser’s quirks mode, which would be much worse for accessibility. Kudos for the improvements, please keep them coming!
March 22, 2024
There are a few tricks to using the plugin, but overall it works great!
March 14, 2024
I had a problem with the story formatting on mobile phones. The response to my support request was very quick with a suggestion to add some CSS coding. I did it and the problem was solved.
Read all 306 reviews

Contributors & Developers

“Cool Timeline (Horizontal & Vertical Timeline)” is open source software. The following people have contributed to this plugin.


“Cool Timeline (Horizontal & Vertical Timeline)” has been translated into 2 locales. Thank you to the translators for their contributions.

Translate “Cool Timeline (Horizontal & Vertical Timeline)” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.


Version 2.9.3 | 11 June 2024

-Added popup open link on date label in horizontal layout

-Fixed php fatal error issue with empty shortcode.
-Fixed pagination arrow styling issue.

-Improved Horizontal timeline next/previous buttons.

Version 2.9.2 | 04 April 2024

-Fixed RTL css issue.

Version 2.9.1 | 08 March 2024

-Video content updated on the get started page for better documentation
-Added HTML accessibility attributes

Version 2.9.0 | 05 March 2024

-Added Shortcode Live Preview button in Classic Editor
-Added Get Started page in timeline admin setting for plugin information

-Fixed Image Position issue.
-Fixed Setting translation issue.
-Fixed Horizontal Read More Display issue.
-Fixed Year lable font family issue.
-Fixed Vertical Icon, Icondot and Arrow styling issue in responsive device.
-Fixed Year label styling issue in responsive device.

Version 2.8.3 | 19 December 2023

-Fixed Animation issue.
-Fixed Compact CSS issue.
-Fixed Wrong Comment CSS issue.
-Added Post Per Page Option in Horizontal Layout.

Version 2.8.2 | 11 December 2023

-Fixed PHP fatal error issue with 7.0 PHP version.

Version 2.8.1 | 08 December 2023

– Remove unused files.

Version 2.8 | 08 December 2023

Added WordPress default Image, Heading and Paragraph core blocks for more features.
Added migration option in instant timeline builder to migrate into Cool Timeline Block.
Editor side PHP errors.

Cool Timeline Block static CSS replaced with variable based CSS.
Shortcode Block Design Improvement and Removed Extra code.

Remove Heading, Image and Paragraph setttings from Cool Timeline Block.

Version 2.7.1 | 17/10/2023

– Minor Security fix

Version 2.7 | 07/09/2023

– Fixed an issue with the conditional loading of styles and assets.

New Features:
– Added an “Add New Story” button to the story toolbar.
– Introduced a “Go To Settings” button in the story settings panel.
– Included new settings for Heading Tags.
– Integrated a new Font Icon library.

– Fixed an issue with icons and center line positioning.
– Removed the old Font Icon library for better performance.
– Addressed the ALT Tag issue in images.

– Tested and verified compatibility with WordPress 6.3.

Version 2.6.1 | 20/03/2023

  • Fixed:-Minor design issues with compact layout
  • Fixed:-Minor textual changes
  • Updated:- changed constants
  • Tested up to:- Tested upto WordPress 6.2
  • Updated:- updated links and assets

Version 2.6 | 15/03/2023

  • Added:- Integrated New Cool Timeline Shortcode Block
  • Added:- Integrated New Glightbox
  • Improved:- Updated Year section position in one-sided layout.
  • Improved:- Horizontal layout settings and design.
  • Removed:- PrettyPhoto Popup.
  • Improved: Responsive design and timeline elements.
  • Improved:- Improved settings Tabs
  • Remove:- Cool Timeline Shortcode Generator removed from Gutenberg
  • Fixed:- Fixed styling issue

Version 2.5 | 11/01/2023

  • Integration:- Alternating setting option
  • Integration:- Content alignment Setting
  • Integration:- Title bottom spacing setting
  • Integration:- Description Bottom spacing setting
  • Integration:- Item spacing setting
  • Integration:- Icon box size setting
  • Integration:- Icon size setting
  • Integration:- Line size setting
  • Integration:- Container padding setting
  • Improved:- Content update / CoolTimeline Timeline Builder Block
  • Updated:- Dashboard API.

Version 2.4.5 | 28/09/2022

  • Improved:-Minor textual changes

Version 2.4.4 | 15/04/2022

  • Improved:-Used sanitize_text_field and removed PHP filter vars

Version 2.4.3 | 14/04/2022

  • Improved:-Updated settings framework latest version

Version 2.4.2 | 08/04/2022

  • Improved:- Updated settings framework latest version
  • Improved:- replace date function with gmdate() for better date function support.
  • Improved: escaped attribute and HTML output in overall code.

Version 2.4.1 | 06/04/2022

  • Improvements:- Removed all CDN and external images and JS file links.
  • Improvements:- loaded all images from the plugin folder.

Version 2.4 | 05/04/2022

  • Fixed: Major security issue.
  • Improved: overall code improvements.

Version 2.3.3 | 02/02/2022

  • New: Quick Date Select Button in Timeline Story Setting meta box
  • Fixed: Pagination issue on the home page.
  • Fixed: Minor CSS issue in horizontal Layouts.

Version 2.3.2 | 17 Nov 2021

  • Improved: Added check for WordPress 4.9 versions.

Version 2.3 | 09 Nov 2021

  • New: Added image size option, Font Awesome icons, color and typography settings for each element of Cool Timeline Gutenberg Timeline Block
  • New: Added right-aligned one-sided timeline layout in Cool Timeline Gutenberg Timeline Block
  • New: Story position(left/right) option or both-sided layout of Cool Timeline Gutenberg Timeline Block

Version 2.2.3 | 22 Oct 2021

  • Fixed: Fixed missing icon issue
  • Fixed: Loaded settings framework only on cool_timeline post type and settings panel
  • Fixed: Conflict with WP Quiz PRO and CMB2
  • Improved: Minor code improvements

Version 2.2.2 | 07 Oct 2021

  • Fixed: Shortcode generator generating the wrong shortcode
  • Fixed: review notice bug

Version 2.2 | 05 Oct 2021

  • Added: integrated New settings panel
  • Added: integrated New meta boxes and shortcode generator
  • Added: Vertical story position settings
  • Improved: improved overall code managed codes in functionality base class
  • Improved: managed assets management in a standalone class
  • Improved: folder structure

Version 2.1 | 13 July 2021

  • Added: Story Ordering/sorting feature in Instant timeline builder block
  • Added: Extended support for older Years from 1800 to 1970 years and dates
  • Added:- Alt tag in Instant Timeline Builder images
  • Fixed: VC addon integration not working
  • Fixed: story wrong order bug
  • Fixed:- Timeline Year issue in the Spanish language
  • Updated: Gutenberg Timeline block code and libraries
  • Updated: Deprecated libraries from the timeline block
  • Updated: tested up to 5.8
    More:- check changelog.txt file here.