Get help. Give help. A Web Design and Development Community.

Calendar CSS style editing.

  • # October 21, 2013 at 7:11 am


    could anyone tell me what would be one of the best ways to edit a joomla j events calendar to look like K2 calender? I have the css file for the K2 calender and the css file for j events calender but I can’t figure out a good way to change the looks. I can not just use the K2 calender for various reasons.

    Best regards, Lyhis

    PS. I will share the css files once im back home if needed.

    # October 21, 2013 at 9:18 am

    This reply has been reported for inappropriate content.

    It’s a matter of matching the HTML-tags up with the (new) CSS rules, which has to be done one at the time I assume.
    Can you maybe write which tools you use, … do you use firebug/chrome devtools to inspect element?

    # October 21, 2013 at 11:47 am


    thanks for answering. I do have both firebug and web developer tools installed.

    This here is the jevent calendar with the css file:

    And this here is the K2 calendar with the css file:

    Just overwriting the jevent css does not work of course and I’m quite new to the whole web developing business so any tip or suggestions would help out a lot.

    # October 21, 2013 at 1:31 pm

    This reply has been reported for inappropriate content.

    Copied some code from the calendar widget in the sidebar of this demopage

    • When you fork this pen, then you can tweak the css, but I can’t be sure if it’s the same HTML-markup for you’re calendar:

    Is it the same calendar?

    # October 21, 2013 at 1:48 pm

    This reply has been reported for inappropriate content.

    You need to establish the selector strings that give style to all the HTML elements within the calendar, using the plugin you want to transition away from. Work out what the selector strings should be changed to to give the elements of the calendar plugin you want to move to that style.

    It essentially requires you use a Web Inspector (like Chrome’s “Inspect Element” tool), and spend lot of time spent looking at elements, and saying things like (this is just an example) “ul.this_is_the_container styles the container. What is the selector for the container element in this new plugin? That’s what I need to change that selector to.” Rinse, repeat.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

We have a pretty good* newsletter.