If your links or hover animations aren't working, the issue is usually due to incorrect link settings, overlapping boxes, or the stacking order of your animation box.
In this article, we'll walk you through how to check and fix each of these issues.
The link setting has been removed
Another box is covering the element
An animation box covering the full page has a higher stacking order than other elements
1. Check that the link setting is still in place
If clicking a menu item or button doesn't take you to another page, check whether the link has been set up correctly.
How to check and fix
Open the Design Editor for your site.
Select the box that has the link or hover animation that isn't working.
In the right panel, open the [Settings] tab and check the [Link] field. If the panel is closed, open the right panel first.
If the link isn't set, or the destination is incorrect, set the correct link. For instructions on setting up links, see How to set up different types of links.
After making your changes, use Live Preview to confirm that the link works as expected.
If you're editing a published site, open the publish panel once you're done and update your site. Your changes won't appear on the published site until you do this.
2. Check whether another box is covering the element
Layout adjustments such as negative margins can cause another box to overlap the one with the link, making it unclickable.
How to check and fix
Open the Design Editor for your site.
Select the box that has the link or hover animation that isn't working.
Visually check whether another box is overlapping the target box on screen.
For more complex layouts, open the Layers panel to review how the boxes are nested and positioned.
If a box is overlapping, move it or resize it so it no longer sits on top of the link box.
After repositioning, adjust the stacking order if needed, and make sure the link box can receive clicks.
Once you're done, use Live Preview to confirm that the link and hover animation work as expected.
If you're editing a published site, open the publish panel once you're done and update your site. Your changes won't appear on the published site until you do this.
3. Adjust the stacking order of the animation box
If an animation box that covers the whole page (such as a loading effect) has a higher stacking order than other elements, it can block clicks and hovers — even when it's not visible on screen.
How to check and fix
Open the Design Editor and select the loading box or hover animation box that covers the entire page.
In the right panel, select the [Box] tab. Under [Position], check whether the stacking order value is higher than that of the box with the link.
To prevent the animation box from staying in front during regular display (after the animation finishes), set its stacking order to a lower number than the other boxes.
For example: if the animation box is set to "-3" and other boxes are set to "-4," lower the animation box value to something like "-5."
Even if you're only changing the opacity to hide the box, a high stacking order can still block clicks. Consider animation methods that account for both visibility and the clickable area — for example, scaling the box to 0.
Use Live Preview to confirm that links and hover animations work as expected.
If you're editing a published site, open the publish panel once you're done and update your site. Your changes won't appear on the published site until you do this.
If you've tried the steps above and the issue still isn't resolved, reach out to our support team via the [?] icon in the bottom right of the editor.