Add animations and interactivity to your blocks. Choose from ready-made effects like scroll & hover in the Interactions Library, or build your own.

Pedro

emanuelbsilva

Dot Embed

Embed Product Finders, Interactive Conversations, Assessments, Calculators, Configurators, Quizzes, Interactive videos, Games and much more into your  …

mambrum

Mambrum

A plugin that adds Mambrum Experiences to your website

Benjamin Intal

gambitph

Interactions – WordPress Animations, Interactive Experiences for Gutenberg Blocks
<a href="https://wpinteractions.com" rel="nofollow ugc">Visit our website</a> to learn more about how Interactions work.
Want to make your website feel alive and interactive? Interactions is the easiest way to add animations, effects, interactivity, and functional features to WordPress — directly inside the block editor. Check our <a href="https://wpinteractions.com/samples/" rel="nofollow ugc">samples page here</a> to see a glimpse of what type of interactions you can create.
You don’t need coding skills or complex tools. With Interactions, you can:
<ul>
<li>Pick from the <a href="https://docs.wpinteractions.com/article/744-how-to-use-interactions-library" rel="nofollow ugc">Interactions Library</a> – A collection of pre-built animations and effects (like images that move upon scrolling down the page, buttons that glow when hovered, and more). Just click and apply. <a href="https://docs.wpinteractions.com/article/744-how-to-use-interactions-library" rel="nofollow ugc">Learn more</a></li>
<li>Build your own custom effects – Use a simple Trigger → Action system. Example: “On scroll → Fade in block”, or “On click → Play video”. <a href="https://docs.wpinteractions.com/article/577-what-is-wp-interactions-and-how-does-it-work" rel="nofollow ugc">Learn more</a></li>
<li>Add functional features – Securely update post data, handle form submissions, display user info, copy text to clipboard, and more without coding. <a href="https://docs.wpinteractions.com/category/729-interactions" rel="nofollow ugc">Learn more</a></li>
</ul>
Whether you want subtle hover effects, attention-grabbing story-telling animations, playful micro-interactions, or powerful functional features, <a href="https://wpinteractions.com" rel="nofollow ugc">Interactions</a> makes it possible.
<h3>🚀 Features</h3>
Create <a href="https://docs.wpinteractions.com/article/571-what-are-interactions" rel="nofollow ugc">custom interactions</a> easily with a simple Trigger → Action builder. Features include:
Animations & Visual Effects:
<ul>
<li>Animations for WordPress blocks (fade, slide, zoom, rotate, shadow, etc.)</li>
<li>Scroll effects – reveal content as users scroll down</li>
<li>Hover effects – highlight and animate blocks on hover</li>
<li>Click triggers – run actions when buttons, images, or sections are clicked</li>
</ul>
Basic Interactions:
<ul>
<li>Mouse interactions – Click, hover, mouse move, mouse press</li>
<li>Scroll interactions – Enter viewport, element scrolling, page scrolling</li>
<li>Form interactions – Form submitted, input change, keypress</li>
<li>Page interactions – Page load, page create</li>
</ul>
Basic Actions:
<ul>
<li>Animation actions – Move, rotate, scale, skew, opacity</li>
<li>Style actions – Background color, background image, text color, CSS rule, toggle class, update attribute</li>
<li>Display actions – Display, visibility, focus</li>
<li>Navigation – Redirect to URL</li>
<li>Media – Toggle video</li>
<li>Effects – Confetti</li>
</ul>
Core Features:
<ul>
<li>Reusable Interaction Library – apply popular effects instantly</li>
<li>Custom trigger → action builder – advanced users can design unique effects</li>
<li>Performance optimized – loads only what’s needed for your chosen interactions</li>
<li>Works with any block and any theme</li>
</ul>
<h3>🎯 Perfect For</h3>
<ul>
<li>Designers who want scroll animations without code </li>
<li>Marketers who want attention-grabbing hover effects </li>
<li>Bloggers who want dynamic storytelling with animations </li>
<li>Site builders who want to bring their block designs to life, or create unique micro-interactions</li>
<li>Developers who need functional features like post meta updates and data handling</li>
<li>Anyone building modern interactive websites in WordPress </li>
</ul>
<h3>💎 What’s in Premium?</h3>
<a href="https://wpinteractions.com/pricing/" rel="nofollow ugc">Check our pricing page</a> to learn more about what’s in Interactions premium.
Advanced Interactions:
<ul>
<li>Scroll Strength – Measure scroll intensity</li>
<li>Page State – Monitor page state changes</li>
<li>Page Exit – Detect when users try to leave</li>
<li>URL Hash – Respond to URL hash changes</li>
<li>Local Storage – Monitor storage changes</li>
<li>Toggle Attribute/Class – Watch attribute and class changes</li>
<li>HTML Events – Custom HTML and document events</li>
</ul>
Advanced Actions:
<ul>
<li>Box Shadow – Dynamic shadow effects</li>
<li>Slide Animations – Smooth slide up/down effects</li>
<li>Content Management – Securely insert sanitized HTML, render shortcodes, copy to clipboard</li>
<li>Data & Post Management – Update post/user meta (with permissions), get post data, local storage</li>
<li>Navigation & UX – Scroll to element, tooltips, popups, confirmation dialogs</li>
<li>Media – Video scrubbing, SVG animations (line draw, morph, motion path)</li>
<li>Advanced Features – Animated counters, advanced automation</li>
</ul>
Premium Benefits:
<ul>
<li>40+ Premium Actions – Access to advanced functionality</li>
<li>10+ Premium Interactions – More trigger options</li>
<li>Priority Support – Faster response times</li>
<li>Regular Updates – New features and improvements</li>
<li>Commercial License – Use in client projects</li>
</ul>
Source Code:
The source code for this plugin is available on GitHub: 
https://github.com/gambitph/Interactions

Alternatives to Interactions – Create Interactive Experiences in the Block Editor

Top alternatives