Hover.css, meet your website.

Improve your site's interactivity with captivating hover effects, enhancing user engagement and site aesthetics.

Add Hover.css to your site

Start with Hover.css

Sign in to Hover.css and find the embed code for what you want to show. Some plans don’t include embedding, so check yours.
Paste it. Place it.

Paste the code into your Pagecloud AI chat and say where it should go, like “Add this to the Contact page, under the address.” If Hover.css says where the code belongs, such as the page header, mention that too.
Make sure it works

Check the page on desktop and mobile. Some tools only show their embed once you add your website’s address in their settings.

Hover.css is a third-party service. It runs on your Hover.css account, which manages its own data, settings and subscriptions.

Pagecloud Classic setup steps

For sites built with Pagecloud Classic, our original builder.

Add an Animated Effect to an Object Offered by Hover.css

Download hover.css.zip to be able to create your effects.
Find the file and unzip it on your computer.
Drag the hover.css file on to your page where you want to create an effect while in editing mode.
Pick a desired effect from this list and copy it's name (ex. hvr-hang).
Click on the object you want to have the effect appear on.
Open the "Advanced" tab in the Editing Menu.
Click "CSS Selectors".
In the "Classes" field paste the name of the effect you chose (ex. hvr-hang).
Click "Save" and "View Live" to see your effect in action.

Good to know

What’s an embed code?

A short piece of code a tool gives you so its content can appear on another website, such as a booking form, a video, a map or a sign-up form. The tool keeps running it; your page shows it.

Where do I find it?

In the tool’s settings, usually under Share, Embed or Install. If you can’t spot it, search the tool’s help center for “embed”.

Will it add cookies to my site?

Some tools do. If yours does, your site’s cookie or privacy notice may need to mention it. The tool’s help center will say what it uses.

Can I change or remove it later?

Yes. Ask Pagecloud AI to move it, swap in new code or take it off the page.

What if my tool isn’t listed?

If it gives you an embed code, the same steps apply. Browse all integrations to see what’s covered.