WBD Timeline Builder

Description

WBD Timeline Builder is a lightweight, fully native Gutenberg block for creating animated timelines. It is built with the WordPress block editor’s own components — no page builders, no bloat.

Features

  • Three layouts: vertical alternating, vertical one-sided, and horizontal (scroll-snap).
  • Add, reorder, and remove timeline items directly in the editor.
  • Each item supports a title, date/label, description, icon (Dashicon), image, and link.
  • Scroll-triggered animations: fade up, fade in, slide in, zoom in — powered by IntersectionObserver.
  • Respects prefers-reduced-motion for accessibility.
  • Full color controls: accent/markers, line, card background, title, date, and text.
  • Marker styles: dot, ring, or icon.
  • Fully responsive — alternating layout collapses to a clean one-sided layout on mobile.
  • Server-side rendered for clean, secure, escaped output.
  • Supports wide and full alignment, spacing controls, and block anchors.

Development

Public source code repository:
https://github.com/wpbranddigital/timeline-builder-block

Build Instructions:

  1. npm install
  2. npm run build
  3. npm run start (development)
    WBD Timeline Builder is built using @wordpress/scripts.

Blocks

This plugin provides 1 block.

  • WBD Timeline Builder Build beautiful, responsive animated timelines with vertical, horizontal, or one-sided layouts.

Installation

  1. Upload the plugin files to the /wp-content/plugins/wbd-timeline-builder directory, or install through the WordPress plugins screen.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress.
  3. In the block editor, add the “WBD Timeline Builder” block and start adding items.

FAQ

Does this work with the Site Editor (FSE)?

Yes. It is a standard registered block and works anywhere blocks are supported.

Are animations accessible?

Yes. Animations are disabled automatically when the visitor has “reduce motion” enabled in their OS.

Does it require any external libraries?

No. It uses only native WordPress packages and vanilla JavaScript.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“WBD Timeline Builder” is open source software. The following people have contributed to this plugin.

Contributors

Translate “WBD Timeline Builder” into your language.

Interested in development?

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

Changelog

1.0.1

  • Updated plugin display name to WBD Timeline Builder and slug/textdomain to wbd-timeline-builder for WordPress.org compliance.

1.0.0

  • Initial release.