All-in-One Event Calendar
Changning styles in a professional way? (6 posts)

  1. ptroxler
    Posted 3 years ago #

    Styling is a matter of taste and I absolutely hate the styles of this plugin.

    But worse: I'd need to change the .css file in the plugin folder to fix them -- this is a massive no-go. And the plugin does not seem to care about this.

    Anybody an idea, how to tackle this bug in the architecture of the plugin?


  2. Nathan Allen
    Posted 3 years ago #

    The styles are added using wp_enqueue_style in plugins/all-in-one-event-calendar/app/controller/class-ai1ec-calendar-controller.php near line 543.

    So I think the best option is to work out which files you want to edit, then copy them to your theme directory and add some extra code to your functions.php to replace the default css with the modified css. For example, in my functions.php I have:

    function replace_calendar_styles() {
    $path = get_stylesheet_directory_uri();
    wp_register_style('custom-ai1ec-general', $path.'/general.css');
    wp_register_style('custom-ai1ec-calendar', $path.'/calendar.css');
    wp_enqueue_style( 'custom-ai1ec-general');
    wp_enqueue_style( 'custom-ai1ec-calendar');
    add_action('wp_print_styles', 'replace_calendar_styles');

  3. ptroxler
    Posted 3 years ago #

    thx Nathan … came up with that very solution after a bit of thinking

    in addition to the ai1ec-general.css and the ai1ec-calendar.css I also changed the ai1ec-event.css

    I guess this should make it into the plugin FAQs?

  4. Nathan Allen
    Posted 3 years ago #

    Yeah, it really should be included in their documentation. It would certainly save everyone a whole lot of time. At least this page will be useful for anyone searching for a solution.

  5. IAmediaworks
    Posted 3 years ago #

    Editing the CSS file for widgets seems to do absolutely nothing. :(

  6. mmulwa
    Posted 3 years ago #

    I noticed that the overwhelming majority of the rules for styling various aspects of the calendar are augmented with the !important rule.

    width: 320px !important;

    so what I did in my own stylesheet is overrule their importance by declaring my rules important as well. Seems to have done the trick. I would show an example, but I'm still in the localhost. Once you figure this out, however, it's pretty easy to fen-angle and change whatever you need to within your own styling rules! There's no need to touch the PHP or the plugin files.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • All-in-One Event Calendar
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic