Join

How to Color the MyListing User Dashboard Menu Icons on Item Hover

Don't want to mess with code snippets? Request for this to be a feature of MyListing Pro.

Instructions

  1. Create a new CSS code snippet.
  2. Copy the contents of code snippet below.
  3. Paste the contents into your code snippet.
  4. Review any notes that I’ve provided.
  5. Save and enable the code snippet.
  6. Test.

Snippet

Main Navigation Menu

The menu that’s targeted with this snippet is the default MyListing user menu that’s displayed in the navigation area, as you typically see on any WordPress website, rather than the dashboard menu that has all of the WooCommerce endpoints (Listings, Promotions, etc.).

By default, both the menu icons and the menu text are black. This snippet differentiates these two elements on hover.

.i-dropdown li a:hover i {
    color: red;
}
how to color the mylisting user dashboard menu icons on item hover

MyListing Dashboard Menu

The menu that’s targeted with this snippet is the MyListing dashboard menu that has all of the WooCommerce endpoints (Listings, Promotions, etc.), rather than the default MyListing user menu that’s displayed in the navigation area, as you typically see on any WordPress website,

By default, both the menu icons and the menu text are black. This snippet differentiates these two elements on hover.

.woocommerce-MyAccount-navigation ul li a:hover i {
    color: red;
}
how to color the mylisting user dashboard menu icons on item hover 2