Software & Apps Google Drive How to Embed Google Calendar on Your Website Add a professional-looking camera to your site by Marziah Karch Writer Marziah Karch is a former writer for Lifewire who also excels at Serious Game Design and develops online help systems, manuals, and interactive training modules. our editorial process Marziah Karch Updated on March 29, 2020 Google Drive Docs Sheets Slides Tweet Share Email Use the free and easy Google Calendar to manage and share a public-facing calendar on your website. 01 of 05 Getting Started: Settings To embed a calendar, log in to Google Calendar. Next, go to the left-hand side and click on the little triangle next to the calendar you want to embed. You'll see an option box expand. Select Calendar Settings. 02 of 05 Copy the Code or Select More Options Optionally, tweak the size or color of your calendar. Scroll down the page and you'll see the area marked Embed this calendar. Copy the code from here for a default 800-pixel-by-600-pixel calendar with Google's default color scheme. To change these settings, select the link marked Customize the color, size, and other options. 03 of 05 Customizing the Look Specify the default background color to match your website, the time zone, the language, and the first day of the week. Set the calendar to default to week or agenda views, which might be useful for something like a cafeteria menu or team project schedule. You can also specify which elements show up on your calendar—like the title, print icon, or navigation buttons. The default size is 800 by 600 pixels. That size is fine for a full-size Web page with nothing else on it. If you're adding your calendar to a blog or Web page with other items, you'll need to adjust the size. Every time you make a change, the site displays a live preview. The HTML in the upper right corner should change, too. If it does not, select the Update HTML button. When you're satisfied with your changes, copy the HTML in the upper right corner. 04 of 05 Paste Your HTML Paste the code into the relevant section of the HTML for your webpage. 05 of 05 The Calendar Is Embedded View your final page to display the live calendar. Any changes you make in the events on your calendar update automatically. If it isn't quite the size or color you had in mind, go back to Google Calendar and adjust the settings, but you'll have to copy and paste the HTML code again. In this case, you're changing the way the calendar appears on your page, not the events.