Forum Discussion
calendar web part on modern pages
georg1 many thanks! This indeed did the job for us. So, in summary: we used the embed webpart with this iframe code:
<iframe src="https://company.sharepoint.com/sites/yoursite/Lists/agenda/calendar.aspx?isDlg=1" width="100%" height="800px"></iframe>
HIi Josef Hermes I've tried out the embed code, but I am getting too much white space with my calendar. Is there any work around so that there is no space at the bottom of the web part? and 1 more problem is if I click on red marked area whole top menu is appearing which I dont want and there is no way to close it. I had to refresh the page then only it ill disappear. Any idea how to resolve this?
Rajrup40 I just discovered a different URL code, that seems to limit the white space and also seems to fix the menu problem. The URL extention is ?Minimized=true, so for example the embedded URL wil be
<iframe src="<a href="https://yourcompany.sharepoint.com/sites/site/Lists/Agenda/calendar.aspx?Minimized=true" target="_blank">https://yourcompany.sharepoint.com/sites/site/Lists/Agenda/calendar.aspx?Minimized=true</a>" width="100%" height="700px"></iframe>- This one works for me! Thanks!!
This is what I ultimately got working for me, a combination of suggestions here and other google searches. There's still a bit of excess whitespace above the calendar I can't get rid of, but I'm happy as is.
To strip the Ribbon (browse, page, etc...) from the embedded calendar, then on the Calendar page, add a Content Editor Web part and edit the CEW part's source to be:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
_spBodyOnLoadFunctionNames.push("hideItAll");
function hideItAll(){
if(window.location.search.toLowerCase().indexOf("isdlg=1") > 0){
$("#s4-ribbonrow").hide(); //ribbon bar
}
}
</script><br/>Then you can embed using:
<iframe width="100%" height="625" src="https://XXX.sharepoint.com/sites/XXX/Lists/CALENDAR/calendar.aspx?Minimized=true&?isdlg=1"></iframe>
That looks promising. My site won't accept the double listing of the site info as your instructions show, but it does like it when I show the location only once. Mine is kind of a hybrid of other information shared in this post. Here is the modified form of what I am using.
<iframe width="100%" height="625" src="http://yourcompany.sharepoint.com/sites/site/lists/Calendar/calendar.aspx?minimized=true"></iframe>
It gives me the whole calendar. I have to scroll to see the right half, but the scroll is there and it does look similar to the classic look with all the items from my calendar on it. So, just an option. Maybe someone can fine tune this embeded script to make it work even better.
Hi GeorgeIII ,
Not working as expected, Not single solution working as expected, Microsoft might come in future with modern calendar webpart. Calendar webpart is very important because many organizations want it for Team calendar, leaves, time sheet purpose. Microsoft please do it.
Thanks,
Swapnil
Rajrup40 Sorry, I don't know any solution for that. We also have these problems. Lets hope Microsoft will release a modern calander webpart soon!
Josef Hermes sorry to share some bad news, but Microsoft has stated that they are not working on a modern calendar for SPO
Dean_Gross too bad indeed but I could see it very hard to display nicely on a phone. Our work around is linking it from the home page to the classic web part but noticed the quick launch bar is not always the same jumping between modern and classic pages.
