Change Color of Links

Community Forums Forums Design Tips and Tricks Change Color of Links

This topic is: not resolved

This topic contains 6 replies, has 4 voices, and was last updated by  AC 2 years ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #4280

    sbelton
    Participant

    I need to know how to change the blue color in the Enterprise theme to pink (like in the logo at http://www.jaimichaelsgroup.com). I am new to all this. Thank you in advance.

    #4314

    AC
    Blocked
    Post count: 7712

    Read this – Brian Gardners how to Create Color Style Options – http://www.briangardner.com/code/create-color-style-options/

    #4316

    Susan
    Moderator
    Post count: 9598

    If you are just looking to change the color of links, you could replace the #oo8dcf with the color of your choice:
    /* Hyperlinks
    ———————————————————— */

    a,
    a:visited {
    color: #008dcf;
    text-decoration: none;
    }

    a:hover {
    text-decoration: underline;
    }

    a img {
    border: none;
    }


    Susan @ Graphically Designing I offer theme customizations I tweet!
    I’ve taken up the challenge! – help me answer some of the unanswered posts

    #4317

    AC
    Blocked
    Post count: 7712

    Good share Susan!

    #4418

    sbelton
    Participant

    Thanks!! Both were helpful!! I still need to figure out how to change that Blue box on the Enterprise theme to Deep Pink #FF1493.

    Thanks in advance!!

    #4439

    CharlieL
    Participant
    Post count: 24

    Always when you have to change colors, fonts and such in any webpage then the Firebug plugin for Firefox is indispensable. There you can study the hierarchy of the div:s (layers) in css and you will easily find where to change different properties.

    In your case when you want to change the blue color in the box you will find that it is located here in the stylesheet:

    .home-top-1 {
    background: url("images/home-top-left.png") repeat-y scroll left center #1EA7E8;
    float: left;
    height: 235px;
    width: 330px;
    }

    In the code you will find that it is not a plain color, but an image (or a repeated stripe) that is used as a background-color. This will make it rather easy to change the background. You have only to find the image home-top-left.png and edit it to you wish. Save the image and send it back to your server, to the images folder in your themes folder. If you keep the name of the file intact you must only change the last color-code (#1EA7E8) in the css-code to something suitable to you new image. It is that easy!

    The CSS color-codes you will find here: http://www.w3schools.com/cssref/css_colors.asp
     

    #4444

    AC
    Blocked
    Post count: 7712

    To add to both of these great responses – you don’t necessarily need to re-color the image. If you are a newbie, you can easily remove the URL information and change the #1EA7E8 to the color you want. You aren’t forced to use an image in the box it just looks nice because the image has a gradient color to it.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.