Google Calendar helps you put important events on your website.

You don’t have to write code in order to embed your Google Calendar on your website, because Google Calendar automatically generates the HTML you need. You can also personalize your calendar by customizing its colors, dimension, default view and other properties. Choose the Agenda view if you’d like to embed a calendar that shows your events grouped by day.

Visit the Google Calendar Web page (see Resources), click the drop-down arrow next to the calendar you want to embed -- located under the heading "My Calendars" -- and then click “Calendar Settings” from the menu that appears

Click the “Customize the Color, Size and Other Options” link to view the Google Embeddable Calendar Helper page. This page has check boxes, drop-down menus and other controls that can help you customize your calendar.

Click the “Agenda” radio button in the Default View section to select the Agenda option.

Copy the HTML code from the text box that appears at the top of the page, and then open the HTML document where you’d like to embed the calendar.

Paste the code in the document’s "<body>" section where you want the calendar to appear. Save the document, and then open it in your browser to see your calendar.


  • While you’re on the Google Embeddable Calendar Helper page, adjust other customization properties if you like. For instance, if you want to change the calendar’s dimensions, update the values in the Width and Height text boxes.