This article will explain how to create a Time Tracker widget and embed it in your notion page.
Displays Time Tracker widget
Click on the "Create +" button in the menu to view all available widgets
Use the filter option to narrow down the widget list by selecting "Productivity"
Select the "Time Tracker Widget" card
Time Tracker card
The customization page will load, allowing you to personalize your widget to fit your needs.
Configure time tracker widget
Here are all setting to configure your time tracker widget:
PropertyDescription | |
Title | Set a custom name for your widget that best represents its purpose |
Show Title | Toggle the visibility of the widget's title on or off |
Show Icon | Choose whether to display an icon alongside the widget title for quick identification |
Projects | The project list is prefilled with example projects by default. You can add new projects, remove existing ones, or rename them to better suit your needs. |
You can create new projects directly within the widget at any time. To delete a project, however, you need to go to the Notion Widgets app. To add a new project in the widget, just type in the new project name, and a prompt will appear confirming the creation of the new project.
Creation of a new project
In this step, you have the flexibility to style your widget and make it uniquely yours. Tailor its appearance and functionality to fit your preferences and needs.
You can customize the following properties:
PropertyDescription | |
Background Color | Set background color for the widget |
Font Color | Set font color for titles and Icons |
Button Styles | |
Button Color | Set color of the buttons: start and stop |
Icon Color | Set icon color for the icons on start and stop button |
Counter Style | |
Counter Color | Set the text color for the counter displaying the time spent, ensuring it stands out or matches your overall widget design |
Counter Font Size | Choose the font size for the counter displaying time spent. Options include Small (S), Medium (M), Large (L), and Extra Large (XL) to best fit your widget layout and visibility needs |
Before you start using your time tracker widget, you'll need to set where all tracked times will be stored. Select the Notion page where the database should be created. You can search for your desired page by typing its name; a minimum of 3 characters is required to initiate the search within your Notion account.
Notion database tab
Currently, only new database creation is supported. Weโre working on a feature that will allow you to connect to and use an existing database soon.
Definition of each property:
PropertyDescription | |
Select Notion page | Search your Notion page where the database should be created |
Name of the database | We'll create a new database under your selected Notion page. You can set a custom name for this database, making it easy to locate on your Notion page and view all reported times |
Once you have customized your Time Tracker widget, you can click on the create Widget so that the widget will be created.
succesful created widget
After successfully creating your widget, you can copy the link and add it to your page in Notion.