WordPress.org
Get WordPress
WordPress.org

Plugin Directory

Scrollchart

Scrollchart

By scrollchart
Download

Description

Scrollchart adds a library of animated diagrams and charts to WordPress. Pick a diagram from scrollchart.com, paste its slug, and the diagram appears in your post with a clean, accessible layout that works on every device.

Features

  • Hundreds of ready-to-use diagrams spanning fitness, nutrition, health science, finance, marketing, statistics, computing and more
  • Responsive on mobile — diagrams scale to fit any column width
  • Light and dark themes with auto-detection of the visitor’s system preference
  • Accent colours to match your brand
  • Optional border, custom background, custom text colour
  • Fixed-size or fluid layout — your choice per embed
  • Fast page paint — diagrams below the fold defer loading by default to save bandwidth
  • Accessible by default — keyboard navigation, screen-reader friendly, no scroll-jacking
  • Works with the block editor, Classic Editor, WPBakery Page Builder, and Elementor — drag, drop, or type a shortcode

No account, no API key

Just install, activate, and start embedding. Browse the library at scrollchart.com and copy the slug of any diagram you want to use.

Screenshots

  • The built-in AI generator: describe what you want and a custom animated diagram is created and inserted into your post.
  • 3000+ diagrams available in 15 languages, with an animated carousel of recent additions.
  • Catalogue browser with category filter, language filter, and live-preview thumbnails. Diagrams marked with the globe icon are available in every supported language.
  • Per-embed configuration: theme, accent colour, frame, size, and language. Live preview updates as you tweak.

Blocks

This plugin provides 1 block.

  • Scrollchart Diagram Drop an animated, accessible diagram into your post. Responsive, themeable, mobile-friendly.

Installation

  1. Upload the plugin to your WordPress site (or install from the plugin directory).
  2. Activate it.
  3. Open a post in the block editor and add a Scrollchart Diagram block. Or in Classic Editor / page builder text blocks, type [scrollchart slug="bell-curve"].
  4. Browse scrollchart.com to find diagram slugs.

Optional: visit Settings -> Scrollchart to set defaults for theme, accent colour, and load behaviour.

FAQ

Do I need an account on scrollchart.com?

No. The plugin works out of the box. Scrollchart.com is a free public library.

Can I use this with my page builder?

Yes. The plugin registers native elements for WPBakery Page Builder and Elementor. Both work alongside the standard block editor and shortcode.

Will the diagrams slow my pages down?

No. Diagrams below the fold defer loading until they scroll into view, and the JavaScript runs only on pages that actually have a diagram. The plugin caches diagram metadata locally so repeat page-loads don’t hit the network.

Can I customize colours to match my brand?

Yes. The block, WPBakery element, and Elementor widget all expose theme, accent colour, custom hex colours, border, and background controls. Set defaults in Settings -> Scrollchart so every embed inherits them automatically.

Does it work in AMP / mobile / dark mode?

Yes. Diagrams are responsive (no horizontal scrolling on mobile), respond to system dark-mode preference when theme is set to Auto, and don’t rely on any AMP-incompatible techniques.

How do I find a diagram slug?

Visit scrollchart.com, find a diagram you like, and click the embed button. The slug is the kebab-case identifier in the snippet — for example, the slug for the RIR / RPE Scale diagram is rir-rpe-scale.

I want a diagram you don’t have. Can you make it?

Yes. Visit scrollchart.com/request-a-diagram. Most custom requests are turned around within 72 hours.

Does the plugin connect to external services?

Yes. All of the plugin’s JavaScript and CSS ships inside the plugin itself — nothing executable is loaded from a remote server. But to display the live, interactive diagrams, the bundled loader connects to scrollchart.com at runtime for diagram DATA:

  • It fetches each diagram’s metadata from scrollchart.com/api/diagram (cached locally on your server so repeat page-views do not hit the network). Only the diagram slug you embedded is sent.
  • It loads the interactive diagram view in an iframe from scrollchart.com/embed-frame/.
  • It sends a view ping to scrollchart.com/api/ping. The ping sends the diagram slug and the URL of the page the diagram is embedded on. We use this to show authors where their diagrams are being used and to periodically check that the embed is still live on that page. No cookies are set and no visitor-identifying data (no IP stored long-term, no user agent, no fingerprint) is collected. Note that a page URL can itself contain information placed there by the site (for example a username or token in the path or query string); if that is a concern for a particular page, do not embed a Scrollchart diagram on it.

