Pomodoro Widget

Create Your Own Pomodoro Widget in Seconds for Your Website

Build a focused work timer with Pomodoro, short break, and long break modes. Customize durations, labels, sequence behavior, built-in or MP3 alarms, styling, and responsive display in a no-code builder.

Create Your Pomodoro Widget - It's Free!
Create Your Own Pomodoro Widget in Seconds for Your Website Hero Bg Image

How to embed Pomodoro Widget to WordPress

1Get your embed code

After customizing your Jform website widget, click Try it on your website for free, and copy the generated embed code.

2Open the page editor

Go to the WordPress post or page where you want to display the widget, then add a new block.

3Add a Custom HTML block

Select Custom HTML and paste your Jform Website widget embed code into the HTML field.

4Update and view

Click Update or Publish, then open the page to check your embedded widget.

더 알아보기

Customize Focus and Break Durations

Set the length of each Pomodoro, short break, and long break. Edit the mode labels so the timer matches your class, team, coaching program, or productivity workflow.

Timer controls include:

Pomodoro secondsShort breaksLong breaksEditable labelsRestart button
Create Your Widget
Customize Focus and Break Durations

Run Automatic Pomodoro Sequences

Let the widget move visitors from focus sessions to short breaks and show a long break after a configurable number of Pomodoros.

Sequence settings include:

Auto-advanceLong break intervalBreak remindersManual mode switch
Set the Sequence
Run Automatic Pomodoro Sequences

Use Simple Controls and Completion Sounds

Visitors can start, pause, restart, and switch timer modes. Add a completion tone, upload a short MP3 alarm, adjust volume, or mute alarms for quieter pages.

Control settings include:

Start일시정지재시작Alarm toneCustom MP3Volume
Customize Controls
Use Simple Controls and Completion Sounds

Design a Timer That Matches Your Website

Choose a design style and preset theme, or customize colors, text sizes, card shape, spacing, shadows, branding, and scoped custom CSS.

Style controls include:

Theme presetsDesign stylesCustom colorsText sizesCard layout맞춤설정 CSS
Style Your Timer
Design a Timer That Matches Your Website