- This topic has 4 replies, 2 voices, and was last updated 5 years, 10 months ago by Skandha.
-
AuthorPosts
-
February 19, 2019 at 4:54 am #166162carolinecParticipant
Hi
I am new to wordpress and catch themes so I hope you can help.Apologies if each question should have been under a different topic
1. How do I change the colour of the Menu from the Red colour which also appears on selection
2. I need to put social icons ie.twitter etc in line with the menu say in the center or move menu location to the left and put the icons on the far right.February 19, 2019 at 6:33 am #166166SkandhaParticipant@carolinec: Hello there,
To change the color of menu items
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.a:focus, a:hover, #feature-slider-section .entry-title a:hover, #feature-slider-section .entry-title a:focus, .menu-toggle:hover, .menu-toggle:focus, .dropdown-toggle:hover, .dropdown-toggle:focus, .search-submit:hover, .search-submit:focus, .entry-meta a:hover, .entry-meta a:focus, .site-info a:hover, .site-info a:focus, #search-toggle, #share-toggle, .main-navigation ul :hover > a .main-navigation ul :hover > a, .main-navigation ul .focus > a, .main-navigation .current-menu-item > a, .main-navigation .current-menu-ancestor > a, .site-header-cart .cart-contents:hover, .site-header-cart .cart-contents:focus, .site-header-menu .social-navigation a:hover, .site-header-menu .social-navigation a:focus, .absolute-header .site-header-menu .social-navigation a:hover, .absolute-header .site-header-menu .social-navigation a:focus, .absolute-header .menu-toggle:hover, .absolute-header .menu-toggle:focus, .absolute-header .site-header-cart .cart-contents:hover, .absolute-header .site-header-cart .cart-contents:focus, .site-navigation .current-menu-item > a, .site-navigation .current-menu-ancestor > a, .navigation-classic.absolute-header .main-navigation ul ul :hover > a, .navigation-classic.absolute-header .main-navigation ul ul .focus > a, .post-navigation a:hover .nav-title, .post-navigation a:focus .nav-title, .section .section-title a:hover, .section .section-title a:focus, .section .entry-title a:hover, .section .entry-title a:focus, #testimonial-content-section .cycle-prev:hover, #testimonial-content-section .cycle-prev:focus, #testimonial-content-section .cycle-next:hover, #testimonial-content-section .cycle-next:focus, #events-section.has-background-image .entry-meta a:hover, #events-section.has-background-image .entry-meta a:hover, #events-section.has-background-image .entry-meta a:focus, #events-section.has-background-image .entry-meta a:focus, #events-section.has-foreground-image .entry-meta a:hover, #events-section.has-foreground-image .entry-meta a:hover, #events-section.has-foreground-image .entry-meta a:focus, #events-section.has-foreground-image .entry-meta a:focus, #events-section.has-background-image .entry-title a:hover, #events-section.has-background-image .entry-title a:hover, #events-section.has-background-image .entry-title a:focus, #events-section.has-background-image .entry-title a:focus, #events-section.has-foreground-image .entry-title a:hover, #events-section.has-foreground-image .entry-title a:hover, #events-section.has-foreground-image .entry-title a:focus, #events-section.has-foreground-image .entry-title a:focus, #portfolio-content-section .entry-title a:hover, #portfolio-content-section .entry-title a:focus, #portfolio-content-section .hentry-inner:hover .entry-title, #portfolio-content-section .hentry-inner:hover .entry-title a, .team-content-wrapper .hentry-inner:hover .entry-title a, .team-content-wrapper .hentry-inner:focus .entry-title a, .audioman-mejs-container.mejs-container button:hover, .audioman-mejs-container.mejs-container button:focus, #top-playlist-section .audioman-mejs-container.mejs-container .mejs-controls .mejs-playpause-button.mejs-button button:hover, #top-playlist-section .audioman-mejs-container.mejs-container .mejs-controls .mejs-playpause-button.mejs-button button:focus, table.shop_table_responsive tr td a:hover, table.shop_table_responsive tr td a:focus, .product-container a.added_to_cart:hover, .product-container a.added_to_cart:focus, .single-product .product_meta a:hover, .single-product .product_meta a:focus, .single-product div.product .woocommerce-product-rating .woocommerce-review-link:hover, .single-product div.product .woocommerce-product-rating .woocommerce-review-link:focus, .woocommerce-info a:hover, .woocommerce-info a:focus, .woocommerce-tabs ul.tabs li a:hover, .woocommerce-tabs ul.tabs li a:focus, .variations .reset_variations:hover, .variations .reset_variations:focus, .navigation-classic .main-navigation ul :hover > a, .navigation-classic .main-navigation ul .focus > a { color:#1ff980; }
You can change the color according to your choice.
The feature to have social menu icons adjacent to the menu items is only available in pro version of the theme. I suggest you to upgrade to pro. You can check out the additional-features available in pro version of the theme.
Let me know if this helps you out!
Kind Regards,
SkandhaFebruary 23, 2019 at 4:43 am #166501carolinecParticipantThank you for your reply but when I entered text in CSS it came back with errors. So didn’t click to update in case i messed anything up.
February 23, 2019 at 4:47 am #166502carolinecParticipantIt was underlining in red the & and ;
If you can help that would be great
February 25, 2019 at 1:38 am #166614SkandhaParticipant@carolinec: Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
a:focus, a:hover, #feature-slider-section .entry-title a:hover, #feature-slider-section .entry-title a:focus, .menu-toggle:hover, .menu-toggle:focus, .dropdown-toggle:hover, .dropdown-toggle:focus, .search-submit:hover, .search-submit:focus, .entry-meta a:hover, .entry-meta a:focus, .site-info a:hover, .site-info a:focus, #search-toggle, #share-toggle, .main-navigation ul :hover > a .main-navigation ul :hover > a, .main-navigation ul .focus > a, .main-navigation .current-menu-item > a, .main-navigation .current-menu-ancestor > a, .site-header-cart .cart-contents:hover, .site-header-cart .cart-contents:focus, .site-header-menu .social-navigation a:hover, .site-header-menu .social-navigation a:focus, .absolute-header .site-header-menu .social-navigation a:hover, .absolute-header .site-header-menu .social-navigation a:focus, .absolute-header .menu-toggle:hover, .absolute-header .menu-toggle:focus, .absolute-header .site-header-cart .cart-contents:hover, .absolute-header .site-header-cart .cart-contents:focus, .site-navigation .current-menu-item > a, .site-navigation .current-menu-ancestor > a, .navigation-classic.absolute-header .main-navigation ul ul :hover > a, .navigation-classic.absolute-header .main-navigation ul ul .focus > a, .post-navigation a:hover .nav-title, .post-navigation a:focus .nav-title, .section .section-title a:hover, .section .section-title a:focus, .section .entry-title a:hover, .section .entry-title a:focus, #testimonial-content-section .cycle-prev:hover, #testimonial-content-section .cycle-prev:focus, #testimonial-content-section .cycle-next:hover, #testimonial-content-section .cycle-next:focus, #events-section.has-background-image .entry-meta a:hover, #events-section.has-background-image .entry-meta a:hover, #events-section.has-background-image .entry-meta a:focus, #events-section.has-background-image .entry-meta a:focus, #events-section.has-foreground-image .entry-meta a:hover, #events-section.has-foreground-image .entry-meta a:hover, #events-section.has-foreground-image .entry-meta a:focus, #events-section.has-foreground-image .entry-meta a:focus, #events-section.has-background-image .entry-title a:hover, #events-section.has-background-image .entry-title a:hover, #events-section.has-background-image .entry-title a:focus, #events-section.has-background-image .entry-title a:focus, #events-section.has-foreground-image .entry-title a:hover, #events-section.has-foreground-image .entry-title a:hover, #events-section.has-foreground-image .entry-title a:focus, #events-section.has-foreground-image .entry-title a:focus, #portfolio-content-section .entry-title a:hover, #portfolio-content-section .entry-title a:focus, #portfolio-content-section .hentry-inner:hover .entry-title, #portfolio-content-section .hentry-inner:hover .entry-title a, .team-content-wrapper .hentry-inner:hover .entry-title a, .team-content-wrapper .hentry-inner:focus .entry-title a, .audioman-mejs-container.mejs-container button:hover, .audioman-mejs-container.mejs-container button:focus, #top-playlist-section .audioman-mejs-container.mejs-container .mejs-controls .mejs-playpause-button.mejs-button button:hover, #top-playlist-section .audioman-mejs-container.mejs-container .mejs-controls .mejs-playpause-button.mejs-button button:focus, table.shop_table_responsive tr td a:hover, table.shop_table_responsive tr td a:focus, .product-container a.added_to_cart:hover, .product-container a.added_to_cart:focus, .single-product .product_meta a:hover, .single-product .product_meta a:focus, .single-product div.product .woocommerce-product-rating .woocommerce-review-link:hover, .single-product div.product .woocommerce-product-rating .woocommerce-review-link:focus, .woocommerce-info a:hover, .woocommerce-info a:focus, .woocommerce-tabs ul.tabs li a:hover, .woocommerce-tabs ul.tabs li a:focus, .variations .reset_variations:hover, .variations .reset_variations:focus, .navigation-classic .main-navigation ul :hover > a, .navigation-classic .main-navigation ul .focus > a { color:#1ff980 !important; }
Let me know if this works out!
Kind Regards,
Skandha -
AuthorPosts
- The topic ‘Audioman Menu colour Menu Position and adding icons’ is closed to new replies.