Forums

Change color of default theme (24 posts)

  1. Bayas
    Member
    Posted 6 years ago #

    How do i change the text color of the default theme? I need everything that is blue to be a bit more dark blue, but I'm unsure of where to change it.

    Anyone?

  2. vkaryl
    Member
    Posted 6 years ago #

    The default theme is very wonkily put together. It's all done with graphics. Check the images folder....

    You might be better advised to hit http://themes.wordpress.net and grab something that comes closer to what you want without you having to edit every dumb graphic in the theme....

  3. Bayas
    Member
    Posted 6 years ago #

    The image folders? Are you sure, because the only thing I want to change is the color of the text. I thought i might be easy to change this.

    If anybody know the code for text color used in wordpress, I can just search thru the documents..

  4. gnorb
    Member
    Posted 6 years ago #

    I'll be able to help if you answer this question: When you say "blue" which text exactly do you need to change color? Are you talking about the header, the titles of posts, the color of those titles when you hover over them, the links on the side of the page... which one(s)?

    Your answer can probably be found by looking at 2 files: first, in the theme editor, take a look at what's in the Page Template file (or the sidebar file) and figure out what tag/attribute combo is being tapped for that text. After that, look at the Stylesheet and find the tag or attribute there (I presume you can read CSS, even if you don't "know" it.) You can track you answer that way.

    (And no, not everything in that theme is done in images, just the bg colors and the curved edges. Otherwise everything is CSS.)

  5. vkaryl
    Member
    Posted 6 years ago #

    Sorry for misreading.... was way tired!

  6. chillbilly
    Member
    Posted 6 years ago #

    HA!

    I started playin with the CSS for my defualt theme and was finding colors in it that are not even in the blog!!!

    Still don't realy understand it. Its like as if this CSS has nothin ta do with the theme I'm usein!!!

    I modded the CSS like crazy...loadin it up and nothin happend...not even anything bad!!!

    man...nuts eh..oh well...I put my back up in and I'll move onto another file for the changes ;)

  7. Bayas
    Member
    Posted 6 years ago #

    I'm talking about the titles of posts (blue at mouse over), name of categories (for every post), and the whole sidebar which has blue text.

    I only want another blue color, which is darker som match a logo I'm putting together. Unfortunately, I can not match the logo to the theme, it has to be the other way around.

    When it comes to CSS, I'm not experienced at all..

  8. chillbilly
    Member
    Posted 6 years ago #

    I'm lookin ta do pretty much the same thing Bayas and I have touched every aspect of the CSS file with no results at all..none...not even bad ones.

    So modifying the text color, link color and hover color has got ta be in another file.

    I'm lookin right now and can't find it so I am back in here searchin..If I find somethin...I'll letcha know...Hopefully someone will step up with a solution ;)

  9. chillbilly
    Member
    Posted 6 years ago #

    Its funny lookin through this script! The dude that designed it has a sence of humour :)

    Found all kindsa little messeges in the files...this ones at the bottem of the CSS that doesn't seem to even be used for the theme....

    /* "Daisy, Daisy, give me your answer do. I'm half crazy all for the love of you.
    It won't be a stylish marriage, I can't afford a carriage.
    But you'll look sweet upon the seat of a bicycle built for two." */

    HAHA!!!

  10. chillbilly
    Member
    Posted 6 years ago #

    WOW! sorry bout the multiple posting here dude but I followed the link in my WP for the kubrick theme...found a support forum for who ever is gona stick with the default theme...

    http://getk2.com/forum/forumdisplay.php?s=276350d3ed3a6077ee9273567e0f40f8&f=8

  11. gnorb
    Member
    Posted 6 years ago #

    Bayas: Ah, the hover text. Look for the following lines, each of which controls one aspect of the font

    This one controls text decorations

    h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
    text-decoration: none;
    }

    This one controls the color

    a, h2 a:hover, h3 a:hover {
    color: #06c;
    text-decoration: none;
    }

    As for the headers, the "h2 a:hover" part is what you're looking for in both of these. Presuming you only want to change the color, don't touch the first one. In the second one delete the "h2 a:hover" and add a class below it like this:


    h2 a:hover{
    color: #000000; /*Replace 000000 with whatever color you want*/
    text-decoration: none; /*replace "none" with whatever decoration you want, like an underline. */
    }

    (Feel free to copy and paste this. It'll work)

    As for the sidebar, that's a little more difficult. The reason your sidebar is blue is because those are all links. (The headers aren't blue, are they?) All links are controlled via the link classes:

    This one controls the colors & decorations for regular text links (a), when you hover over header 2 links (ie, your article titles) (h2 a:hover), and when you hover over header 3 links (h3 a:hover)

    a, h2 a:hover, h3 a:hover {
    color: #06c;
    text-decoration: none;
    }

    This one controls what happens to all regular text links links -- in the sidebar and in the main page -- when you hover over them

    a:hover {
    color: #147;
    text-decoration: underline;
    }

    You'll need to do a number of things to get just the text in the sidebar to change colors. Let me ask you, are you looking to change all the links's colors (within the regular text) or just those within the sidebar? (let me know and I'll continue.)

    *NOTE: BEFORE YOU DO ANYTHING BACK UP THIS FILE, JUST IN CASE.

    Edit: Fixed for readability. Man, talk about a lot of typos. Also, ignore any <br\>'s.

  12. Bayas
    Member
    Posted 6 years ago #

    Perhaps it will be easier for you, just to take a look at the current site.

    http://www.haraldsbuss.net/blog

    I noticed right now that all the blue text has mouse over (hover). All the links in the sidebar should be darker.. I only care about the text that is blue, the black headers can stay.

  13. chillbilly
    Member
    Posted 6 years ago #

    I don't know man...tryed it again and i get no change at all.

    Maybe im uploading my back-up copy over and over :)

    I think Bayas and I are lookin for the same thing here ...just the the ability to exchange the light blue link color with the dark blue hover to the oposite.

    I also on top of that need to change the footer text color to white from black...can't see the text right now :)

    http://www.chillbillyproductions.com

    I can't beleive its taking me this long to change some colors!!!

    Oh well...everything else is far easier to work with than some stuff I've seen.

  14. gnorb
    Member
    Posted 6 years ago #

    This is going to be a toughie. Gimme a few (hours) and I'll write up a quick how-to. I figure this'll help anyone else who's facing the same problem. (Been there, done that, printed the code unto a t-shirt.)

    The biggest issue with Kubrick that we're facing is also it's biggest strength: it is a VERY structured theme. It's one of the reasons I like working with it. It's also why it's hard to explain, unless you know some CSS. (Which is why I asked before.)

    Again, gimme a few hours 'til, you know, I get out of work. I'll write up a mini-how to on this for you guys. (Besides, it's always fun to spruce up my tech writing skillz, 'cause, you know, I'm like a tech writer 'n stuff. No, seriously, I am. Paid and everything most of the time.)

  15. chillbilly
    Member
    Posted 6 years ago #

    Sweet dude...Id do the same for you man.

    Ive worked with CSS files before, but my no meens am I a pro...thought I was doin fine till I met this one!!! :)

    Thanks again

  16. gnorb
    Member
    Posted 6 years ago #

    Chillbilly: about halfway down in the stylesheet.css file look for this code:


    #footer p {
    margin: 0;
    padding: 20px 0;
    text-align: center;
    }

    Add the line "color: #fff;" (no appostrophes (sp?)). Click Save. Should look like this


    #footer p {
    margin: 0;
    padding: 20px 0;
    text-align: center;
    color: #fff;
    }

    That should do it.

  17. chillbilly
    Member
    Posted 6 years ago #

    K...you rock!

    Looks good too ;)

    Now I just gota change the link colors for the side bar and also the font color for the discriptions in the side bar for the link section and catagoies section. Right now they are the same color as the BG..cant see them :(

    :) Thanks to you Ill have time ta weed eat my yard and go to tim hortons for an XL black coffee (dubble cupped ;)

  18. chillbilly
    Member
    Posted 6 years ago #

    Bayas...starting on line 179 in the css file....

    a, h2 a:hover, h3 a:hover {
    color: #013a57;
    text-decoration: none;
    }

    a:hover {
    color: #6699cc;
    text-decoration: underline;

    both of those color codes are ones I put in... makes the links in the side bar be dark blue then hovered they are light blue.

    check it out...

    http://www.chillbillyproductions.com

  19. chillbilly
    Member
    Posted 6 years ago #

    crap...looks like I'm gona have ta fix it...looks great all over sept for the footer...links are the same color as the BG in the footer now...BAH!

    I like my footer color...can I seperate the links in the footer from the ones everpalce else?

  20. vkaryl
    Member
    Posted 6 years ago #

    Yes. Add into your css the following:
    #footer a:link {#yourcolor;}
    #footer a:visited {#yourcolor;}
    #footer a:hover {#yourcolor;}
    #footer a:active {#yourcolor;}

  21. chillbilly
    Member
    Posted 6 years ago #

    :) I'm a very happy guy...thanks a huge bunch..I almost didn't even have ta think today!!!!

    the footer stuff ya gave me had ta be changed a smidge ta work though........

    #footer a:link {
    color: #mycolor;
    }
    #footer a:visited {
    color: #mycolor;
    }
    #footer a:hover {
    color: #myothercolor;
    }
    #footer a:active {
    color: #and this one too;
    }

    Now Im gona take a bit of a brake then get me my flash logo done up...im usein the kubrick header jpg that i've modified as the back ground for the flash logo...the text in the movie will be white still but cooler and doin stuff ;)

    thanks again guys

  22. vkaryl
    Member
    Posted 6 years ago #

    Yeah, sorry, I got in a hurry to post and mutzed it up. BAD GIRL!!! Mea culpa....

  23. gnorb
    Member
    Posted 6 years ago #

    Taking a hint from vkaryl, who made this dirt easy (though I tried to complicate it by, you know, being too detailed 'n stuff), Bayas, add the following to the style.css stylesheet file:


    #sidebar a:link {#your first color;}
    #sidebar a:visited {#your second color;}
    #sidebar a:hover {#your third color;}
    #sidebar a:active {#your fourth color;}

    where "your [X] color" is the hex code for the color you want (ie. #ffffff for white, #4282bd for the dark blue on your banner, etc).

    By the way, you *can* change your banner color. Find the following text in the Header.php file:


    /* To ease the insertion of a personal header image, I have done it in such a way, that you simply drop in an image called 'personalheader.jpg' into your /images/ directory. Dimensions should be at least 760px x 200px. Anything above that will get cropped off of the image. */

    /*
    #headerimg { background: url('<?php bloginfo('stylesheet_directory'); ?>/images/personalheader.jpg') no-repeat top;}
    */

    as I said in the beginning, every thing that's not text (ie, everything that's not text is images. Everything that IS text is CSS. The images youwant to mess with are:

    kubrickbgcolor.jpg - this is the background gray you see. It's a repeating gray pane.

    kubrickbg.jpg - This is the background for the white section in the front page. This includes that gray box that makes up the backgroun of your sidebar.

    kubrickbgwide.jpg - This is the background for the white section in pages of posts. This does not include the sidebar gray background.

    kubrickheader.jpg - This is the header image, where the blue you're trying to fashion your links out of is located.

    kubrickfooter.jpg - this is the gray bar at the bottom of the screen where the footer text is. Actually it's more than just the gray bar, it's a little white, too, but I won't tell if you won't.

    Hope all this helps.

  24. Bayas
    Member
    Posted 6 years ago #

    Thanks! I will try this out next week or so:) I'll be back if I dont get it to work;)

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.