Home › Forums › Themes Support › Claue › Color Customization of one or more items in Main Menu
- This topic has 12 replies, 2 voices, and was last updated 4 years, 2 months ago by
seventalents.
-
AuthorPosts
-
-
November 27, 2020 at 10:22 pm #39397
How can I edit the color of one or more items in main menu? see attached screenshot.
Attachments:
You must be logged in to view attached files. -
November 27, 2020 at 11:12 pm #39406
Hi,
1. you can change color for all menu item in Claue > Theme Option > Color Scheme
2. If you want change for single menu item, please right click on menu item and inspect to menu item to know menu ID https://prnt.sc/vrcgc4 and add code to claue-child > style.css
.home .header__transparent .jas-menu > li#menu-item-66 > a { color: #222; }
and change 66 with menu item ID number.
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
November 28, 2020 at 12:00 am #39414
Thanks Harry, it works if I add it to Claue > Theme Options > General Layout > Custom CSS.
How can I edit the hover color of the same item?
-
November 28, 2020 at 8:33 am #39421
Hi,
Please change code to
.home .header__transparent .jas-menu > li#menu-item-66 > a, .jas-menu > li#menu-item-66 > a, .home .header__transparent .jas-menu > li#menu-item-66:hover > a, .jas-menu > li#menu-item-66:hover > a { color: #222; }
and change your ID number and color
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
November 30, 2020 at 4:50 pm #39433
Thanks Harry … the last questions regarding this topic:
- Why it doesn’t work if I add the code to claue-child > style.css and it works if I add it to Claue > Theme Options > General Layout > Custom CSS?
- If I leave the code in Claue > Theme Options > General Layout > Custom CSS, when I’ll update the theme do I lose my code?
-
November 30, 2020 at 5:35 pm #39438
Hi Seventalents,
I’m not sure why, can you please send me login credential to check.
The code you added in Claue > Theme Options > General Layout > Custom CSS not lose when you update.
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
November 30, 2020 at 5:57 pm #39440This reply has been marked as private.
-
December 1, 2020 at 4:36 pm #39446
Besides I have noticed that the color for single menu item “PROMO” is red only on homepage, on other pages it isn’t red, why?
Finally how can change the color for single menu item on mobile version and add a badge for single menu item on mobile version?
-
December 1, 2020 at 11:46 pm #39451
Hi,
1. It now your site using header transparent option and it only work on homepage.
Please change code to
.home .header__transparent .jas-menu > li#menu-item-358 > a, .jas-menu > li#menu-item-358 > a { color: #ff3e11; }
to make it work on other page
2. Please use below code for mobile
#jas-mobile-menu ul li#menu-item-358 a { color: #ff3e11 !important; }
I’m sorry on mobile it not support badge.
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
December 11, 2020 at 9:39 pm #39564
The code for mobile doesn’t work
-
December 11, 2020 at 11:14 pm #39570
Please change code for mobile to
#jas-mobile-menu ul li.hot a { color: #ff3e11 !important; }
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
December 12, 2020 at 7:13 am #39578
Great! it’s ok.
-
December 12, 2020 at 7:16 am #39579
Perfect!
-
-
AuthorPosts
You must be logged in to reply to this topic.