Need help? Check out our Support site, then


WordPress.com Forums » CSS Customization

Structure Theme - Changing Colors of Search Button, Comment Box, Bottom Footer

  1. heyheygoodlooking
    Member

    Hello!

    I have a blog that I am customizing with the CSS upgrade in the Structure theme. Although I am still learning CSS, I was able to make some adjustments on my own. However, a few things are still plaguing me. When I changed my color scheme with new color change options in Custom Design, some parts of the site didn't change accordingly. Specifically, I would like to be able to change:

    -the "Search" button colors
    -the color of the comment box
    -the background color of the comment once posted
    -the bottom footer that displays the theme name, etc
    -the random black lines next to my widgets ("Archives" and "The Author")

    The blog site is http://heyheygoodlooking.wordpress.com/. Sorry for all the problem...any insight you can lend on the topic would be greatly appreciated!

    Thanks so much!
    Nicci

    The blog I need help with is heyheygoodlooking.wordpress.com.

  2. thesacredpath
    Staff

    Search button:

    #searchsubmit {
background: #151515;
color: #666666;
}

    Posted comment background

    .thread-even {
background: none repeat scroll 0 0 #151515;
}

    Comment box/input fields. Start with these and then we can go from there if I missed anything. The rgba color declarations can be changed to either color names or hex color codes if you wish.

    .highlander-dark #respond #comment-form-comment, .highlander-dark #comment-form-share-text-padder {
background: rgba(0, 0, 0, 0.7);
border: 1px solid rgba(255, 255, 255, 0.13);
box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.55) inset;
}

.highlander-dark #respond #comment-form-identity #comment-form-nascar {
background: rgba(255, 255, 255, 0.15);
}

.highlander-dark #respond .comment-form-service {
background: rgba(255, 255, 255, 0.15);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.45);
}

.highlander-dark #respond .comment-form-fields div.comment-form-input {
background: rgba(0, 0, 0, 0.3) !important;
border: 1px solid rgba(255, 255, 255, 0.2);
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.55) inset;
color: rgba(255, 255, 255, 0.8);
}

  3. heyheygoodlooking
    Member

    That was all wonderful - thanks! One more question...on my extra pages (i.e. "Ask" and "About," etc), what is the code for changing the headers on that page (i.e. "Ask" and "About") to a bigger font size? I've looked through all the original CSS code and I can't for the life of me find anything about pages or subheads...

  4. thesacredpath
    Staff

    Give this a try and adjust the 120% value as desired. This will change only the static page titles such as about, ask, contact, etc.

    .page .posttitle h3 {
font-size: 120% !important;
}

  5. heyheygoodlooking
    Member

    Thank you so much! You're such a wonderful help - I found answers to some of my other problems on closed forums where you had supplied the solution there as well :) Just out of curiosity, do you know of any books or online sources that are a crash course in CSS? I thought I could bumble my way through all of this, but your last solution wasn't anywhere in my original style sheet, so I'm not sure how to teach this to myself...

  6. thesacredpath
    Staff

    You are welcome and thanks.

    Look at the top of the CSS forum and there are some resources in the sticky posts (yellow background) there. There are also some resources in the CSS editing support page.

  7. gabrieliphotography
    Member

    Hello there! I was wondering if anyone can help me please to change the background color of my comment box ? as you can see on the following link :

    http://gabrieliphotography.com/2012/08/14/highest-deck/

    my comment box color is white as well as the text inside, or some sort of grey or not sure about it, therefor is almost impossible to see the text :( I would like to make the box color same as page color - #899aa1

    thank you so much in advance !

  8. timethief
    Member

    All CSS editing is theme specific. This thread is about the Structure theme. You posted a link to a blog wearing the Triton Lite theme. Please use this link to post your own thread > http://en.forums.wordpress.com/forum/css-customization#postform

  9. gabrieliphotography
    Member

    Ohhh, my mistake I didn't notice is on a specific theme :s But thank you so much for your help and advice, took it and already opened a new thread ;)

    http://en.forums.wordpress.com/topic/triton-lite-theme-changing-the-background-color-of-my-comment-box?replies=1#post-981256

    really appreciated, thanks !

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags