- This topic has 14 replies, 6 voices, and was last updated 8 years, 10 months ago by
.
-
Posts
-
Are there plans to make the event calendar pro mobile compatible? Right now when I insert into a responsive WordPress theme, the calendar looks great on iPad but horrible on iPhone. What are your development plans or can you tell me how to edit so the calendar view can be used on a mobile phone.
Hi figuy,
We are working towards an ever more responsive plugin but I have no official ETA when it will actually be fully responsive. You can customize all the CSS and add your own breakpoints to get it looking the way you want though. The skies the limit. Good luck!
– Jonah
I echo this. We are very much in need of a mobile version. I hope you add this to your task list soon!
That is great for future plans but for us non-techie guys can you throw us a bone and give us a little code on how we would as you say: “You can customize all the CSS and add your own breakpoints to get it looking the way you want though. The skies the limit.” Just a little support I am not asking for 50 lines of code….. Pretty Please? 🙂
I’m going to look into some CSS for this. Patience and I’ll post something, hopefully by the end of the weekend.
Hi guys,
My suggestion would be to read up on responsive web design. There’s tons out there on the subject. Here’s one example: http://blog.teamtreehouse.com/beginners-guide-to-responsive-web-design
There’s really way too much to go into to provide much guideline here. A good start would be this though: http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
You can use those media queries in your CSS to apply specific styling at each of those breakpoints (resolutions).
Maybe Andy can provide a little more here but aside from that you’re on your own. Sorry I can’t offer up more.
– Jonah
Thanks Jonah. I’ve already got a media query that works for iPhones and iPads. I was planning on using it. 😉 I’ll probably have to make some tweaks for iPhone 5 but I have to get my hands on one first.
OK, I was playing around a bit. Here’s something that seems to work for me and what I mean by this is the whole calendar is visible and days are all about same size. Small, but consistent. If this isn’t what people are thinking of please let me know.
https://gist.github.com/3762892
You can see how it looks at http://drfragen.info/events/month
No problem Leah. I’ll fix it a bit to make sure it works with iPhone 5 soon.
I’d really like to know if this solves anyone’s issues with TEC on an iPhone. Though the CSS isn’t technically iOS specific. It should work on any phone. I’d like to make parts more specific to TEC, especially that ‘body’ tag but given the variety of customization people out there have I’d be thrilled if it doesn’t mess up any other styling. 😉
@flguy, you will need to create the folder structure as described in the Themer’s Guide. It will look something like the `/wp-content/themes/my-theme/events/events.css`. You will have to create both the `events` directory and a file inside this directory named `events.css`
You will also need to either copy all the existing CSS from the core events.css file into the new events.css file or you will need to download `The Events Calendar User CSS` plugin from the WordPress repo and activate it.
Let me know how this works.
Just an FYI. I updated some of the CSS to rearrange the calendar buttons and truncate very wide event descriptions. It’s at the gist as above.
Additionally, I had a chance to view the changes on an iPhone 5 and it still looks similar, at least to me. 😉
- The topic ‘Mobile Ready (iPhone) – Event Calendar Pro?’ is closed to new replies.