serend

Serend Animations makes it incredibly easy to add stunning scroll animations to any Gutenberg block. Choose an animation type, select a direction with intuitive arrow buttons, optionally enable slow motion, and watch your content come to life as visitors scroll through your page.
NEW in v1.0.3: Visual direction picker with arrow buttons! All animation types now support all 4 directions (top, right, bottom, left), plus a universal Slow Motion toggle for dramatic effects.
Why choose Serend Animations?
<ul>
<li>Visual Direction Control: Intuitive arrow buttons to select animation direction – no more guessing!</li>
<li>20 Animation Variants: 5 animation types × 4 directions = endless creative possibilities</li>
<li>Slow Motion Toggle: Make any animation 1.5x slower for more dramatic effects</li>
<li>Ultra Lightweight: Pure CSS animations with minimal JavaScript – only 8KB total</li>
<li>GDPR Friendly: No tracking, no cookies, no external connections – 100% privacy compliant </li>
<li>Zero Dependencies: No jQuery, no third-party libraries, no external CDNs</li>
<li>Lightning Fast: GPU-accelerated CSS animations with Intersection Observer</li>
<li>Security First: Clean code, no external requests, WordPress security standards</li>
<li>Accessibility Ready: Respects user motion preferences automatically</li>
<li>White Label Ready: Clean frontend code without plugin branding or bloat</li>
</ul>
<h4>Features</h4>
<ul>
<li>5 Animation Types with 4 Directions Each: 20 beautiful animation variants to choose from</li>
<li>Visual Direction Picker: Intuitive arrow buttons to select animation direction (top, right, bottom, left)</li>
<li>Slow Motion Toggle: Make any animation 1.5x slower for more dramatic effects</li>
<li>Staggered Animations: Use the delay slider to create cascading animation effects</li>
<li>One-Click Integration: No code required – just select an animation and direction</li>
<li>Performance Optimized: Uses native Intersection Observer API for smooth performance</li>
<li>Works with All Blocks: Compatible with every Gutenberg block</li>
<li>Clean Code: Pure CSS + vanilla JavaScript – no bloat, no dependencies</li>
</ul>
<h4>How It Works</h4>
<ol>
<li>Open any block in the Gutenberg editor</li>
<li>Look for “Serend Animation” in the block inspector panel</li>
<li>Choose an animation type (Fade, Zoom, Rotate, Bounce, or Flip)</li>
<li>Select a direction using the visual arrow buttons</li>
<li>Optionally enable “Slow Motion” for a more dramatic effect</li>
<li>Optionally set a delay for staggered effects</li>
<li>Click “Show Animation” to preview in the editor</li>
<li>Save and view your animated content on the frontend</li>
</ol>
<h4>Animation Types</h4>
Each animation type supports 4 directions (top, right, bottom, left):
<ul>
<li>Fade: Elements gracefully fade in while sliding from the selected direction</li>
<li>Zoom: Elements scale up from smaller size while moving from the selected direction</li>
<li>Rotate: Elements rotate while scaling and moving from the selected direction</li>
<li>Bounce: Elements bounce in with elastic effect from the selected direction</li>
<li>Flip: Elements flip in with 3D rotation (X-axis for top/bottom, Y-axis for left/right)</li>
</ul>
Plus, every animation can be made slower with the “Slow Motion” toggle for more dramatic effects!
<h4>Perfect For</h4>
<ul>
<li>GDPR-Compliant Websites: No tracking, no cookies, no privacy concerns</li>
<li>Performance-Critical Sites: Lightweight and fast-loading</li>
<li>Agency & Developer Projects: White label ready, clean code with no plugin branding</li>
<li>Landing Pages: Engaging animations without the bloat</li>
<li>Portfolio Websites: Showcase your work with beautiful effects</li>
<li>Business Sites: Stand out without compromising on speed or privacy</li>
<li>Blog Posts: Dynamic content reveals that respect user preferences</li>
<li>Client Projects: Safe, reliable animations with zero maintenance overhead</li>
</ul>
<h4>Developer Friendly</h4>
<ul>
<li>Pure CSS + Vanilla JS: No jQuery or framework dependencies</li>
<li>WordPress Coding Standards: Clean, secure, and maintainable code</li>
<li>Zero External Calls: No CDNs, APIs, or third-party services</li>
<li>White Label Frontend: No plugin branding or comments in generated HTML/CSS</li>
<li>Lightweight Footprint: Only 8KB total – smaller than most images</li>
<li>Extensible Architecture: Easy to customize with your own CSS</li>
<li>Debug Mode: Built-in tools for development and troubleshooting (enable via Settings → Serend Animations)</li>
<li>GDPR Compliant: No data collection, tracking, or external connections</li>
<li>Security Focused: Follows WordPress security best practices</li>
</ul>
<h3>Additional Information</h3>
<h4>Minimum Requirements</h4>
<ul>
<li>WordPress 6.0 or higher</li>
<li>PHP 7.4 or higher</li>
<li>Modern browser with JavaScript enabled</li>
</ul>
<h4>Contributing</h4>
This plugin is open source. Contributions are welcome.

