DOCS

Getting Started

Animation Library for Modern Websites

Voom.sh Animations is a lightweight, animation library that lets you add professional animations to any website without writing a single line of JavaScript. Whether you're a founder, no-code builder, or small business owner, you can level up your website in minutes with slick animations that just work.

Our animation library works seamlessly with WordPress, Webflow, and standard HTML websites, using a simple attributeor class based system that makes implementation quick and intuitive.

Quick Installation

Adding Voom.sh to your website takes less than a minute. Simply add our script to your project before the closing </body> tag:

<script src="https://cdn.jsdelivr.net/gh/ktonik/voom@v1.0.4/dist/voom-demo.min.js"></script>

That's it! The script automatically loads all dependencies including:

  • GSAP (GreenSock Animation Platform)
  • GSAP ScrollTrigger plugin
  • SplitType for text animations

You don't need to include these libraries separately - Voom.sh handles everything for you.

How to Use Voom.sh Animations

Once you've installed the script, you can start adding animations to your website elements using either HTML classes or attributes - choose whichever method works best for your setup.

Method 1: Using Classes (Recommended for WordPress)

This method works great with WordPress (Elementor, Gutenberg, and other page builders) where you can easily add classes to elements:‍

<h1 class="voomsh-hdr-1"> ...
<p class="voomsh-par-1"> ...
<button class="voomsh-btn-1"> ...

Method 2: Using Attributes (Recommended for Webflow)

For Webflow and other platforms where custom attributes are easier to implement:‍

<h1 voomsh="hdr-1"> ...
<p voomsh="par-1"> ...
<button voomsh="btn-1"> ...

That's it! Your elements will now animate based on the predefined animation styles.

Advanced Configuration (coming in PRO)

In PRO version, you will be able to customize predefined animation to your specific needs

  • modify timing
  • trigger type
  • disable on mobile

and more...

Troubleshooting

Animations Not Working?
  • Check script placement: Make sure the Voom.sh script is placed before the closing </body> tag.
  • Verify class/attribute names: Double-check that you've used the correct animation class or attribute names.
  • Z-index issues: If animations appear behind other elements, adjust the z-index of your animated elements.
  • Check for JavaScript errors: Open your browser's developer console to check for any errors.

Next Steps

Check out our platform-specific guides for detailed instructions:

Need help?

‍ Contact our support at support@voom.sh