← All widgetsWidget 217 · emcp_custom_217

World Clock

Elementor widget8 layouts13 content options23 style options3 panel sections

Built with the EMCP Widget Builder and registered under the EMCP Custom category of the Elementor panel. Search the panel for: clock, time, timezone, world, analog, digital, office hours.

Setup guide

  1. Open a page in Elementor, search the panel for World Clock and drag it into a container.
  2. Content › Clocks: Clocks, Clock Style, Layout, Columns, 12-hour Format, Show Seconds, Show Date, Show UTC Offset and 5 more.
  3. Pick a Clock Style: Analog, Digital, Analog + digital, Digital, flip-board look, Minimal text row. Each one is shown below.
  4. Style tab sections: Card, Text. Colours, typography and spacing set here are scoped to this widget instance.
  5. Publish. Every option is a standard Elementor control, so it responds to the editor, dynamic tags and global styles as usual.
Ships with its own JavaScript; it runs once per instance and re-initialises inside the Elementor editor preview.
Layout

Analog

Clock Style = analog

London
Head office
New York
Sales
Lahore
Engineering
Sydney
Support
Layout

Digital

Clock Style = digital

London
Head office
New York
Sales
Lahore
Engineering
Sydney
Support
Layout

Analog + digital

Clock Style = both

London
Head office
New York
Sales
Lahore
Engineering
Sydney
Support
Layout

Digital, flip-board look

Clock Style = flip

Tokyo
Partner
Berlin
Studio
Layout

Minimal text row

Clock Style = minimal

London
Head office
New York
Sales
Lahore
Engineering
Sydney
Support
Layout

Grid of cards

Layout = grid

London
Head office
New York
Sales
Lahore
Engineering
Sydney
Support
Layout

Single row

Layout = row

London
Head office
New York
Sales
Lahore
Engineering
Sydney
Support
Layout

Vertical list

Layout = list

London
Head office
New York
Sales
Lahore
Engineering
Sydney
Support

Options reference

Every control the widget exposes, grouped by panel section. Names in code are the setting keys used by the MCP tools (add-free-widget, update-widget).

Content tab

Clocks

OptionTypeChoices / rangeDefaultNotes
Clocks
clocks		Repeater4 items
↳ Label
label		TextLondon
↳ Time Zone (IANA)
tz		TextEurope/London
↳ Sub-label
sub		Text
↳ Open Hours (HH:MM-HH:MM, optional)
open		Text
↳ Accent Override
accent		Color
Clock Style
style		DropdownAnalog, Digital, Analog + digital, Digital, flip-board look, Minimal text rowanalog
Layout
layout		DropdownGrid of cards, Single row, Vertical listgrid
Columns
columns		Dropdown1, 2, 3, 4, 64Responsive
12-hour Format
hour12		Toggleon / off
Show Seconds
seconds		Toggleon / offyes
Show Date
show_date		Toggleon / offyes
Show UTC Offset
show_offset		Toggleon / off
Show Difference From Visitor
show_diff		Toggleon / off
Show Open / Closed Badge
show_status		Toggleon / offyes
Day / Night Tint
day_night		Toggleon / offyes
Smooth Second Hand
smooth		Toggleon / off
Analog Face
numerals		DropdownTick marks, Numbers, Plainticks

Style tab

Card

OptionTypeChoices / rangeDefaultNotes
Accent
accent		Color#6a11cb
Background
card_bg		Color#ffffff
Night Background
night_bg		Color#101828
Padding
card_pad		Dimensions
Border
card_border		Border
Radius
card_radius		Slidermin 0, max 60, px16
Shadow
card_shadow		Box shadow
Gap
gap		Slidermin 0, max 60, px20
Analog Size
face_size		Slidermin 60, max 300, px120
Face Background
face_bg		Color#f8fafc
Hands Color
hand_color		Color#101828

Text

OptionTypeChoices / rangeDefaultNotes
Label Typography
label_typo		Typography
Label Color
label_color		Color#101828
Digital Time Typography
time_typo		Typography
Digital Time Color
time_color		Color
Meta Typography
meta_typo		Typography
Meta Color
meta_color		Color#667085
Open Badge
open_bg		Color#dcfae6
Closed Badge
closed_bg		Color#fee4e2
Flip Tile Background
flip_bg		Color#101828
Flip Tile Color
flip_color		Color#ffffff
Flip Tile Background (night)
flip_bg_night		Color#ffffff
Flip Tile Color (night)
flip_color_night		Color#101828

Add it with the MCP tools

Any connected agent can place this widget: call add-free-widget with widget_type: "emcp_custom_217" and a settings object using the keys above. Run get-custom-widget with id 217 for the full JSON spec.