WordPress.org

Forums

[resolved] Styling the EventCalendar 3 (16 posts)

  1. jorgent
    Member
    Posted 9 years ago #

    Hi!

    I have some problems with the EventCalendar 3 and css. I want to change the background color of the table cells. I can change the font color, but not the color behind the numbers. I don't want to change the background color for the whole calendar, only the cells (or what it's called).

    I tried this method:
    http://wordpress.org/support/topic/20284

    But it only worked on the standard calendar. The EventCalendar remained almost unchanged. The only thing which changed was the bgcolor of "today".

    I've played with the wordpress css, and the css for the EventCalendar, but no matter what I do I can't get the colors to work. I'm a newbie to css, so I'm stuck now..

    I guess the problem can be solved with the right use of "<div id="something">", but I don't know what to look for, and where. I wish the EventCalendar didn't have integrated css, cause it makes it confusing for a newbie :) I actually disabled the plugins css, but I still couldn't use the multicolour method or change the bgcolor with my wordpress stylesheet.

    The calendar is an important part of the blog, so I really hope somebody can help me. Thanks!

    http://www.orekroken.com/test/

  2. jorgent
    Member
    Posted 9 years ago #

    I don't want to fuss, but has anyone an idea about what the problem can be?

  3. Beel
    Member
    Posted 9 years ago #

    look in the plugin

  4. jorgent
    Member
    Posted 9 years ago #

    I've done that, but I can't figure it out.. (me:newbie) I looked at your site, and your calendar is exactly how I want mine (only with different colors). Looks so much better than plain white.

  5. Beel
    Member
    Posted 9 years ago #

    Well, I believe there are instructions on how to disable it (in the instructions ;-). Then if you don't want to use, or can't figure out, their css you can create your own styling.

  6. Beel
    Member
    Posted 9 years ago #

    Oh, the code is not in the plugin itself but in ec3.css

  7. jorgent
    Member
    Posted 9 years ago #

    I actually managed to disable the plugins css, but I still couldn't style it in the wordpress stylesheet.

    I tried to style the ec3.css, but with no effect. I tried to remove the calendar css in the wordpress stylesheet, cause I thought the ec3.css and the wp stylesheet maybe was in conflict. Than I tried to change the ec3.css again, but still no effect.

    I simply want to add "background-color: #something;". I know how to change font size and color, and background color to the whole calendar.

    Thanks for helping :)

  8. Beel
    Member
    Posted 9 years ago #

    #wp-calendar .eventday {
    background:yellow;
    }

    #wp-calendar #today {
    background: #FFF;
    }

  9. Beel
    Member
    Posted 9 years ago #


  10. jorgent
    Member
    Posted 9 years ago #

    Now we're on the right track! :) How do I change the background color for all the other days? I want to have one color for "emty" days, one for the events and one for today.

    I Really appreceate your help Beel!

  11. Beel
    Member
    Posted 9 years ago #

    #wp-calendar td {
    background: blue;
    }

  12. jorgent
    Member
    Posted 9 years ago #

    You're my hero Beel! Thank you very much! I tried "everything" yesterday, but I just couldn't figure it out.

  13. jorgent
    Member
    Posted 9 years ago #

    I would like to do one more thing :)

    If you look at the calendar
    http://www.orekroken.com/test/

    you can see that the events are red. The events are also listed beneath the calendar. I want to change the link colors on this list to red (not all the links in the sidebar, only in that list). I looked at the ec3.css:

    /***
    *** Event list
    ***/

    .event_list_day {
    margin-left:-12px;
    word-spacing:-1px;
    letter-spacing:-0.2px;
    color:#800;
    }
    .event_list_day li {
    font-size:1em !IMPORTANT;
    color:#fff;
    }
    .event_list_day li:before {
    content:"" !IMPORTANT;
    }

    I tried to change the colors, but nothing happend. I also tried to copy the css into my wordpress stylesheet, but still no effect..

  14. Beel
    Member
    Posted 9 years ago #

    .event_list_day a {color:red}

  15. jorgent
    Member
    Posted 9 years ago #

    Thank you again :)

  16. razzel
    Member
    Posted 9 years ago #

    What about the background of the days? In my blog the background only fills the bg of the number, so they have
    a different with! ( for example: 9 is smaller than 20). how can i make them the same with? have a look at the blog under http://www.mongofreunde.de. thanx.

Topic Closed

This topic has been closed to new replies.

About this Topic