Sale icon The Biggest WordPress Deal of 2026
ENDING IN:
00 DAY
:
00 HOUR
:
00 MIN
:
00 SEC
Save up to $4,152 now Arrow Icon

Entrance or Exit Animations for Popup

Animations are a powerful way to grab a visitor’s attention or create a smooth transition when a popup closes. This guide will walk you through applying and customizing Entrance and Exit Animations pour votre Kit de pop-up campaigns.

How to Apply Entrance or Exit Animation in PopupKit #

Before going to follow the step below, you must need to have installed and activated the PopupKit plugin in your WordPress websites.

Step 1: Open the Popup Editor #

To begin, you need to access the specific popup campaign you wish to animate:

  1. Log in to your Tableau de bord WordPress.
  2. Aller vers PopupKit > All Popups.
  3. Cliquez sur Modifier on the popup campaign you want to modify.

Step 2: Locate Animation Settings #

Animation controls are housed within the layout settings of your popup:

  1. Inside the editor, look at the left-hand settings panel.
  2. Clique sur le Display Options languette.
  3. Scroll down until you see the Animation d'entrée et Exit Animation sections.

Step 3: Configure Entrance Animation #

The Entrance Animation determines how the popup appears when it is first triggered.

  1. Click the dropdown menu for Animation d'entrée.
Entrance or Exit Animations for Popup
  1. Select an animation style from the following categories:
    • Fading: Fade In, Fade in Down, Fade in Left, etc.
    • Zooming: Zoom In, Zoom in Down, Zoom in Left, etc.
    • Bouncing: Bounce In, Bounce in Down, Bounce in Left, etc.
    • Sliding: Slide In, Slide in Down, Slide in Left, etc.
    • Rotating: Rotate In, Rotate in Down, Rotate in Left, etc.
    • Attention Seekers: These are high-energy movements like Bounce, Flash, Pulse, Shake, Tada, et Wobble.
    • Spécial: Roll In.

Note: Attention Seekers animation types are exclusive to the Animation d'entrée setting, helping you capture user focus immediately.

Step 4: Configure Exit Animation #

The Exit Animation determines how the popup disappears when a user closes it or completes an action.

Entrance or Exit Animations for Popup
  1. Localisez le Exit Animation dérouler.
  2. Choose your preferred style. You will find the same categories (Fading, Zooming, Bouncing, Sliding, Rotating) as the entrance options.

Pro Tip: For a professional feel, try to “mirror” your animations. If your popup Slides In from the left, have it Slide Out to the left.

Étape 5 : Enregistrer et prévisualiser #

Once you have selected your animations:

  1. Clique le Sauvegarder ou Mise à jour button at the top of the editor.
  2. Clique le Aperçu button to see the animations in action.
  3. Ajuste le Durée de l'animation (if available) to move faster or slower.

Adding PopupKit entrance and exit animations transforms static popups into dynamic experiences that effectively capture attention. Experiment with different styles today to find the perfect balance for your site’s conversion goals!

Quels sont tes sentiments

Updated on avril 2, 2026