In the editor (admin) screens, when you are picking or creating a diagram:

  • The catalogue browser loads the list of available diagrams from scrollchart.com/api/catalog.json. This is a read-only request; no data about you, your site, or your content is sent. The result is cached on your server for an hour.
  • When a logged-in editor uses the optional Generate with AI button, the editor’s typed prompt, and an email address only if the editor chooses to enter one, are sent from your server to scrollchart.com/api/generate.php, which returns a generated diagram. This happens only when an editor actively clicks Generate; it never runs for site visitors and never runs on the front end. If you do not use the AI generator, no prompt data is ever sent.

All of these are first-party Scrollchart endpoints (the service is operated by us, scrollchart.com). What is sent, who receives it, and how it is handled are documented in our privacy policy: scrollchart.com/privacy#wordpress-plugin. Use of the service is governed by our terms: scrollchart.com/terms.

Where is the source code for the bundled JavaScript?

All JavaScript ships human-readable except the front-end loader assets/embed.js, which is minified for size. Its full commented source is included in the plugin at assets/source/embed.src.js, and is also published at scrollchart.com/embed-loader-source.txt. Build instructions (a single esbuild minify step, no bundling) are in BUILD.md in the plugin source. Every other script (the editor bundle, the WPBakery and Elementor editor glue, the block editor script) is shipped unminified.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“Scrollchart” is open source software. The following people have contributed to this plugin.

Contributors

Translate “Scrollchart” into your language.

Interested in development?

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

Changelog

1.9.0 — 2026-05-22

  • New: a short reminder of what Scrollchart is for now sits above the diagram picker in the editor, so the catalogue feels less like a list of files and more like a way to turn a static page into one that comes alive. Editor-only; nothing changes on the front end.
  • i18n: added a translation template (languages/scrollchart.pot), a Domain Path header, and a load_plugin_textdomain call on init, so the plugin is ready for translation. All user-facing strings already use the scrollchart text domain.
  • Documented all external service connections in the readme and privacy policy, including the optional AI generator (which sends an editor’s prompt, and optionally an email, to scrollchart.com only when the editor clicks Generate).
  • Clarified exactly what the view ping sends: the diagram slug and the URL of the page the diagram is embedded on, used for usage stats and to verify the embed is live. No cookies or visitor-identifying data. The previous “no personal data” wording was replaced with a precise description.

1.8.8 — 2026-05-21

  • Updated “Tested up to” to WordPress 7.0.
  • Removed the WordPress.org plugin-directory graphics (banner, icon, screenshots) from the plugin package; these belong in the directory listing, not the installed plugin.
  • Added the full human-readable source for the minified embed loader (assets/source/embed.src.js) plus build instructions (BUILD.md), and documented it in the readme.
  • Fixed a broken WPBakery element icon reference that pointed at a file not shipped in the plugin.

1.8.7 — 2026-05-21

  • Removed the WordPress.org plugin-directory graphics (banner, icon, screenshots) from the plugin package; these belong in the directory listing, not the installed plugin.
  • Added the full human-readable source for the minified embed loader (assets/source/embed.src.js) plus build instructions (BUILD.md), and documented it in the readme.
  • Fixed a broken WPBakery element icon reference that pointed at a file not shipped in the plugin.

1.8.6 — 2026-05-14

  • Fixed: all JavaScript is now loaded through the standard WordPress script queue (wp_enqueue_script) instead of inline script tags. Affects the WPBakery element controls, the Elementor widget controls, and the front-end embed loader. No change to behaviour.
  • Fixed: the embed loader script now ships inside the plugin instead of being loaded from a remote URL. The plugin still connects to scrollchart.com for diagram data, but no executable code is fetched remotely.
  • Fixed: corrected the “Requires at least” version (the block uses Block API v3, which needs WordPress 6.3).
  • Internal: added an email sanitisation callback to the AI generator REST endpoint and minor escaping/consistency hardening.

1.8.5 — 2026-05-13

  • New: per-embed language picker in all four surfaces (Gutenberg block, Classic Editor shortcode, WPBakery element, Elementor widget). Pick from 15 supported languages including English, Spanish, French, German, Portuguese, Italian, Russian, Japanese, Simplified Chinese, Arabic, Hebrew, Korean, Polish, Turkish, and Dutch.
  • New: shortcode lang attribute and data-lang HTML attribute on the host div. Embeds render labels, axis titles, and source attribution in the chosen language.
  • New: right-to-left layout support for Hebrew and Arabic embeds (Unicode bidi handles in-text glyph direction; SVG geometry stays LTR).

