Changing link color

Discussion in 'Squirrel WordPress Theme' started by adamsmark, Mar 12, 2013.

  1. adamsmark

    adamsmark New Member

    Joined:
    Mar 10, 2013
    Messages:
    9
    Likes Received:
    0
    I'm going through the CSS file, looking to change the link color for links in pages and posts only. How might I do this? Should I add something to the custom CSS or modify the CSS file directly? What code should I use?
     
  2. Gourav

    Gourav Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    7,728
    Likes Received:
    207
    Please explain your problem with the help of screenshot, where you want to change the color and also share the link of your website, so that we can give you the exact solution.
     
  3. adamsmark

    adamsmark New Member

    Joined:
    Mar 10, 2013
    Messages:
    9
    Likes Received:
    0
    I'm talking about links within pages and posts. See http://2-xl.net/?page_id=17. All I want to do is change the color of links within text, but only inside the test of posts and pages. Right now, they blend in too much with the text.
     
  4. Gourav

    Gourav Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    7,728
    Likes Received:
    207
    Paste this code in Custom CSS
    Appearance > Theme Option > Styling Option > Custom CSS

    Code:
    .page-content .content-bar a {
    color: blue;
    }
     
  5. adamsmark

    adamsmark New Member

    Joined:
    Mar 10, 2013
    Messages:
    9
    Likes Received:
    0
    I know a little about HTML and CSS. I can put "red" or "blue" in that snip of code, but not color hexes, e.g. 000099. Why is this? Also, what if one wanted to change the "hover" color? Where in the existing code are these styles?
     
  6. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
    You can also put color code inplace "blue". for example
    Code:
    .page-content .content-bar a {
    color: #C95757;
    }
    Please specify your issue little more that on which text you want to change the "hover" color.
     
  7. adamsmark

    adamsmark New Member

    Joined:
    Mar 10, 2013
    Messages:
    9
    Likes Received:
    0
    The same link. If I use this code to change a link's color

    .page-content .content-bar a {
    color: #C95757;
    }


    What code do I use to change its behavior when I hover over it?
     
  8. Gourav

    Gourav Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    7,728
    Likes Received:
    207
    Paste this code in Custom CSS
    Appearance > Theme Option > Styling Option > Custom CSS

    Code:
    .page-content .content-bar a: hover {
    color: #C95757;
    }
    
     
  9. hghplus

    hghplus Member

    Joined:
    Jan 24, 2013
    Messages:
    30
    Likes Received:
    0
    How do I go about changing the color of the links that I add to the widget area. They default to grey.

    Also some of the body's text is grey and some is black. I try to change and it does not.

    Thank you.
     
  10. hghplus

    hghplus Member

    Joined:
    Jan 24, 2013
    Messages:
    30
    Likes Received:
    0
    How do I go about changing the color of the links that I add to the widget area. They default to grey.

    Also some of the body's text is grey and some is black. I try to change and it does not.

    Thank you.
     
  11. Gourav

    Gourav Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    7,728
    Likes Received:
    207

    Do let us know your website link.
     
  12. hghplus

    hghplus Member

    Joined:
    Jan 24, 2013
    Messages:
    30
    Likes Received:
    0
    The URL is docwellnessformula.com

    Also if I may ask, how do I change the footer color from dark grey to blue. Thank you kindly.
     
  13. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
    1. For your first issue, paste the following code in your custom css
    (Appearance -> Theme Options -> Styling Options -> Custom CSS)
    Code:
    .wrap_sidebar p.more a {
    color: red;
    }
    2. For your second issue, paste the following code in your custom css
    Code:
    .content p {
    color: green;
    }
    .content em {
    color: green;
    }
    .content strong {
    color: green;
    }
    .content ul li {
    color: green;
    }
    .content_wrapper .content p span {
    color: green ! important;
    }
    .content_wrapper .content span {
    color: green ! important;
    }
    In place of green and red you can put you color or color code.
    This will solve your issue.
     
  14. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
    Go to the Styling Options Panel(Appearance -> Theme Options -> Styling Options) in your dashboard and choose your color from the Theme Color Options section.
    This will solve your issue.
     
  15. hghplus

    hghplus Member

    Joined:
    Jan 24, 2013
    Messages:
    30
    Likes Received:
    0
    Thank you kindly. I appreciate.

    One more question. How do I go about changing the link color of the BODY links?
     
  16. Krish

    Krish Support Staff

    Joined:
    Oct 22, 2012
    Messages:
    210
    Likes Received:
    1
    Location:
    India
    Just put bellow example code in styling options
    Code:
    a{
    color:your color;
    }
     
  17. hghplus

    hghplus Member

    Joined:
    Jan 24, 2013
    Messages:
    30
    Likes Received:
    0
    Did not work
     
  18. Piyush

    Piyush Support Staff

    Joined:
    Dec 8, 2012
    Messages:
    4,745
    Likes Received:
    107
    Please specify your issue with the help of screenshot images that where you want to change the color.
     
  19. hghplus

    hghplus Member

    Joined:
    Jan 24, 2013
    Messages:
    30
    Likes Received:
    0
    When I add a link to my page(s) (in the body section), it defaults to grey and despite my changing it, stays the same color.

    The URL is http://docwellnessformula.com/

    Thank you.
     
  20. Gourav

    Gourav Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    7,728
    Likes Received:
    207
    Paste this code in Custom CSS
    Appearance > Theme Option > Styling Option > Custom CSS


    Code:
    .content_wrapper .content a span {
    color: red!important;
    }
    Inplace of "red" put your color code.
     

Share This Page