Home › Forums › Calendar Products › Events Calendar PRO › Calendar displays mobile version only.
- This topic has 15 replies, 2 voices, and was last updated 9 years, 6 months ago by Josh.
-
AuthorPosts
-
September 16, 2014 at 12:17 pm #746722Henrico CountyParticipant
After installing and Events Calendar Pro and Events Calendar, I created several events for testing. the calendar displays the mobile version. (instead of the brief description, I get that dot).
I deactivated all pluggins, problem still exist. I’m using Bootstrap framework. No other calendar is installed. Reverted to 2011 calendar works. Any suggestions?September 16, 2014 at 6:50 pm #747504JoshParticipantHello henricocounty,
Thanks for reaching out to us!
Is there a link that we can see the issue live? Also, to start off with, have you tried following the Testing for Conflicts procedures to see if there is a conflict with an existing theme or plugin?
Let me know if anything comes up as a conflict when testing.
Thanks!
September 17, 2014 at 12:47 pm #749058Henrico CountyParticipantThanks for your response here is the link
http://henrico.us/events/Yes, I went through the Testing Conflicts procedures. 2011-2014 themes work fine, I can’t pinpoint exactly why ours is failing. The browser cache has been reset, I’ve deactivated and/or removed all plugins, nothing seems to work. We are using The Roots.
ThanksSeptember 18, 2014 at 9:22 pm #752096JoshParticipant<p>Hello henricocounty,</p><p>Thanks for following up with us!</p><p>It looks like the mobile stylesheet is being enqueued early. You can try to manually decreasing the breakpoint size ( currently set to 768px ) using the “tribe_events_mobile_breakpoint” filter to see if you can force the stylesheet to load at a lower screen size.</p><p>Hopefully this will help to get you pointed in the right direction. Unfortunately, there isn’t a whole lot we’re able to do with supporting theme conflicts but hopefully this will get you to determine where the conflict may be arising. </p><p>Thanks!</p>
September 25, 2014 at 12:12 pm #766550Henrico CountyParticipantI read thru the document explaining the break point filter. It wasn’t clear as to where to place the filter. Inside which file?
function customize_tribe_events_breakpoint()
{return 600;}
add_filter( ‘tribe_events_mobile_breakpoint’, ‘customize_tribe_events_breakpoint’ );September 26, 2014 at 10:15 am #768721JoshParticipantHello henricocounty,
Thanks for following up with us!
You can add the code above to your theme’s
functions.php
file and that should work to change the breakpoint. Let me know if that works for your site.Thanks!
October 10, 2014 at 12:45 pm #801388Henrico CountyParticipantThanks for the info this is great. When I use the Kill responsive function it works. I’m having problem trying to find the proper break point. No matter what number I insert its still seem stuck in the responsive view.
October 10, 2014 at 9:38 pm #802168JoshParticipantHello henricocounty,
Thanks for following up. I’m glad you were able to find a solution that works for now.
It definitely sounds like it is a javascript issue that is at the root of the problem. Another option you could pursue is dequeueing different parts of the Bootstrap library to see if there is a specific script that is causing the conflict.
I’m sorry I wasn’t able to give you a direct response however I hope this was able to point you in the right direction.
Thanks!
October 15, 2014 at 1:23 pm #812886Henrico CountyParticipantHi,
This isn’t really a solution that works though. Only the ‘kill responsive’ works, no matter what we set a breakpoint to, that code never does anything.
What appears to be happening is that no matter what the breakpoint is, the mobile theme is being included. Since that then doesn’t use its own set of media queries, they are overriding everything. For example, looking at line 651 in tribe-template-factory-class https://github.com/moderntribe/the-events-calendar/blob/056aca6f5887a3b2425a61ba6234e2e25b273683/lib/tribe-template-factory.class.php#L651), as long as that number is not 0, it includes. These includes are happening before our bootsrap includes from our theme.
Example:
<link rel=”stylesheet” href=”/wordpress/plugins/the-events-calendar/resources/tribe-events-full.min.css?ver=3.8.1″>
<link rel=”stylesheet” href=”/wordpress/plugins/the-events-calendar/resources/tribe-events-theme.min.css?ver=3.8.1″>
<link rel=”stylesheet” href=”/wordpress/plugins/the-events-calendar/resources/tribe-events-full-mobile.min.css?ver=3.8.1″>
<link rel=”stylesheet” href=”/wordpress/plugins/the-events-calendar/resources/tribe-events-theme-mobile.min.css?ver=3.8.1″>
<link rel=”stylesheet” href=”/wordpress/css/bootstrap.css”>
<link rel=”stylesheet” href=”/wordpress/css/bootstrap-responsive.css” media=”screen”>
<link rel=”stylesheet” href=”/wordpress/css/app.css”>We need more assistance on the direction to take. We started off using the Root’s theme, which we had read before has conflicts out of the box with this plugin – but no fixes or notes are shown. We haven’t seen anything like this with any of our other projects or custom code.
October 16, 2014 at 8:12 pm #815218JoshParticipantHello henricocounty,
Thanks for following up with us.
I’m sorry for the issues that you’re experiencing with compatibility between our plugin and your theme. Unfortunately there isn’t a whole lot we’re able to do in regards to theme conflicts.
It looks like there is some information in the Roots forums about compatibility and may be a good starting point to diagnosing the issue you’re experience with the theme.
Thanks!
October 17, 2014 at 6:15 am #815772Henrico CountyParticipantThis reply is private.
October 17, 2014 at 7:20 am #815821Henrico CountyParticipantI have done more testing. Nothing on the Roots forum at this time reflects anything like we are seeing – we are using a much older version before they moved to this theme nesting stuff.
First of all, by doing an echo in a sample template, the tribe_get_mobile_breakpoint is actually returning the valid value – so it is getting set. Secondly, if I add say @media(max-width:800px) { to the top of the mobile file – it also works responsively as it should.
I got the second idea from https://wordpress.org/support/topic/plugin-the-events-calendar-problem-with-responsive , where a support rep for Modern Tribe notes that if we can narrow it down to Events Calendar, they should be able to help. Something about how you set this value is off, or not picking up at the right time. How can I adjust that? Moving the break up to the top of the functions file doesn’t change anything.
October 17, 2014 at 7:40 am #815899Henrico CountyParticipantYet another update. I realized if you read from https://github.com/moderntribe/the-events-calendar/blob/056aca6f5887a3b2425a61ba6234e2e25b273683/lib/tribe-template-factory.class.php#L639 till about line 700, its supposed to add some extra stuff when it enqueues, and it doesn’t on our theme – but does on others. For example, at the end of the include, it adds media=’only screen and (max-width: 768px)’, but its not doing that on ours. Could this shed some insight on the issue?
October 17, 2014 at 7:44 am #815913Henrico CountyParticipantThat’s exactly it (I think) – the fact that its not adding that media line. It does this in your plugin at https://github.com/moderntribe/the-events-calendar/blob/056aca6f5887a3b2425a61ba6234e2e25b273683/lib/tribe-template-factory.class.php#L688 .
Why would this not get set? If I use the inspector and add that line, things work as they should.
October 17, 2014 at 8:41 am #816010Henrico CountyParticipantI found the issue, and a fix, which is a Roots template issue. As I was researching, after I found out that it cleared out that media query, I found something similar where I had issues with it applying print stylesheets.
If you check out https://github.com/roots/roots/blob/5.2.0/inc/cleanup.php#L607 , it looked something like this. I added an extra check for the style that this puts out, and it now works.
Thank you for your help, and sorry for the confusion. I am guessing that how TEC has so many overrides, this was the only way for you to implement such a feature.
-
AuthorPosts
- The topic ‘Calendar displays mobile version only.’ is closed to new replies.