World Clock Widget User Guide 1.2.0
The Worlds Clock Widget is included in the EdgePack for Igloo
About the World Clock Widget
The World Clock widget for Igloo is an easy-to-use custom widget that makes it effortless to schedule your appointments if you know what time it is. Users can create multiple different world clocks within different time zones.
Key features:
Create up to 6 different World Clock Time Zones
Choose Analog or Digital Displays
Change the Layout and Appearance of text and display
Add a Location Name for each Clock
Setup and Configuration
Add the Widget
To start, Add the Integration Widget to your page:
Edit Page
Scroll through the Add Widgets to locate the “Integrations” widget (pictured below)
Click and Hold down your right mouse button and drag the “Integrations Icon” onto your page
NOTE: This widget is available in: Full width, Two-column wide, Three-column wide, Narrow column
Next, Add “Social Edge World Clock Widget”
In the Integration Library dropdown Select Igloo Marketplace Library (Igloo Integration Library)
Select, Social Edge World Clock Widget
Proceed to Section 2. Configuring the World Clock Widget below
Configuring the Widget
Click “Edit” in the widget black bar (pictured below)
Add the “Title” to be displayed above the widget
NOTE: Click Translations to add a French Translation for the Title (optional).Add a “Title Link”
Add a short “Description”
NOTE: Descriptions do not display to the end user.
NOTE: Click Translations to add a French Translation for the Description (optional).
NOTE: Buttons for Translations are surrounded by a yellow square.
Analog Display Settings
Select Clock Style: Choose a style of clock to display: Analog Classic, Analog Shadow, Analog Sports Display, Digital Classic, Digital Seconds Display, Digital Classic Inline. To view the other types of clock styles, simply click the dropdown arrow next to “Clock Style” as pictured below. (Clock Styles Pictured Below)
Analog Classic
Analog Sports Watch
Analog Shadow
Digital Classic Inline
Digital Seconds Displayed
Digital Classic
Analog Face Color- add the Color of the clock's face (this will be applied to all time zones selected. To get certain colors along with their codes use this link: Color Hex Color Codes
Clock Elements Style - changes the clock hands, tick marks, and second hand to black or white. To change the element style, simply click the drop down arrow to the right of the word “Black”
Border - Enable a border around the clock. Simply check off the enable box to create a border, as pictured below
Border Color - changes the color of the clock's second hand
Add up to 6 World Clock Time Zones (“ex. GMT-5 US/Eastern, GMT+3 Europe/Kiev ”). An example is pictured below.
Add a Display Name for the city/country
Add the color of the text of in a hex #. Find numbers easily here: Color Hex Color Codes
Digital Display Settings
Users can choose to either display a clock with 24 hours or a clock with twelve hours. To access this option simply click on the dropdown arrow next to “Digital Options” as pictured below. To display 24 hours instead of the default 12 hours, simply click on the Enable box underneath this drop down menu.
To adjust the Font Style, click into the dropdown and choose from Roboto, IBM Plex Mono, Exo and Orbitron.
Best Practices and Tips
Best Practice/Tip | How To… |
Add names to clocks to differentiate time zones. | Click on the drop down arrow for that specific clock and for Time Zone Display Name type the name of the time zone area (ex: New York Headquarters, London, Etc). |
Clock Displays in Wide vs. Narrow Columns | In wider columns, clocks will display side by side for filtering. In narrow columns they will stack. |
Customize Your Clocks with Different Colors | Using the different colors for your clocks will help to make your clocks stand out as well as fit in with the brand image. To get the hex codes needed for each color visit this website: Find the color that you want and then copy it and paste it in the color box listed under that specific world clock. |
Support
Need support or want to talk to us? Please send an email to:
View the Different Clock Displays Here: List of Clock Displays