This web part provides you the ability to display basic clock for a given time zone on a web page. The clock is based on the user's workstation time with an offset from UTC to the selected time zone.
- Place the page you want to add this web part to in edit mode.
- Search for and insert the World Time web part.
- Configure the web part to update its properties.
The World Time
web part can be configured with the following properties:
Label | Property | Type | Required | Description |
---|---|---|---|---|
Description | description | string | no | Default: UTC Time - The clock description |
Time Zone | timeZoneOffset | number | no | Default: 0 - The clock offset where 0 = UTC, -8 = PST (UTC−08:00), etc |
See getting started from SP-Starter-Kit repository readme.
You can also download just the SharePoint Framework solution package (spppkg) file and install that to your tenant.
- Supported in SharePoint Online
none
Solution | Author(s) |
---|---|
react-world-clock | Dragan Panjkov (@panjkov) |
react-world-clock | Chandani Prajapati (@Chandani_SPD) |
Version | Date | Comments |
---|---|---|
1.0 | January 5, 2020 | Initial release (extract web part from Starter Kit v1) |
3.0 | February 2023 | Initial release for SharePoint Starter Kit v3 (Upgraded to SPFx 1.16.1) |
THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.
- Clone this repository
- Move to solution folder
- in the command line run:
npm install
gulp serve
Include any additional steps as needed.
Description of the web part with possible additional details than in short summary. This Web Part illustrates the following concepts on top of the SharePoint Framework:
- Use of SVG and CSS rotation to display a ticking clock