---
title: Customizing Wishlist Popup Icons in WooCommerce
description: "![Customizing Wishlist Popup Icons in WooCommerce screenshot](https://wpfactory.com/wp-content/uploads/pasted-image-0-36.png) To customize the wishlist popup icons in Wishlist for WooCommerce, go to WooCommerce > Settings > Wishlist, open the Style tab, and find the Popup notifications section. Set the Add Icon and Remove…"
url: "https://wpfactory.com/docs/customize-popup-icons/"
updated: "2026-09-27"
category: How to
tags:
  - Wishlist for WooCommerce
---

# Customizing Wishlist Popup Icons in WooCommerce

![Customizing Wishlist Popup Icons in WooCommerce screenshot](https://wpfactory.com/wp-content/uploads/pasted-image-0-36.png)

To customize the wishlist popup icons in Wishlist for WooCommerce, go to WooCommerce > Settings > Wishlist, open the Style tab, and find the Popup notifications section. Set the Add Icon and Remove Icon, optionally adjust the progress bar, colors, Timeout (default 7000 milliseconds), and Notification position, then save your changes.

#### ** Step 1: Navigate to WooCommerce Wishlist Settings**

1.  Log in to your WordPress dashboard.
2.  Click on **"WooCommerce****"** in the left-hand menu.
3.  Find and click on the **"[Wishlist](https://wpfactory.com/item/wish-list-woocommerce/)****"** tab under WooCommerce settings.

####  **Step 2: Access Wishlist Style Settings**

1.  Within the Wishlist settings, click on the **"Style"** tab.

####  **Step 3: Customize Popup Notification Icons**

1.  Locate the **"Popup notifications"** section under **"Style for notification."**
2.  Customize the icon displayed when an item is successfully added to the wishlist using the **"Add Icon"** option. For example, you can use `fas fa-check-circle`.
3.  Similarly, customize the icon for successful removal using the **"Remove Icon"** option. Consider using `fas fa-trash`.

![Step 3 screenshot](https://wpfactory.com/wp-content/uploads/pasted-image-0-37.png)

#### **Step 4: Enable Notification Progress Bar (Optional)**

1.  If desired, enable the notification progress bar using the **"Progress bar"** option.
2.  Set the progress bar color using the **"Progress bar color"** and **"Background color"** options.

####  **Step 5: Set Notification Styling**

1.  Define the background color for the notification window using the **"Background color"** option.
2.  Choose the text color for the notification using the **"Text color"** option.

####  **Step 6: Adjust Timeout Duration**

1. Set the timeout duration in milliseconds for automatically closing the notification window using the **"Timeout"** option. The default is 7000 milliseconds (7 seconds).

####  **Step 7: Choose Notification Position**

1.  Set the position where the notification window will appear using the **"Notification position"** option. Options include **"Center."**

####  **Step 8: Save Changes**

1.  Save your changes to apply the customized popup notification icon settings.

Now, your WooCommerce store will showcase popup notifications with icons that align with your brand style.

Related articles

- [Customizing Social Icons Color on Wishlist Page in WooCommerce](https://wpfactory.com/docs/customize-social-icons/)
- [Customizing Wishlist Icon Color in WooCommerce](https://wpfactory.com/docs/customize-wishlist-icon-2/)
- [Customizing Thumb Icon on WooCommerce Product Pages](https://wpfactory.com/docs/customize-thumb-icon/)
- [Adding Icons to Wishlist Tab in WooCommerce](https://wpfactory.com/docs/add-icons-wishlist-tab/)
- [How to Enable Loading Icon for Wishlist in WooCommerce](https://wpfactory.com/docs/enable-loading-icon-wishlist/)

 

[![Wishlist for WooCommerce](https://wpfactory.com/wp-content/uploads/Wishlist-for-WooCommerce.webp)](https://wpfactory.com/item/wish-list-woocommerce/)
