Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #168827
    catwingz
    Participant

    Hi,

    I am trying to change the color of the links on rollover and ‘you are here to a brick color. This is what I have tried:

    a:hover, a:focus, a:active, .menu-toggle:hover, .menu-toggle:focus, .menu-toggle.toggled-on, .menu-toggle.toggled-on:hover, .menu-toggle.toggled-on:focus, .header-top-menu-enabled #header-navigation-area .menu-toggle:hover, .header-top-menu-enabled #header-navigation-area .menu-toggle:focus, .header-top-menu-enabled #header-navigation-area .dropdown-toggle:hover, .header-top-menu-enabled #header-navigation-area .dropdown-toggle:focus, #search-toggle-top:hover, #search-toggle-right:hover, #search-toggle:hover, #search-toggle-top:focus, #search-toggle-right:focus, #search-toggle:focus, .search-submit:hover, .search-submit:focus, .dropdown-toggle:hover, .dropdown-toggle:focus, .required, .entry-title a:hover, .entry-title a:focus, .entry-meta a:hover, .entry-meta a:focus, .entry-meta .icon:hover, .entry-meta .icon:focus, .entry-header .cat-links a, .site-info a:hover, .site-info a:focus, .comment-metadata a:hover, .comment-metadata a:focus, .pingback .comment-edit-link:hover, .pingback .comment-edit-link:focus, #feature-slider-section .entry-title a:hover, #feature-slider-section .entry-title a:focus, #feature-slider-section .entry-meta a:hover, #feature-slider-section .entry-meta a:focus, #feature-slider-section .entry-meta .icon:hover, #feature-slider-section .entry-meta .icon:focus, #feature-slider-section .cycle-prev:hover, #feature-slider-section .cycle-prev:focus, #feature-slider-section .cycle-next:hover, #feature-slider-section .cycle-next: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, #testimonial-content-section .cycle-pager span.cycle-pager-active,  .site-footer-menu .social-navigation a:hover, .site-footer-menu .social-navigation a:focus, .site .skip-link, .entry-breadcrumbs a:hover, .entry-breadcrumbs a:focus, .woocommerce .woocommerce-breadcrumb a:hover, .woocommerce .woocommerce-breadcrumb a:focus, .comment-metadata .comment-reply-link:hover, .comment-metadata .comment-reply-link:focus, #testimonial-content-section .section-content-wrapper .entry-content::before, .header-top-menu-enabled #header-navigation-area .site-navigation a:hover, .header-top-menu-enabled #header-navigation-area .site-navigation a:focus, site-title a: #a66a34 !important;
    }
    

    Unfortunately the links are still blue. What am I missing?

    Thank you

    #168841
    Skandha
    Keymaster

    @catwingz: Hello there,
    Please post in the URL where the You are here text in located so that I can help you out.

    Kind Regards,
    Skandha

    #168892
    catwingz
    Participant

    This site is in development and can’t be viewed without a login. I thought it would be simplest to target all of the instances of the blue link color in the theme CSS. Unfortunately !important isn’t having an effect.

    #168904
    Skandha
    Keymaster

    @catwingz: Hello there,
    You can change the Link Hover color from the customizer itself in the pro version of the theme. Also there are lots of additional-features available in the pro version. You can check out the additional features and decide if you want to upgrade to pro.

    Alternatively to change link hover color using CSS
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    a:hover, a:focus, a:active, .menu-toggle:hover, .menu-toggle:focus, .menu-toggle.toggled-on, .menu-toggle.toggled-on:hover, .menu-toggle.toggled-on:focus, .header-top-menu-enabled #header-navigation-area .menu-toggle:hover, .header-top-menu-enabled #header-navigation-area .menu-toggle:focus, .header-top-menu-enabled #header-navigation-area .dropdown-toggle:hover, .header-top-menu-enabled #header-navigation-area .dropdown-toggle:focus, #search-toggle-top:hover, #search-toggle-right:hover, #search-toggle:hover, #search-toggle-top:focus, #search-toggle-right:focus, #search-toggle:focus, .search-submit:hover, .search-submit:focus, .dropdown-toggle:hover, .dropdown-toggle:focus, .required, .entry-title a:hover, .entry-title a:focus, .entry-meta a:hover, .entry-meta a:focus, .entry-meta .icon:hover, .entry-meta .icon:focus, .entry-header .cat-links a, .site-info a:hover, .site-info a:focus, .comment-metadata a:hover, .comment-metadata a:focus, .pingback .comment-edit-link:hover, .pingback .comment-edit-link:focus, #feature-slider-section .entry-title a:hover, #feature-slider-section .entry-title a:focus, #feature-slider-section .entry-meta a:hover, #feature-slider-section .entry-meta a:focus, #feature-slider-section .entry-meta .icon:hover, #feature-slider-section .entry-meta .icon:focus, #feature-slider-section .cycle-prev:hover, #feature-slider-section .cycle-prev:focus, #feature-slider-section .cycle-next:hover, #feature-slider-section .cycle-next: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, #testimonial-content-section .cycle-pager span.cycle-pager-active, #clients-section .cycle-prev:hover, #clients-section .cycle-prev:focus, #clients-section .cycle-next:hover, #clients-section .cycle-next:focus, #clients-section .cycle-pager span.cycle-pager-active, #clients-section.has-background-image .cycle-prev:hover, #clients-section.has-background-image .cycle-prev:focus, #clients-section.has-background-image .cycle-next:hover, #clients-section.has-background-image .cycle-next:focus, #clients-section.has-background-image .cycle-pager span.cycle-pager-active, .site-footer-menu .social-navigation a:hover, .site-footer-menu .social-navigation a:focus, .site .skip-link, .woocommerce div.product p.price:hover, .woocommerce div.product p.price:focus, .woocommerce ul.products li.product .price:hover, .woocommerce ul.products li.product .price:focus, .entry-breadcrumbs a:hover, .entry-breadcrumbs a:focus, .woocommerce .woocommerce-breadcrumb a:hover, .woocommerce .woocommerce-breadcrumb a:focus, .comment-metadata .comment-reply-link:hover, .comment-metadata .comment-reply-link:focus, #team-content-section .artist-social-profile > .social-navigation a:hover, #team-content-section .artist-social-profile > .social-navigation a:focus, #testimonial-content-section .section-content-wrapper .entry-content::before, .header-top-menu-enabled #header-navigation-area .site-navigation a:hover, .header-top-menu-enabled #header-navigation-area .site-navigation a:focus, .header-top-menu-enabled #header-navigation-area .site-navigation ul ul :hover > a, .header-top-menu-enabled #header-navigation-area .site-navigation ul ul .focus > a {
    	color:#a66a34 !important;
    }

    Let me know if this works out!
    Kind Regards,
    Skandha

    #169305
    catwingz
    Participant

    It took me awhile to get to this, but it worked. Thank you

    #169385
    Skandha
    Keymaster

    @catwingz: Glad I could help you out. Have a good day! 🙂

    Kind Regards,
    Skandha

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Link color’ is closed to new replies.