✅ Link to plugin page: https://zeroqode.com/plugin/roadmap--timeline-plugin-for-bubble-1695230006872x177945643031512960
Demo to preview the settings
Live Demo: https://nftmkt.bubbleapps.io/roadmap_new
Introduction
Easily integrate the Roadmap/Timeline Plugin into your Bubble app to create visually stunning, interactive, and customizable timelines or roadmaps. This plugin offers a seamless solution for presenting project milestones, product roadmaps, or chronological events, enhancing clarity and engagement for your users.
With the Roadmap/Timeline Plugin, you can configure timelines to reflect your app’s unique style, including customizable colors, layouts, and content. Ideal for project management tools, educational platforms, or storytelling apps, this plugin makes it easy to display information in a structured, professional format. Simplify complex narratives and add a polished visual element to your app with this versatile timeline solution.
How to setup
- Install Roadmap / Timeline plugin
- Place the Roadmap element on the page
Plugin Element Properties
Title | Description | Type |
Data type | Data type | App Type, Optional |
Data source | Data source | Dynamic value, any thing |
Title | Title of data | Fields of data, text, image, file |
Description | Description of data | Fields of data, text, image, file |
Extra Text | Extra text field | Fields of data, text, image, file |
Roadmap type | Roadmap display type (Vertical or Horizontal) | Dropdown, Vertical/Horizontal |
Visible items number | Number of visible items | Dynamic value, number, Default: 4 |
Event can be clicked? | Event can trigger a workflow when clicked | Dynamic value, yes/no, Default: false |
Breakpoint (px) | Minimum width for layout adjustment | Dynamic value, number, Default: 800 |
Styling colors | ||
Bullet point | Bullet point styling color | Color |
Bullet point border | Border color for bullet points | Color |
Container | Background color of container | Color |
Container border | Border color of container | Color |
Nav button | Color of navigation button | Color |
Line | Color of the line | Color |
Font Styling | ||
Font Color | Color for main text | Color |
Date Font Color | Color for date text | Color |
More Text Font Color | Font color for extra text | Color |
Title Font | Font for title Arial, Helvetica, Verdana | Dropdown |
Title Font Size | Font size for title | Dropdown |
Title Font Weight | Font weight for title | Dropdown |
Font | A font from Arial, Helvetica, Verdana | Dropdown |
Font Size | Font size can be small, medium, large | Dropdown |
Font Weight | Font weight between 100-600 | Dropdown |
Exposed states
Title | Description | Type |
Event description | Indicates the description of the event | Text |
Element Events
Title | Description |
Event clicked | Triggered when an event is clicked |
Changelogs
Update 20.11.24 Version 1.13.0
- New fields added
Update 24.07.24 Version 1.12.0
- Minor update
Update 19.06.24 Version 1.11.0
- Updated demo/service links
Update 01.11.23 Version 1.10.0
- Updated description
Update 01.11.23 Version 1.9.0
- Updated description
Update 18.10.23 Version 1.8.0
- Updated description
Update 15.09.23 Version 1.7.0
- Updated description
Update 12.09.23 Version 1.6.0
- Minor updates
Update 07.09.23 Version 1.5.0
- Updated action: "Fixed text display when overflowing"
Update 04.09.23 Version 1.4.0
- Updated description
Update 26.06.22 Version 1.3.0
- ✅ Officially working on Bubble's new responsive engine
Update 19.06.22 Version 1.2.1
- ⚠️ Plugin currently not working on new responsive engine
Update 19.06.22 Version 1.2.0
- Plugin V3: New responsive engine
Update 19.06.22 Version 1.1.1
- Adapted to new responsive engine
Update 22.11.21 Version 1.1.0
- Now with customizable fonts
Update 12.11.21 Version 1.0.1
- Bug fix: "Other images don't disappear"
Update 05.11.21 Version 1.0.0
- First Release