[carolinec]

Hi
I am new to wordpress and catch themes so I hope you can help.

http://caclearning.site/

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.

[Skandha]

@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,
Skandha

[carolinec]

Thank 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.

[carolinec]

It was underlining in red the & and ;

If you can help that would be great

[Skandha]

@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

[Author]

Posts