How to Create Dynamic Calendar With Elementor and WordPress [Complete Guide]

[@hugomakes]

I tried to make this a comprehensive video on how to create a dynamic calendar in WordPress using Elementor and JetEngine Crocoblock. I hope you find value from it. Let me know if you enjoyed it or if you have questions. Also feel free to post any comments with videos you'd like me to make in the future.

[@FoxieWebDesign]

Question: When you setup the Listing Items, you used dynamic values for the Feature Image and link, but you need Elementor Pro for that, is there a workaround using only Crocoblock settings? Looking into this further myself I see Crocoblock has Dynamic Listing Elements! Then you use Theme Builder, again Elementor Pro, many of us bought Crocoblock so we didn't need to use Elementor Pro, so now I have to work out how to make a Custom Post Template without Elementor Pro, I bet Crocoblock can do this, or maybe ACF? Looks like a yes, using JetThemeCore

[@derick_eppendahl]

Great video! Clear and simple...!

[@hugomakes]

Woot woot! Thanks Derick!

[@derick_eppendahl]

@@hugomakes My sincere and real pleasure Hugo! 😇

[@mikebb0653]

OMG this is what i am looking for, very great tutorial, thank you!! I will try it then~

[@hugomakes]

Glad it could help! Good luck.

[@deboade2246]

Well done! Very helpful video

[@hugomakes]

Glad it was helpful!

[@johndavidson9587]

This is great for google calendar, but I have no idea how to create the add to calendar links for apple and outlook. Are there any tutorials out there for these other calendars?

[@hugomakes]

Hi John! I'll add this idea to my to-do list and I will create a video sometime this month, but if you follow the concepts in the video and Google the way the link needs to be formatted, you should be able to create what you need as well.

[@johndavidson9587]

@@hugomakes Thanks, I'll look out for this. I'm thinking of Proton Calendar (a bit 'far out' I guess!) but your tutorial should help me get the hang of it.

[@GamerRadar]

Why a CPT not a CCT?

[@priyaranjan279]

what about the responsiveness on tab and mobile. The video was a great help on the desktop.

[@hugomakes]

It will look like a calendar on mobile as well, but because it will be smaller, I recommend on mobile you show a list view instead. This is based on subjective stuff so I didn't want to make the video even longer. Listing grid is covered in previous videos as well if that helps! You can see how the calendar reacts on mobile on this link: www.juicybyte.com/events-calendar/ Good luck!

[@priyaranjan279]

@@hugomakes thank you so mucjh for the quick reply. I don't see any events

[@ALIMAHMA]

Great video, i tried it and it worked only if your Date (timestamp) meta field is not inside a repeater, as soon as you have your Timestamp field inside a repeater you can not group the Calender with this Timestamp meta field so all your events will show on one Day Cell, i could not get it to work, so if you tried that can you give us a hint. Thanks

[@hugomakes]

Hi! Can you expand on why you're using a repeater for the calendar?

[@ALIMAHMA]

@@hugomakes Thanks a lot for replying back I have a Post Type "workers" with name, age, etc, and a repeater field which has (Working day, start time and end time), I created a listing with Worker names, age, working days, start time, and end time. Using this listing in the Calendar widget shows all the info except it puts all under one date (publication date), if I choose to group using a custom field all the info disappears although the working day field is "timestamp". Only works if the post type has a timestamp (date) field but NOT inside a repeater. I am using Bricks, not Elementor