Embed a Google Calendar in your timesheet dashboard with Beebole’s custom module (and so much more!)

At Beebole, we work to make our time tracking tool as customizable as possible to ensure it can be adapted to meet any organization’s needs. In keeping with this, we offer a custom module that you can drag and drop into any of your screens. Here, we show you how to use it to embed a Google Calendar in your timesheet dashboard.

Beebole’s dashboard is made up of modules that can be added to any company, project, or employee screen to make it fully configurable. Each module has a different use, such as reports, budgeting, timesheet settings, etc. For example, you can add and customize multiple charts and tables to a page to create a personalized KPI dashboard. We’ve taken customization a step further with a module that uses HTML to display text, images, videos, documents, or even web pages to meet your specific needs.

In this post, we’ll cover how to use the module to display a Google Calendar in your time tracking dashboard. You can watch the YouTube tutorial here if you’d like. An embedded Google Calendar is not only easy to implement but useful for administrators and employees alike. However, it’s just one of countless possible uses for this module. In upcoming posts, we’ll be sharing more ideas and ready-to-use HTML templates based on your feedback. Let us know how you’d like to use the module to help with your employee time tracking.

What our custom module means for your business management

Because it supports HTML, Beebole’s custom module can be practically anything you want it to be, static or dynamic. Add the module to any person, company, or project page to share valuable information with your team. For instance, a custom module on an employee’s page could feature personalized updates from HR, relevant trainings and seminars, or display remaining vacation days. Just to mention a few ideas.

You can also program the company page or homepage to show a Getting Started guide, company time tracking policies, or a weekly newsletter. Embed external documents or pages and update with important notices or company announcements. What’s more, you can display elements of CRM or PM tools on a relevant client or project page.

Use our custom module to communicate or collaborate with other teams or clients by embedding resource planning, expense reports, feedback, requests or any other documents. For example, a project manager or client can update documents directly, which are then retrieved by the module.

Embedding a Google Calendar in your time tracking dashboard

To test out the custom module, embedding a Google Calendar in your Beebole dashboard is a great place to start. You can place a calendar beside your timesheet on the Beebole homepage and easily cross-reference scheduled tasks, meetings, absences, and more when entering time. If your employees and contractors are tracking time on a weekly basis, they can position their calendar beside their timesheet and also set it to a weekly view. Watch or read on to learn how to embed your Google Calendar.

There's more where that came from.Don’t miss a single video.Subscribe

The steps to embed Google Calendar in your Beebole dashboard:

1. Open Google Calendar and click Settings on the top right. On the left side of the screen, select the calendar you want to embed. Then, select Integrate Calendar from the drop-down options that appear. Select and copy the Embed code, which will begin with “iframe”.
2. If you want to personalize the size, colors, format, and other features of your calendar, first click on the Customize button below the embed code. Once you’ve customized your calendar using the options in the left-hand menu, copy the new embed code that appears at the top of the screen.
3. Next, go to the page of your Beebole account where you want the calendar to appear. Select Customize in the top right-hand corner, and locate Custom Module among the various module options that appear. Click, drag, and drop the module anywhere on the page.
4. Paste the copied embed URL in the iframe URL box. You can also enter a name for the calendar in the Title box. The calendar should automatically appear below. If an error message appears, ensure that you are logged into the associated Google account on the same browser or set your calendar to public under Calendar Settings. Finally, click Close.
5. Click and drag the tab at the bottom of the module to adjust its size if necessary. You can also move the calendar anywhere on your screen, modify the date range, and select a weekly or monthly view, among other options.

Getting the most from the custom module

Google Calendar can be easily integrated with copy and paste. However, if you are unfamiliar with HTML, you might be unsure how to further capitalize on this feature. That’s why we’ll be sharing some basic, ready-to-use templates that you can simply copy and paste into your dashboard. Stay tuned to the blog for more, and please let us know what types of templates you’d like to see.

In the meantime, if you are familiar with HTML, the custom module’s possibilities are endless. In fact, don’t miss this post on how to make video part of your internal communication strategy. You can read more about the dynamic values available for the module in our help documentation. Or, as always, shoot us any questions via our in-app chat.

—

Photo by @morganvongunten on Unsplash

Facebook

Twitter

Linkedin

Whatsapp

Reddit

Telegram

Helen Poliquin

Managing Inbound and Customer Success at Beebole. Connecting with teams and managers worldwide, identifying their obstacles, and communicating the creative solutions that Beebole can offer. Working remote from the Canary Islands.