Full Month Calendar Displaying Dots instead of events

[Monica]

We have a Pro version of the events calendar. Our new setup of a calendar is not showing the full view.

Here it is in action:
http://christpres.org/upcoming/

Our staged test of it on our developer’s server is here: http://www.toddplex.com/cpc/events/

Is this a styling or template issue? How do we fix?

Thank you.

[Geoff]

Hey Monica and welcome to the forums!

So sorry for the trouble here with Month View. I have seen this sort of thing pop up before and, in most cases, it’s a theme conflict.

This article explains the issue in much more detail and provides a trick for resolving it.

If that doesn’t work, then another idea is to head to Events > Settings > Display and switch the calendar’s template to Default Events Template. And, if that is already selected, try changing it to another one of your theme’s templates instead, save your settings and see if that changes anything.

Do either of these help clean things up? Please let me know. 🙂

Thanks!
Geoff

[Monica]

Thank you, Geoff! We had trouble finding a support topic that specifically addressed the problem.

Using the function to turn off responsive styles “works” but then the calendar does not look ideal on a mobile device. The hack to change the breakpoint to 600px did not work.

The article you linked to mentions the original responsive breakpoint was at 768px. Our template has at least 1155px of horizontal space yet the calendar was still breaking into the mobile view. Any thoughts on why that might be happening?

Thanks!

[Monica]

Additional question:

I have responsive breakpoint turned off and have reverted to our custom template for the calendar page. When we scroll over an event title, some comment markup appears. Like this:

/*>*//*

All here:
http://christpres.org/upcoming/?w3tc_note=flush_all

[Geoff]

Hi Monica,

The article you linked to mentions the original responsive breakpoint was at 768px. Our template has at least 1155px of horizontal space yet the calendar was still breaking into the mobile view. Any thoughts on why that might be happening?

Even though the page appears to be growing in width, there is markup in the theme’s CSS that is telling the page to be a minimum width.

I see that the page is wrapped in a CSS class called container and when the browser reaching various widths, then the CSS changes the width of that class accordingly.

For example, here are a few of the CSS rules being applied to the container class when I inspect it in Developer Tools:

@media (min-width: 1200px)
.container {
width: 1170px;
}
@media (min-width: 992px)
.container {
width: 970px;
}
@media (min-width: 800px)
.container {
width: 750px;
}

This may have something to do with how the calendar switches between large and small screen views, but I’m not familiar with the theme’s code enough to know that for sure.

I have responsive breakpoint turned off and have reverted to our custom template for the calendar page. When we scroll over an event title, some comment markup appears. Like this:

/*>*//*

That, too, is likely a conflict with the theme, or perhaps another installed plugin. I have that hunch because the staged example you sent me earlier seems to be working perfectly with a default WordPress theme:

http://www.toddplex.com/cpc/events/

Theme conflicts are especially tough for us to troubleshoot because the theme author would be much more familiar with the theme’s code than we are. That said, I would ask the theme author if it’s possible to inspect their Javascript to make sure there are no errors. The Month View tooltips on The Events Calendar are completely controlled by Javascript and any errors in the theme’s code that makes its way on that page can interfere with them.

Sorry I don’t have a concrete answer here for you, but I do hope this at least helps pin down where the issue is coming from so that you’re closer to a resolution.

Geoff

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts