Articles on: Shopify Apps

How to Set Up Favi: Favicon Tab Animation

Introduction

Favi: Favicon Tab Animation helps you re-engage inactive visitors and recover abandoned carts using eye-catching browser tab animations.


When a user navigates away from your store tab, Favi replaces the default favicon and tab title with a custom animated message, encouraging them to return and complete their purchase.


Step 1: Enable the Favi App

  1. Open the Favi app from your dashboard.
  2. Enable the app to activate favicon animations on your store.

This is a required step before configuring any settings.


Step 2: Customize the Animation Message

  1. In the settings panel, locate the “Animation Text” field.
  2. Enter the message you want to display when users leave your tab.

Example: “Hey! Don’t forget your cart 🛒”


Step 3: Choose When the Animation Appears

Select when the animation should be triggered:

  • When the tab becomes inactive (default)
  • When there are items in the cart
  • Always active


Step 4: Select an Animation Type

Choose one of the available animation effects:

  • Typewriter Effect – text appears letter by letter
  • Blinking Text Effect – message flashes to grab attention


Step 5: Save and Preview Your Changes

  1. Click Save Settings to apply your configuration.
  2. Open your storefront in a new browser tab.
  3. Switch to another tab to see the animation in action.


Conclusion

By configuring Favi, you can capture user attention, reduce abandoned carts, and increase engagement with minimal effort.


If you need help setting up or optimizing your animations, feel free to contact our support team. We’re always here to assist! 🚀

Updated on: 19/03/2026