• Resolved Anna

    (@brasandbodyimage)


    My site: https://brasandbodyimage.com/ (bra pics, potentially NSFW depending on workplace).

    Hi all. I’d like to change some of the link colours in Able if possible, but I haven’t been able to find the best way to do it. So far I’ve messed around a bit and used a child CSS sheet to change the navigation bar at the top to be black when not selected (from light grey), and the text to be grey (from black), which also changed the older posts link colour to be grey.

    Pretty much all of the other hyperlinks are navy blue, and the post titles are navy blue on hovering. I would like to change all of the navy blue links to a dark pink (something like #df144d). What would be the best way of doing this? Thanks in advance.

    In case the added CSS changes are important:

    Changing navigation bar text/page navigation links grey:

    .site-navigation a {
    	color: rgb(110,110,110);
    	color: rgba(110,110,110,1);
    }

    Changing navigation bar background black:

    .main-navigation, .menu-toggle {
    	background-color: rgb(0,0,0);
    	background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,0)));
    	background-image: -webkit-linear-gradient(rgba(240,240,240,0.8),rgba(210,210,210,0.8));
    	background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0));
    }
Viewing 15 replies - 1 through 15 (of 15 total)
  • Hi Lets get to work!:-). Before we begin do not make edits to the CSS code itself. Please download a css editor. Then we can begin.

    @aaron “The Monkey” Leal: I’m sorry to ask but are you offering any kind of solution?

    Yes I am esmi. Please look at what i said.

    Please do not post unless you are posting a solution or suggestion. There is absolutely no need to post any kind of “place holder” first.

    Thread Starter Anna

    (@brasandbodyimage)

    Hi Aaron, I can download the CSS editor, just checking if it’s necessary? I seem to already be able to add stylesheets, which add customisations but are separate from the original code, and take precedence over the theme CSS.

    Hi Anna,
    After you download a css editor this is what you will need to post and it should change the color from the original to the new color.

    .menu-item-1141 a:link, { color: #df144d!important; }
    .menu-item-1141 a:visited { color: #df144d!important; }
    .menu-item-1141 a:hover { color: #df144d!important; }

    Yes when you download a CSS editor it will overwrite the themes code. Which will not edit the original theme itself. Say if there was an update to the theme, from Version one to version two. The code edited in V1 will be overwritten by V2. With a custom CSS you will have no Worries :-).

    Thread Starter Anna

    (@brasandbodyimage)

    Hi Aaron, I’ve installed the CSS editor and added that code. Unfortunately it doesn’t seem to have worked. The only thing I can see which has changed is the “Home” link in the navigation bar, instead of the rest of the links in the posts/sidebars etc.

    Okay so I just want to clarify you want all of the navigation bar to be dark pink?

    Thread Starter Anna

    (@brasandbodyimage)

    Nope, the navigation bar was how I wanted it (or close enough, at least). I want the rest of the hyperlinks (which are currently navy blue) to be dark pink, without changing the navigation bar – e.g. the post titles on hover, the hyperlinks in the sidebar, hyperlinks within posts themselves, post dates, tags, categories etc.

    Thread Starter Anna

    (@brasandbodyimage)

    Okay, I just tried adding a simple link change thing to the start, with my previous changes below, so I now have this:

    /* Testing link color changes */
    
    a:link { color: #df144d; }
    a:visited { color: #df144d; }
    a:hover { color: #df144d; }
    
    /* Changes navigation bar text/page navigation links grey */
    
    .site-navigation a {
    	color: rgb(110,110,110);
    	color: rgba(110,110,110,1);
    }
    
    /* Changes navigation bar background black */
    
    .main-navigation, .menu-toggle {
    	background-color: rgb(0,0,0);
    	background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,0)));
    	background-image: -webkit-linear-gradient(rgba(240,240,240,0.8),rgba(210,210,210,0.8));
    	background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0));
    }

    This leaves my menu bar the same, and changes I think all of the hyperlinks. However, it does make post titles pink all the time, rather than black usually then pink on hover. It’s closer but still not perfect. Any way to change that one thing? Is what I’ve done so far awful code?

    Thread Starter Anna

    (@brasandbodyimage)

    All sorted. Added this to make post titles black, then pink on hover:

    .entry-title, .entry-title a {
    color: black;
    }
    
    .entry-title a:hover, .entry-title a:focus, .entry-title a:active {
    color: #df144d;;

    Thanks for the help.

    Your Welcome:-).

    If you need anymore help dont hesitate to ask.

    Thanks, Aaron. .

    Hello,

    have 2012 theme showing in text links (in this link to amazon) showing grey and not blue.
    Alraedy installed simple css plugin and copied some code from another forum post but that only changed the sidebar links.
    can anybody tell me what I have to add to this code:
    a:link { color: #21759b; }
    a:visited { color: orange; }
    a:hover { color: red; }
    a:active { color: red; }

    .widget-area .widget a { color: #21759b; }
    .widget-area .widget a:hover { color: red ; }

    a.comment-reply-link, a.comment-edit-link { color: #21759b ; }
    a.comment-reply-link:hover, a.comment-edit-link:hover { color: red; }

    .comments-link a, .entry-meta a { color: #21759b ; }
    .comments-link a:hover, .entry-meta a:hover { color: red; }

    .comments-area article header a { color: #21759b; }
    .comments-area article header a:hover { color: red; }

    .comments-area article header cite a { color: #21759b; }
    .comments-area article header cite a:hover { color: red; }

    thx
    Ted

    tedsikkink – this forum is for help with the Able theme. To get help with Twenty Twelve it’s best if you start a new post in the Twenty Twelve forum and provide a link to your site when you do:

    https://www.ads-software.com/support/theme/twentytwelve#postform

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Changing link colour(s)’ is closed to new replies.