{"id":346416,"date":"2026-09-02T18:49:48","date_gmt":"2026-09-02T18:49:48","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/timeline-builder-block\/"},"modified":"2026-10-30T18:55:54","modified_gmt":"2026-10-30T18:55:54","slug":"wbd-timeline-builder","status":"publish","type":"plugin","link":"https:\/\/tir.wordpress.org\/plugins\/wbd-timeline-builder\/","author":23409020,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.0.2","stable_tag":"1.0.2","tested":"7.1.4","requires":"6.5","requires_php":"7.4","requires_plugins":null,"header_name":"Timeline Block","header_author":"WPBrand Digital","header_description":"A native Gutenberg block to build beautiful, responsive animated timelines.","assets_banners_color":"8f8ef7","last_updated":"2026-10-30 18:55:54","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"https:\/\/wordpress.org\/plugins\/wbd-timeline-builder\/","header_author_uri":"https:\/\/wpbranddigital.org","rating":5,"author_block_rating":5,"active_installs":30,"downloads":542,"num_ratings":1,"support_threads":0,"support_threads_resolved":0,"author_block_count":5,"sections":["description","installation","faq","changelog"],"tags":{"1.0.1":{"tag":"1.0.1","author":"wpbranddigital25","date":"2026-10-03 17:57:36","revision":3726588},"1.0.2":{"tag":"1.0.2","author":"wpbranddigital25","date":"2026-10-30 18:55:54","revision":3775915}},"upgrade_notice":{"1.0.1":"<p>Updated plugin display name and text domain for WordPress.org compliance.<\/p>","1.0.0":"<p>Initial release.<\/p>"},"ratings":{"1":0,"2":0,"3":0,"4":0,"5":1},"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3678579,"resolution":"128x128","location":"assets","locale":"","width":128,"height":128}},"assets_banners":{"banner-772x250.png":{"filename":"banner-772x250.png","revision":3678549,"resolution":"772x250","location":"assets","locale":"","width":2200,"height":715}},"assets_blueprints":{},"all_blocks":{"wbd-timeline-builder\/timeline":{"$schema":"https:\/\/schemas.wp.org\/trunk\/block.json","apiVersion":3,"name":"wbd-timeline-builder\/timeline","version":"1.0.2","title":"WBD Timeline Builder","category":"widgets","icon":"clock","description":"Build beautiful, responsive animated timelines with vertical, horizontal, or one-sided layouts.","keywords":["timeline","history","roadmap","steps","history-timeline","timeline-history","milestones","gutenberg","block","timeline-block","timeline-builder","timeline-block-gutenberg","wbd-timeline-block","wbd-timeline-builder-block","wbd-timeline-builder-block-gutenberg","event-timeline"],"supports":{"html":false,"align":["wide","full"],"anchor":true,"spacing":{"margin":true,"padding":true}},"attributes":{"items":{"type":"array","default":[]},"layout":{"type":"string","default":"vertical-alternate"},"lineColor":{"type":"string","default":"#e2e8f0"},"accentColor":{"type":"string","default":"#4f46e5"},"cardBackground":{"type":"string","default":"#ffffff"},"titleColor":{"type":"string","default":"#0f172a"},"dateColor":{"type":"string","default":"#64748b"},"textColor":{"type":"string","default":"#475569"},"animation":{"type":"string","default":"fade-up"},"animationDuration":{"type":"number","default":600},"markerStyle":{"type":"string","default":"dot"},"dateFontSize":{"type":"object","default":{"desktop":"","tablet":"","mobile":""}},"titleFontSize":{"type":"object","default":{"desktop":"","tablet":"","mobile":""}},"descFontSize":{"type":"object","default":{"desktop":"","tablet":"","mobile":""}},"imageWidth":{"type":"object","default":{"desktop":"","tablet":"","mobile":""}},"imageHeight":{"type":"object","default":{"desktop":"","tablet":"","mobile":""}},"imageObjectFit":{"type":"string","default":"cover"},"imagePosition":{"type":"string","default":"top"},"columns":{"type":"object","default":{"desktop":3,"tablet":2,"mobile":1}},"linkFontSize":{"type":"object","default":{"desktop":"","tablet":"","mobile":""}},"linkPadding":{"type":"object","default":{"desktop":"","tablet":"","mobile":""}},"linkColor":{"type":"string","default":""},"linkBgColor":{"type":"string","default":""},"linkBorderRadius":{"type":"string","default":""},"dateFontFamily":{"type":"string","default":""},"titleFontFamily":{"type":"string","default":""},"descFontFamily":{"type":"string","default":""},"linkFontFamily":{"type":"string","default":""}},"textdomain":"wbd-timeline-builder","editorScript":"file:.\/index.js","editorStyle":"file:.\/index.css","style":"file:.\/style-index.css","viewScript":"file:.\/view.js","render":"file:.\/render.php"}},"tagged_versions":["1.0.1","1.0.2"],"block_files":["\/tags\/1.0.2\/build\/index.js","\/tags\/1.0.2\/build\/index.css","\/tags\/1.0.2\/build\/style-index.css"],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3738464,"resolution":"1","location":"assets","locale":"","width":1234,"height":646},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3738464,"resolution":"2","location":"assets","locale":"","width":1269,"height":575},"screenshot-3.png":{"filename":"screenshot-3.png","revision":3738464,"resolution":"3","location":"assets","locale":"","width":1278,"height":466},"screenshot-4.png":{"filename":"screenshot-4.png","revision":3738464,"resolution":"4","location":"assets","locale":"","width":1179,"height":657}},"screenshots":{"1":"ThemeOne","2":"ThemeTwo","3":"ThemeThree","4":"Dashboard"}},"plugin_section":[172757],"plugin_tags":[148076,1433,14785,5575,205394],"plugin_category":[],"plugin_contributors":[252525],"plugin_business_model":[],"class_list":["post-346416","plugin","type-plugin","status-publish","hentry","plugin_section-block","plugin_tags-gutenberg","plugin_tags-history","plugin_tags-roadmap","plugin_tags-timeline","plugin_tags-timeline-block","plugin_contributors-wpbranddigital25","plugin_committers-rudrawp","plugin_committers-wpbranddigital25","plugin_support_reps-rudrawp"],"banners":{"banner":"https:\/\/ps.w.org\/wbd-timeline-builder\/assets\/banner-772x250.png?rev=3678549","banner_2x":false,"banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/wbd-timeline-builder\/assets\/icon-128x128.png?rev=3678579","icon_2x":false,"generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/wbd-timeline-builder\/assets\/screenshot-1.png?rev=3738464","caption":"ThemeOne"},{"src":"https:\/\/ps.w.org\/wbd-timeline-builder\/assets\/screenshot-2.png?rev=3738464","caption":"ThemeTwo"},{"src":"https:\/\/ps.w.org\/wbd-timeline-builder\/assets\/screenshot-3.png?rev=3738464","caption":"ThemeThree"},{"src":"https:\/\/ps.w.org\/wbd-timeline-builder\/assets\/screenshot-4.png?rev=3738464","caption":"Dashboard"}],"raw_content":"<!--section=description-->\n<p>WBD Timeline Block for Gutenberg is the most intuitive, lightweight, and customizable WordPress timeline plugin designed specifically for the modern block editor. Whether you need to showcase a company history, a project roadmap, event schedules, or personal milestones, this plugin allows you to build beautiful, responsive, and animated timelines without writing a single line of code or relying on heavy page builders.<\/p>\n\n<p>With the WBD Timeline Builder block, you can organize chronological content using different timeline layouts, customize each timeline item, and control how your timeline looks across desktop, tablet, and mobile devices.<\/p>\n\n<p>No coding or third-party page builder is required.<\/p>\n\n<p><strong>Key Features for a Perfect Timeline:<\/strong><\/p>\n\n<ul>\n<li><strong>3 Stunning Layouts:<\/strong> Choose from Vertical Alternating (zigzag), Vertical One-sided, and a touch-friendly Horizontal slider layout with left\/right navigation.<\/li>\n<li><strong>Responsive Control:<\/strong> Set custom columns for the horizontal slider (Desktop, Tablet, Mobile) and watch vertical timelines automatically adapt to smaller screens.<\/li>\n<li><strong>Highly Customizable Content:<\/strong> Each timeline card supports a Custom Date\/Label, Title, Description, Image (with position and object-fit control), Call-to-Action Link, and a custom Marker Icon.<\/li>\n<li><strong>Advanced Typography &amp; Design:<\/strong> Fully control font families, responsive font sizes, link padding, border radius, and accent colors for every single element.<\/li>\n<li><strong>Scroll-Triggered Animations:<\/strong> Bring your history or roadmap to life with smooth reveal animations (Fade Up, Fade In, Slide In, Zoom In) as users scroll down the page.<\/li>\n<li><strong>Accessible &amp; Performance-Optimized:<\/strong> Respects <code>prefers-reduced-motion<\/code> settings for accessibility. Powered by vanilla JS and IntersectionObserver\u2014no heavy jQuery libraries.<\/li>\n<li><strong>Server-Side Rendered:<\/strong> Ensures SEO-friendly HTML markup, dynamic CSS variable injection, and maximum security.<\/li>\n<\/ul>\n\n<h3>Where can you use WBD Timeline Block?<\/h3>\n\n<ul>\n<li>Showcase tutorial\/process steps in timeline format.<\/li>\n<li>Create a program timeline.<\/li>\n<li>Represent history.<\/li>\n<li>Create events\/appointments timeline.<\/li>\n<li>Job stories\/achievements timeline.<\/li>\n<li>Personal story timeline.<\/li>\n<li>Product roadmap.<\/li>\n<\/ul>\n\n<h3>Timeline Content<\/h3>\n\n<p>Each timeline item can include:<\/p>\n\n<ul>\n<li>Custom date or label<\/li>\n<li>Title<\/li>\n<li>Description<\/li>\n<li>Image<\/li>\n<li>Call-to-action link<\/li>\n<li>Custom marker<\/li>\n<li>Marker icon<\/li>\n<\/ul>\n\n<p>Image settings include position and object-fit controls to help maintain a consistent visual presentation.<\/p>\n\n<h3>Responsive Timeline Design<\/h3>\n\n<p>WBD Timeline Builder is designed for responsive WordPress websites.<\/p>\n\n<p>For the horizontal timeline layout, you can configure columns for:<\/p>\n\n<ul>\n<li>Desktop<\/li>\n<li>Tablet<\/li>\n<li>Mobile<\/li>\n<\/ul>\n\n<p>Vertical timeline layouts adapt to smaller screen sizes so your chronological content remains usable across different devices.<\/p>\n\n<h3>Timeline Animations<\/h3>\n\n<p>WBD Timeline Builder includes scroll-triggered reveal animations for timeline content.<\/p>\n\n<p>Available animation styles include:<\/p>\n\n<ul>\n<li>Fade Up<\/li>\n<li>Fade In<\/li>\n<li>Slide In<\/li>\n<li>Zoom In<\/li>\n<\/ul>\n\n<h3>Accessibility-Conscious Motion<\/h3>\n\n<p>Accessibility is considered in the timeline animation experience.<\/p>\n\n<p>WBD Timeline Builder respects the user's prefers-reduced-motion setting. When reduced motion is enabled at the operating-system or browser level, timeline animations are disabled. For best accessibility, use clear headings, readable text, descriptive links, and meaningful content when creating your timeline.<\/p>\n\n<h3>Performance-Conscious Implementation<\/h3>\n\n<p>WBD Timeline Builder uses vanilla JavaScript and the browser's IntersectionObserver API for timeline animations.<\/p>\n\n<p>The plugin does not require jQuery for its timeline functionality. Keeping the timeline functionality focused helps avoid adding unrelated page-building features to your WordPress website.<\/p>\n\n<p>Actual frontend performance can vary depending on your WordPress theme, hosting environment, other plugins, assets, and page content.<\/p>\n\n<h3>Server-Side Rendered Block<\/h3>\n\n<p>The timeline block uses server-side rendering to generate its frontend output.<\/p>\n\n<p>This allows timeline content to be generated as part of the WordPress page output while keeping the editing experience integrated with Gutenberg.<\/p>\n\n<h3>SEO-Friendly Timeline Content<\/h3>\n\n<p>WBD Timeline Builder helps you organize chronological information in a clear and structured timeline format using the WordPress Block Editor.<\/p>\n\n<p>Timeline content can be useful for:<\/p>\n\n<ul>\n<li>Company history pages<\/li>\n<li>Product development timelines<\/li>\n<li>Project roadmaps<\/li>\n<li>Event schedules<\/li>\n<li>Process steps<\/li>\n<li>Milestone pages<\/li>\n<li>Achievement timelines<\/li>\n<li>Personal stories<\/li>\n<li>Tutorials and sequential content<\/li>\n<\/ul>\n\n<h3>Development<\/h3>\n\n<p>Public source code repository:\nhttps:\/\/github.com\/wpbranddigital\/timeline-builder-block<\/p>\n\n<p>Build Instructions:<\/p>\n\n<ol>\n<li>npm install<\/li>\n<li>npm run build<\/li>\n<li>npm run start (development)\nWBD Timeline Builder is built using @wordpress\/scripts.<\/li>\n<\/ol>\n\n<!--section=installation-->\n<ol>\n<li>Log in to your WordPress admin dashboard.<\/li>\n<li>Go to Plugins \u2192 Add New.<\/li>\n<li>Search for WBD Timeline Builder.<\/li>\n<li>Click Install Now.<\/li>\n<li>Click Activate.<\/li>\n<li>Open a page or post in the WordPress Block Editor.<\/li>\n<li>Click the + Block Inserter.<\/li>\n<li>Search for Timeline or WBD Timeline Builder.<\/li>\n<li>Add the timeline block.<\/li>\n<li>Add and customize your timeline items using the block settings.<\/li>\n<\/ol>\n\n<p>You can also install the plugin manually:<\/p>\n\n<ol>\n<li>Download the plugin ZIP file.<\/li>\n<li>Go to Plugins \u2192 Add New \u2192 Upload Plugin.<\/li>\n<li>Upload the plugin ZIP file.<\/li>\n<li>Click Install Now.<\/li>\n<li>Click Activate Plugin.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"does%20this%20work%20with%20the%20site%20editor%20%28fse%29%3F\"><h3>Does this work with the Site Editor (FSE)?<\/h3><\/dt>\n<dd><p>Yes. It is a standard registered block and works anywhere blocks are supported.<\/p><\/dd>\n<dt id=\"are%20animations%20accessible%3F\"><h3>Are animations accessible?<\/h3><\/dt>\n<dd><p>Yes. Animations are disabled automatically when the visitor has \"reduce motion\" enabled in their OS.<\/p><\/dd>\n<dt id=\"does%20it%20require%20any%20external%20libraries%3F\"><h3>Does it require any external libraries?<\/h3><\/dt>\n<dd><p>No. It uses only native WordPress packages and vanilla JavaScript.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.2<\/h4>\n\n<ul>\n<li>Added responsive font sizes for typography.<\/li>\n<li>Added responsive spacing for links.<\/li>\n<li>Added responsive image sizing controls.<\/li>\n<li>Added 3rd marker type (icon).<\/li>\n<li>Updated plugin display name to WBD Timeline Builder and slug\/textdomain to wbd-timeline-builder for WordPress.org compliance.<\/li>\n<\/ul>\n\n<h4>1.0.1<\/h4>\n\n<ul>\n<li>Updated plugin display name to WBD Timeline Builder and slug\/textdomain to wbd-timeline-builder for WordPress.org compliance.<\/li>\n<\/ul>\n\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>Initial release.<\/li>\n<\/ul>","raw_excerpt":"Build beautiful, responsive animated timelines with a native Gutenberg block.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/346416","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=346416"}],"author":[{"embeddable":true,"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/wpbranddigital25"}],"wp:attachment":[{"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=346416"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=346416"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=346416"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=346416"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=346416"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/tir.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=346416"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}