word_cloud

The Word Cloud module transforms your Drupal 10/11 site into a dynamic data visualization platform by rendering text and textarea fields as interactive, canvas-based word clouds. Built with a focus on performance and zero third-party JavaScript dependencies, it provides a lightweight yet powerful way to display tag clouds, frequency maps, or content summaries directly within your field displays.

Key Features

• Versatile Shape Constraints: Mask your word clouds into 12 distinct shapes including Circles, Hearts, Stars, Diamonds, and Arrows to match your site's branding.
• Curated Color Palettes: Choose from 9 professionally designed color schemes (Vibrant, Ocean, Neon, etc.) or define a custom 8-slot palette with full hex support.
• Advanced Typography & Layout: Complete control over font families, weights, and min/max font sizes. Includes optional vertical word rotation with configurable probability.
• Interactive Entry Animations: Engaged users with entry effects like Fade In, Zoom In, Wave, or Glitch, plus hover-state "Spin" effects.
• DPR & Retina Ready: Automatically detects device pixel ratios to ensure crisp, high-definition rendering on 4K and mobile displays.
• Accessibility First: Generates a visually hidden ARIA-compliant list for screen readers, ensuring your data visualizations remain WCAG compatible.

Installation

Install the module using Composer (recommended) to ensure all internal service dependencies are correctly mapped.

composer require drupal/word_cloud

Enable the module using Drush:

drush en word_cloud

Configuration & Usage

The Word Cloud is implemented as a Field Formatter, making it easy to apply to existing content types:

1. Navigate to Structure » Content types » [Your Type] » Manage display.
2. Locate a Text or Text (long) field and change the formatter to Word Cloud.
3. Click the Gear icon (⚙) to configure the canvas height, background transparency, and shapes.
4. Note: You can use the word:weight syntax (e.g., Drupal:10, PHP:5) in your field content to manually override word sizes.

Interactivity & Search

Turn your word cloud into a navigation tool by enabling Click-to-Search in the formatter settings. This allows each word to link directly to a search path (e.g., /search?keys=[word]), driving deeper user engagement with your content.

Transparency Support

Unlike standard HTML5 color pickers, this module includes a "Transparent Background" toggle. When enabled, the canvas background is cleared entirely, allowing the cloud to float seamlessly over your theme's existing background gradients or images.

Requirements

This module requires Drupal 10.2+ or 11 and PHP 8.1+. It utilizes the native HTML5 Canvas API and is compatible with all modern evergreen browsers.

Similar Projects

• Wordcloud
• MD WordsCloud
  
• TagCloud
  
• Dynamic Tag Clouds

Supporting this Module

The Word Cloud module is an open-source project maintained for the Drupal community. Your support helps keep the tool robust, accessible, and updated for future Drupal releases. You can contribute in the following ways:

• Report Bugs: If you encounter rendering issues or configuration errors, please file a detailed report in the Issue Queue.
• Feature Requests: Have an idea for a new canvas shape (like a cloud or a map) or a unique animation? We welcome innovative ideas to expand the module's capabilities.
• Documentation & Tutorials: Helping other users understand advanced configurations or sharing CSS snippets for unique cloud designs is a great way to give back.
• Translations: Help us make the admin interface accessible to non-English speakers by contributing translations via localize.drupal.org.

If you find this module useful in your projects, please consider starring the project on Drupal.org or providing a testimonial in the issue queue!