內容簡介
Animation Kit 外掛讓您的 WordPress 網站增添驚人的動畫背景效果，提升用戶互動與視覺吸引力。這款功能豐富的外掛適用於各種頁面建構器，無需編碼即可輕鬆自訂背景動畫，為訪客帶來難忘的瀏覽體驗。
【主要功能】
• Antigravity 背景效果：創造迷人的漂浮粒子動畫
• Pillar 背景效果：實現驚人的垂直柱子動畫
• 可自訂動畫設定：調整動畫速度、顆粒數量等
• 區域特定應用：針對特定區域或頁面應用不同效果
• 響應式背景動畫：適用於各種設備，確保一致的視覺體驗
• 性能優化渲染：保持流暢的 60fps 表現
外掛標籤
開發者團隊
② 後台搜尋「Animation Kit – Animated Backgrounds & WebGL Effects」→ 直接安裝（推薦）
原文外掛簡介
Animation Kit lets you add a moving WebGL background to any WordPress page — a particle field, an aurora wash, a sweeping radar pulse — from a single admin screen. No theme editing, no shortcodes, no CSS. Pick an effect, tune the colors and motion, save, and your visitors see a smooth canvas layer behind your content.
The plugin is builder-agnostic: it renders at the document level, so it cooperates with classic themes, block themes, Elementor, Bricks, WPBakery, and Gutenberg page builds without needing a per-builder integration.
How it works
You get a dedicated Background Animation screen inside the WP admin. From there:
Pick one of 13 free effects (full list below).
Adjust the live controls — colors, speed, density, opacity, z-index, position.
Toggle the background on. The canvas appears site-wide.
The free tier targets the whole website (single configuration). Pro adds multiple stacked configurations and per-page placement rules.
Effects included in the free version
Antigravity — Magnetic particle field that reacts to pointer movement. Good for tech, SaaS, and sci-fi-style hero sections.
Aurora — Flowing color washes. Suits portfolios, night-mode brands, and creative agencies.
Color Bends — Multi-stop color gradient with noise warp and slow rotation. Works as a brand backdrop.
Grid Scan — Animated grid with a sweep line. Tech, cyber, and dashboard aesthetics.
Line Waves — Concentric line waves with color cycling. Graphic, poster-like.
Liquid Ether — Fluid simulation that ripples and bends with cursor movement. Most “wow” of the set.
Particles — Drifting particle systems with configurable count, color, and spread.
Pixel Blast — Animated pixel patterns (square, circle, triangle) with optional click-ripples. Retro and game-style.
Plasma — Classic plasma shader with direction, scale, and color. Soft demoscene feel.
Prism — Rotating 3D prism with bloom. Crystalline, futuristic.
Radar — Sweep-style radar visualization with ring and spoke controls.
Soft Aurora — Lower-intensity aurora with two-color gradient. Easier on small-screen viewers.
Light Pillar — Vertical light column with adjustable glow, width, height, and rotation. Good for landing-page focal points.
Each effect has its own controls; you only ship the code for the effect you enable (lazy-loaded chunk per effect, not a single fat bundle).
Use cases
Hero sections that need motion without an animated video.
Landing pages where you want a moving backdrop behind a CTA.
Portfolios and agency sites that want a signature visual.
Conference, course, and event sites that want a “live” feel.
Dark-mode marketing pages where Aurora or Light Pillar adds depth.
Performance and Core Web Vitals
Animation Kit is built around lazy loading. The frontend script only ships when a background is enabled; the heavy rendering code (Three.js, OGL, the per-effect shader) is split into separate chunks loaded on demand after DOMContentLoaded. On mobile, particle counts and pixel ratios are clamped automatically.
Compatibility filters are registered for WP Rocket, LiteSpeed Cache, Autoptimize, W3 Total Cache, and WP Fastest Cache so their delay-JS / combine-JS / minify rules don’t break the lazy chunks.
Accessibility
The canvas wrapper is aria-hidden="true" and pointer-events: none — assistive tech ignores it, and visitors can still click links, forms, and menus through it.
prefers-reduced-motion: reduce is honored: when the user’s OS preference is set, the WebGL mount is skipped entirely. If the preference is toggled off during a session, the animation mounts at that point.
Animation Kit Pro
When the free tier stops fitting, Pro adds:
Multiple background configurations stacked or rotated on the same site.
Per-page placement rules — specific pages, CSS selectors, or HTML element targets.
Premium roadmap access and priority support.
Pricing and details: https://wpxero.com/plugins/wpxero-animation-kit/pricing
