WordPress.org

Ready to get started?Download WordPress

Forums

Changing background color into black on the WP events calendar (10 posts)

  1. niotisn
    Member
    Posted 1 year ago #

    Hello, I have searched through the forum and since i am new to wp i do not seem to quite understand what to do.

    I have started a wp site http://boardgamenewsonline.com and as you will see i am using a black colored themed. I want to add an event calendar and as you can also see it is white. so i want to turn the background color into black.

    I know i have to change the cms but i am not sure which part of the cms to alter exactly?

    If it helps i can copy the cms here

    Thanks a lot!

  2. Phil
    Member
    Posted 1 year ago #

    Here's what I would do:

    Amend this line to your style.css (on line 484):

    #wp-calendar td {
    background-color: #chooseyourcolor !important;
    }

    (Obviously change #chooseyourcolour to whatever hex colour you want, eg #121212)

    As long as the !important part is there it will overwrite the default colour that comes with the plugin, so even if you update the plugin, it should still keep your new custom colour. You can always add it to other things like border, color, padding etc and future updates won't undo your changes.

  3. niotisn
    Member
    Posted 1 year ago #

    I suppose you say i go to my theme editor, in wp and then update

    #wp-calendar td {
    color: #b8c0c7
    font: normal 12px 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
    letter-spacing: normal;
    padding: 2px 0;
    text-align: center;
    }

    by adding important after the color?

    Coz this didn't work :S

  4. Phil
    Member
    Posted 1 year ago #

    You have an error:

    color: #b8c0c7

    should be changed to

    color: #b8c0c7;

    You were missing a semi-colon. By missing it, it's ignoring everything else in that block.

    Try this:

    #wp-calendar td {
    color: #b8c0c7;
    font: normal 12px 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
    letter-spacing: normal;
    padding: 2px 0;
    text-align: center;
    background-color: #000 !important;
    }
  5. niotisn
    Member
    Posted 1 year ago #

    Aha! that is awsome!

    Thanks a lot Phil! I also changed the #wp-calendar th { color there, so it changed my days background color.

    Need to figure out which would change the month and i am done! The 477. #wp-calendar caption { did not work for that one

    Sooo close!

  6. Phil
    Member
    Posted 1 year ago #

    It is that one (line 477):

    #wp-calendar caption {
    background: #050505 !important;
    color: #B8C0C7;
    margin: 2px 0;
    padding: 2px 4px;
    text-transform: uppercase;
    }

    This works for me.

  7. niotisn
    Member
    Posted 1 year ago #

    Thanks Phil!

    Solved all my questions, deeply appreciated man

  8. niotisn
    Member
    Posted 1 year ago #

    I think i will continue bugging you guys coz i also want to change the font color when an event is added.

    my color is #wp-calendar td {
    color: #b8c0c7;

    which is ok, however when i add an event this is red. which css line do i change?

  9. esmi
    Forum Moderator
    Posted 1 year ago #

    I'm sorry but it is beyond the scope of these forums to deal with general CSS issues. Try a dedicated CSS resource such as http://www.css-discuss.org/ instead. In the meantime, using Firefox with the Firebug add-on for this kind of CSS work.
    http://getfirebug.com/

  10. Phil
    Member
    Posted 1 year ago #

    niotisn, that colour isn't coming in via CSS, so I would look at the plugin settings in the back-end of WP to see if that colour is there somewhere.

Topic Closed

This topic has been closed to new replies.

About this Topic