Normal calendar in mobile version
-
In the mobile version I want the calendar to be shown in a month view and not in a list version. With “nomobile” I can see the calendar (month), but I have to scroll to see all the days. Is it possible to see all the days even if it is the smallest calendar?
In the mobile version the parameters “description0 “false”” and “format” don’t work either. How can I solve this?The page I need help with: [log in to see the link]
-
Month view is designed with a minimum width for the table cells (and horizontal scrolling) because the text generally starts to over-run the cells, and the cells get extremely tall. You can override this with CSS, but I discourage it for the reasons mentioned above:
@media screen and (min-width: 783px) { .ics-calendar .event .hover_block { min-width: 10px !important; /* Anything small will do here */ } }
The
description
parameter is for the overall description of the calendar, and definitely does not function differently between mobile and desktop. Are you trying to set the handling of individual event descriptions? That parameter iseventdesc
. Can you be specific about what isn’t working withformat
?I tried checking your linked page but the ICS Calendar isn’t loading… it’s returning an HTTP 423 Locked error.
I would like to have the same functionality, no need the horizontal scroll version of calendar in mobile version, previous no scrolling version was better for me… I was using css for limit the height of calendar cells in mobile version. Because i prefer the whole calendar in the screen rather than the whole title of events.
Thanks @redcoop and @electropatata for this feedback. I will look into adding an option to choose how it handles the table on mobile.
I’ve tried the CSS and it doesn’t work (I use Elementor).
It doesn’t work either eventdesc=”false” so that the description doesn’t appear in the mobile version.
The desktop version shows less information than the mobile version, and I would like the mobile version to show the same as the desktop version.
I also want to translate “Room unavailable” to spanish, how can I help to translate the plugin to spanish.
Greetings,I’m still not able to see the calendar on your page so it’s a bit difficult for me to troubleshoot this. I think we may be talking about different things. Can you try turning off the AJAX option? That’s causing the calendar not to load for me when I view the page.
It sounds though like you might benefit from using themaskinfo
parameter. That removes all details of events and lets you replace it with an arbitrary text string. That should definitely prevent descriptions from appearing, and will also let you enter a text string of your choice in Spanish.Hello!
I have already disabled Ajax, so you can see the calendar.
Maskinfo has served me well for what I want. Now I just need to make the calendar fit on a mobile screen.The CSS example I provided should work for this. Where/how were you adding this CSS to your site?
@redcoop I apologize; on review, I sent you was incorrect for this situation. Rather than giving you a different CSS snippet to use, however, I am going to recommend that you wait for the next update, which should be released this week. It will include a change to the
compact
parameter that will allow you to switch back to a super-compact layout for the calendar grid on mobile.I have made this option available in the latest beta version if you would like to try it out. You can download the beta here:
https://downloads.www.ads-software.com/plugin/ics-calendar.10.11.5-beta-1.zip
Add
compact="mobile"
to your shortcode to get the new compact version of the mobile month table. (Note: You’ll still neednomobile="true"
in your shortcode as well; without that, month view collapses to a list on mobile.)Feedback is welcomed! I’m not quite sure what the optimal compact presentation of this table view is, so let me know if this new version is awkward to use. (I have the table cells set to a fixed height, with internal scrolling in each cell, so the whole month should be able to fit on a phone screen at once.)
Hello!
Thank you for your changes. I will try it outPrevious to add the horizontal scrolling functionality in mobile versión I added this CSS to avoid log height cells:
@media (max-width: 600px) {
.ics-calendar li.event {
height:80px;
overflow:hidden;
}
.ics-calendar .end_time {
display:none!important;
}
}Now, with the new feature the need is to vertical scroll instead of horizontal scrolling… But i preffer the user don’t need to scroll in any way, having all the events at a time in the screen, like the previous version without these improvements. This funtionality is great anyway for those who need it, but i need the not scrolling version with all the events in the view. Because I don’t want people to have to figure out that they have to scroll.
Other Issue: with this feature added to the combinemultiday functionality some days have blank cells because the first events shown are multiday ones and don’t have any text.
-
This reply was modified 1 year, 8 months ago by
ayam maiself.
-
This reply was modified 1 year, 8 months ago by
ayam maiself.
I’ve added this to the CSS to have what I want:
So, it’s solved for my needs.
@media (max-width: 782px) {
.ics-calendar li.event {
height:80px;
overflow:hidden;
}
.ics-calendar .end_time {
display:none!important;
}
.ics-calendar-month-grid {
min-width: 0px!important;
}
}with nomobile=”true” and without compact=”mobile”
Thanks for every of your improvements.
Can be able to have a configuration page in a next update to modify the default parameters for every calendar in the global website?
Imagine I want to change to the new compact=”mobile” feature and i need to go to every calendar to change it one by one in the website…
I usually have the same configuration parameters in every calendar and the opportunity of change them in a single page would be great!
Thanks!
-
This reply was modified 1 year, 8 months ago by
ayam maiself.
I’m glad you were able to find a solution.
Unfortunately the type of global change you’re suggesting would not be possible, because it would require having a way to edit the content of the shortcode in every instance where it appears in page/post content throughout your site. That would be a dangerous kind of change to make.
I could see the possibility of setting up a set of defaults that override the core default settings, so if your shortcode did not contain any of these parameters directly, it would use the custom defaults. Most likely due to the development time involved (plus some of the existing code in the Pro version that could be leveraged for it), this would need to be a Pro-only feature, not something included in the free version.
Yes, i was talking about the possibility of set custom defaults that override the core default settings in a configuration page, to use them when the shortcode don’t change the parameter by itself.
Then you can have the opportunity of write shorter shortcodes and modify some parameters globally, because it’s usual to have the same default configuration in the most of the calendars used on a website.
Thanks for your further attention
Great latest plugin update!
I got everything I needed.
Thank you very much for your feedback and quick implementation of the solution.
Best regards! -
This reply was modified 1 year, 8 months ago by
- The topic ‘Normal calendar in mobile version’ is closed to new replies.