1.8.4 — 2026-05-13

  • Improved: lightbox preview sizes to the diagram’s true proportions instead of being fixed at 600px.

1.8.3 — 2026-05-13

  • Improved: live preview now sizes to the diagram’s actual proportions instead of being letterboxed.
  • New: each catalogue tile has a magnify icon — click it to open a large lightbox preview of the diagram before picking it.

1.8.2 — 2026-05-13

  • Fixed: live preview in the WPBakery dialog now reflects theme, accent, background, and text-colour changes immediately.
  • Improved: catalogue tiles are smaller so you can scan more diagrams at once.

1.8.1 — 2026-05-13

  • Fixed: in the WPBakery dialog the catalogue picker now works reliably on every site, falling back to a same-origin server call when the host blocks direct cross-origin fetches.
  • Fixed: empty rows that occasionally appeared below the colour pickers in the WPBakery dialog are gone.

1.8.0 — 2026-05-13

  • Improved: simpler styling controls. Theme is now a clear Auto / Light / Dark toggle (defaults to Auto so the diagram follows the visitor’s preference). Accent and other colours use a clean swatch picker with optional custom hex.
  • Improved: size is now a single Fit container / Medium / Small dropdown — no more typing pixel dimensions.

1.7.1 — 2026-05-13

  • Improved: WPBakery dialog reorganised so the slug, generator, catalogue, preview, and all style controls live on one tab — no more hunting between tabs to change a colour.
  • Improved: live preview pane sized correctly inside the WPBakery dialog instead of filling the whole modal.

1.7.0 — 2026-05-13

  • Improved: the live preview, AI generator, and visual catalogue browser now work identically in the block editor, WPBakery Page Builder, and Elementor. Same components, same experience, no matter which builder you use.

1.6.0 — 2026-05-13

  • New: live preview inside the block editor. Tweak theme, accent, border, background, and size in the sidebar and watch the diagram update in place — no more save-and-preview cycle to check your styling.
  • New: AI-assisted generation. Click “Generate with AI” in the block, describe what you want to show (“A treatment improved symptoms in 78% of patients vs 45% on placebo”), and a custom diagram is created and dropped into your post.
  • New: browseable catalogue with search, category filter, and thumbnail tiles. Find a diagram visually instead of typing a slug.
  • Improved: catalog picker now shows what each diagram looks like, not just its name.

1.5.0 — 2026-05-12

  • New: built-in catalog browser in the block editor sidebar. Search the full library and pick a diagram without leaving the post.
  • Simplified: every visual control now lives under a single Style panel. Same options, fewer tabs.
  • Polish: settings page now only exposes look-and-feel defaults. Internal cache timing is handled automatically.

1.4.0 — 2026-02-24

  • New: native Elementor widget. No more wrapping [scrollchart] in a text element.
  • New: fixed-size layout option for placements that need exact pixel dimensions — newsletters, PDFs exported from WordPress, columns with unknown parent width.
  • New: per-embed Load Immediately toggle for hero and above-the-fold placements.

1.3.0 — 2025-10-14

  • New: WPBakery Page Builder integration. The “Scrollchart Diagram” element now appears in the WPBakery element library with grouped tabs for Appearance, Border, Size, and Performance.
  • Improved: tightened the default block-editor placeholder styling and the WPBakery preview thumbnail.

1.2.0 — 2025-08-02

  • New: dark-mode auto-detection. Set theme to Auto and diagrams will switch with the visitor’s OS preference.
  • New: custom text colour control for accessibility tuning over coloured backgrounds.
  • Improved: cache key now includes the host domain so multisite installs share less than they used to.

1.1.0 — 2025-05-19

  • New: native Gutenberg block. The previous shortcode flow remains supported and unchanged.
  • New: settings page under Settings -> Scrollchart for site-wide style defaults.

1.0.0 — 2024-09-15

  • Initial release. Shortcode support, light and dark themes, fully responsive iframe.

Meta

Ratings

No reviews have been submitted yet.

Your review

See all reviews

Contributors

Support

Got something to say? Need help?

View support forum