How To Embed a Timeline on Your Website
Embedding a timeline on your website is a great way to increase engagement with your readers. You can tell your readers chronologically and visually what happened over time. Our data shows that the time spent on site increases when a timeline has been added to your article. In this blog post, we will explain how to embed a timeline in your website, blog post, or news article in 4 simple steps.
Native Embedding Support on most Content Management Systems (CMS)
Adding a Timepath timeline to your website is easy and flexible because it works seamlessly with different content management systems (CMS). To embed the timeline widget, you need custom code. Most content management systems have native embedding support. For example:
Webflow: provides several different ways to add custom code
WordPress: many different page builders and plugins allow you to add custom code
Wix: native embedding support
With Timepath, you don’t have to worry about coding. Just copy and paste a link into your website editor, and voila! Your timeline is embedded and ready to go, showing your events or stories beautifully and interactively. Below are the 4 simple steps to embed a timeline.
The best part? Any changes you make show up instantly (after 5 minutes) on your timeline without you needing to do anything else.
How to Embed a Timeline on Your Website in 4 Steps
It all starts with creating a timeline. Before you know it, you're ready to share it with the world. Now it's time to embed it on your website! You do this by following 4 simple steps:
Step 1: Preview Your Timeline
View your timeline in preview mode. This will give you an idea of what your final timeline widget will look like. If all is good, you can publish your timeline. You can do this by clicking on the 'share button' in the top right corner.
Step 2: From Private to Public
By default your timeline is in private mode. If you want to embed your timeline in your website, blog post, or news article you need to make your timeline public. You can do this by clicking on the 'public' mode and hit the save button.
Step 3: Copy Paste the Embed Code
After you have set your timeline to the public, you can see the embed code. This is displayed in a textblock which you can easily copy to your clipboard. Paste your iframe code into your website, blog post, or news article. Depending on what CMS you use in the editor mode there is a 'custom code' mode. Click on add custom code, copy and paste the embed code into the code block, and press save.
Step 4: Place Embed Code on Your Page and Publish
After copying and pasting your embed code into your CMS you can publish your page. All the changes you make in your timeline editor on Timepath are automatically updated to your timeline after 5 minutes. This means that you do not need to embed your timeline again after you made some changes. That is the power of Timepath!
