ClockAura

How to Embed a Timer in Google Sites

In Google Sites, choose Insert → Embed, open the "Embed code" tab, paste the iframe code from the ClockAura Embed Builder, click Next and then Insert. Drag the box corners until the whole timer is visible, then publish.

Steps

  1. Open the Embed Builder, set up the timer and click Copy code on the Iframe tab.
  2. Open your site in Google Sites and go to the page you want.
  3. In the right-hand panel, under Insert, click Embed.
  4. Choose the Embed code tab (not "By URL"), paste the code and click Next.
  5. Check the preview and click Insert.
  6. Drag the corners of the embed box so nothing is cut off, then click Publish.

Example iframe code for Google Sites

<div style="max-width:420px;margin:0 auto"><iframe src="https://clockaura.com/widget.html?type=timer&amp;m=10&amp;label=Work+time" title="Work time – Timer" width="100%" height="260" style="display:block;border:0;border-radius:16px" loading="lazy" allow="fullscreen"></iframe><p style="margin:6px 0 0;text-align:center;font:13px/1.4 system-ui,sans-serif"><a href="https://clockaura.com/10-minute-timer">Timer by ClockAura</a></p></div>

Make your own version (type, time, colours, size) in the Embed Builder.

Getting the size right

Google Sites shows embeds in a box you resize by hand. If the Start button is hidden, the box is too short: drag the bottom edge down. A 10-minute timer needs about 260 pixels of height; a date countdown about 240.

Sites lays the page out for phones automatically. The ClockAura widget scales its digits to the box, so one embed works on a classroom projector and a student phone.

Ideas for school sites

  • A 10-minute "work time" timer on a station-rotation page.
  • A countdown to exam day, the school trip or the end of term on the class homepage.
  • A Pomodoro timer (25/5) on a study-skills page for older students.
  • A clock set to another time zone on a pen-pal or language-exchange page.

Why use the Iframe code here

Google Sites runs pasted code inside its own sandboxed frame. The Iframe code is the simplest thing to put there and needs no script. The small credit link under the timer stays in the code you paste.

Questions about Google Sites

Can students use the timer without a Google account?

Yes. The timer has no sign-in. Anyone who can see your Google Site can start, pause and reset it.

Why does my embedded timer look cut off in Google Sites?

The embed box is smaller than the timer. Click the embed and drag its bottom edge down until the buttons show.

Does the timer play a sound in Google Sites?

Yes, an alarm beeps when time is up, as long as the visitor pressed Start (browsers only allow sound after a click). You can turn the sound off in the builder.

Other platforms