Serend Animations

Add beautiful scroll animations to Gutenberg blocks with a simple dropdown. Lightweight, GDPR-friendly, no third-party dependencies!

Sanjay Shankar

Seasonal Effects is the ultimate toolkit for holiday marketing and seasonal decorations.
🚀 Boost Black Friday & Cyber Monday Sales 
Create urgency with countdown timers, flash sale banners, and exclusive “Sale Mode” animations like falling price tags and shopping bags.
🎃 Spooky Halloween Effects – Crawling spiders, floating ghosts, flying bats, fog effects 
🎄 Festive Christmas Vibes – Winter themes with falling snow, lights, and ornaments 
🎆 Celebration Ready – New Year fireworks, confetti, and balloons
<h3>🛍️ Black Friday & Cyber Monday Features</h3>
Maximize your Q4 revenue with dedicated tools: 
* Countdown Timers: Create FOMO with urgent timers in your notice bar. 
* Sale Animations: Falling “Sale” tags, shopping bags, and discount icons. 
* Cyber Effects: Matrix rain and glitch effects perfect for Cyber Monday tech deals. 
* Pre-built Templates: One-click setup for Black Friday (Dark/Red) and Cyber Monday (Neon/Tech). 
* Scheduled Campaigns: Set start/end dates for your sales banners automatically.
<h3>✨ Key Features</h3>
6 Beautiful Animations: 
* 🦇 Flying Bats – Smooth flight patterns 
* 👻 Floating Ghosts – Mysterious floating 
* 🎃 Running Pumpkin – Rolling across screen 
* 🍂 Falling Leaves – Autumn atmosphere 
* 🕷️ Crawling Spiders – Realistic crawling motion 
* 🌫️ Fog Effect – Multi-layer fog drift
Smart Controls: 
* Individual on/off toggles 
* Count controls (1-20 elements) 
* Speed variations (slow/medium/fast) 
* Mobile device support 
* Display location targeting
Notice Bar System: 
* 🎨 Advanced Design: Gradients, background images, and custom colors 
* ⏱️ Countdown Timer: 5 styles (Simple, Rounded, Square, Filled, Circle) 
* 👁️ Visibility Rules: Show on specific pages (Home, Blog, Posts, CPTs) 
* 🍪 Smart Closing: Session-based, time-based (1h/1d/7d), or permanent dismissal 
* 📱 Responsive: Top/Bottom positioning with mobile support 
* 📝 Rich Content: Full WYSIWYG editor with color and font size controls
5 Sales Templates: 
* ⚫ Black Friday: High-converting dark theme with red accents 
* 💻 Cyber Monday: Modern neon/tech aesthetic 
* 🎄 Christmas Sale: Festive holiday colors 
* ⭐ Special Offer: High contrast attention grabber 
* ⚡ Flash Sale: Urgent gradient design
<h3>🎯 Perfect For</h3>
<ul>
<li>Black Friday / Cyber Monday Sales</li>
<li>Holiday themed websites</li>
<li>Seasonal sales and promotions</li>
<li>Event announcements</li>
<li>Blog posts and articles</li>
<li>E-commerce stores</li>
<li>Portfolio sites</li>
</ul>
<h3>⚡ Performance</h3>
<ul>
<li>CSS-only animations (no JavaScript overhead)</li>
<li>GPU-accelerated transformations</li>
<li>Mobile-optimized</li>
<li><50ms page load impact</li>
<li>60fps smooth animations</li>
</ul>
<h3>🔒 Privacy & Security</h3>
<ul>
<li>No external API calls</li>
<li>No data collection</li>
<li>No tracking cookies</li>
<li>All settings stored locally</li>
<li>Fully GDPR compliant</li>
</ul>
<h3>👨‍💻 Developer</h3>
Created with 🎃 by <a href="https://sanjayshankar.me" rel="nofollow ugc">Sanjay Shankar</a>
Connect: 
* <a href="https://profiles.wordpress.org/sanjuacodez/" rel="nofollow ugc">WordPress Profile</a> 
* <a href="https://github.com/sanjuacodez" rel="nofollow ugc">GitHub</a> 
* <a href="https://www.linkedin.com/in/sanjayshankar/" rel="nofollow ugc">LinkedIn</a> 
* <a href="https://sanjayshankar.me" rel="nofollow ugc">Website</a>
Support Development: 
* <a href="https://buymeacoffee.com/sanjayshankar" rel="nofollow ugc">Buy Me a Coffee</a> ☕

Seasonal Effects & Notice Bar (formerly Halloween Animations)

Boost your Black Friday & Cyber Monday sales with festive animations, countdown timers, and high-converting notice bars!

Serend Animations vs Seasonal Effects & Notice Bar (formerly Halloween Animations)