How to Embed iCal Into HTML

Techwalla may earn compensation through affiliate links in this story. Learn more about our affiliate and product review process here.
Embedding your iCal into HTML will ready it for online publishing.

If you want to display your Mac's iCal calendar on your website, you must embed it in HTML. This requires having it hosted online so the HTML code has somewhere to link to. Apple's iCal software makes putting the calendar online simple. It also will automatically update when you update iCal on your computer. This ensures that the HTML calendar on your website will always be up-to-date.


Step 1

Open your iCal calendar.

Video of the Day

Step 2

Select "Publish" from the "Calendar" menu.

Step 3

Give the calendar a name, then click "Publish."


Step 4

Enter your MobileMe account information, if prompted. Most Macs will have this information already logged since all users must create one when they register their computer.


Step 5

Copy down the URL address of your calendar.


Step 6

Open your HTML code and insert the following where you would like the calendar to appear:

Step 7

Replace "URL" with the address you copied in Step 5. The iCal calendar is now embedded in the HTML.




Report an Issue

screenshot of the current page

Screenshot loading...