Jigsaw

Updated by Darryl Waterhouse on 3 November 2026 8 min read

Put jigsaws on your website. Choose any picture in your Media, say how many pieces, and it is cut into a jigsaw for you. Visitors race the clock to put it together and top the leaderboard. Jigsaw is a Pro Tool, and can be gifted to a site.

What it does

Any picture in Media becomes a jigsaw: PNG, JPEG, WebP, GIF or AVIF. Upload a new one straight from the picture chooser.
How many pieces: Easy (about 16), Medium (about 36) or Hard (about 81), with the rows and columns worked out from the picture's shape so the pieces come out nearly square. Or choose the rows and columns yourself, anything from 3 × 3 to 12 × 12.
Piece shape: Classic pieces with tabs and blanks, or Square pieces. Not happy with the classic cuts? New cuts cuts the same picture another way.
Turned pieces (optional): pieces arrive turned by a quarter, a half or three quarters, and players turn them back. Much harder.
A faint copy of the picture on the board (on unless you switch it off), as on the lid of a box. Off, the board is blank.
A live preview in the editor shows the picture with its cuts, so what you see is what players get.
Timing kept by the server, from the moment the jigsaw is started to the moment the last piece goes in.
Wrong pieces just go back to the tray. If you like, each one can also add a few seconds to the time.
Leaderboards of the fastest finishers for today, this week, this month and all time, best go per name.
Hints if you want them: each puts one piece in its place, and adds seconds to the time.
Optional overall time limit, opening and closing times, and a limit on goes per name.
Personal best on the finished screen, and a Share button.
Works on phones: the board shrinks to fit, and pieces can be dragged with a finger or tapped into place. There is a Full screen button too.
Which piece goes where never reaches the visitor's browser until that piece is in its place. Every go gets the pieces in a different order.

Getting started

Switch Jigsaw on in Tools.
Open Tools > Games > Jigsaw and choose New jigsaw.
Give it a title and press Choose a picture…. Pick a picture from Media, or drop a new one in to upload it.
Choose the pieces and the shape. The preview shows the cuts.
Press Test and play it yourself (see below).
Set the status to Open and save.
Put it on any page:

[jigsaw id="harbour" /]

A good jigsaw picture has plenty going on: different colours and shapes in different places. Big areas of plain sky or sea make pieces that all look alike (fine if you want it hard).

Every setting

The jigsaw

Title - shown above the game and on the leaderboard.
Short name - used in the shortcode (id="..."). Made from the title when you leave it empty.
Status - Draft (not shown anywhere), Open (can be played; needs a picture) or Closed (shows its leaderboard, cannot be played). Test works whatever the status.
Introduction - shown on the start screen.
Opens and Closes - optional dates and times. Before it opens, visitors see "This jigsaw opens soon"; after it closes, "This jigsaw has closed".

The picture

Choose a picture… - any picture in Media.
Describe the picture - read out to people who cannot see it, on the start screen.
Pieces - Easy, Medium, Hard or Choose rows and columns (3 to 12 each).
Piece shape - Classic (tabs and blanks) or Square.
Pieces arrive turned round - off unless you switch it on. A piece only goes in the right way up.
A faint copy of the picture on the board - on unless you switch it off.
New cuts (above the preview) - the same picture cut with different tabs and blanks.

Rules and leaderboard

Time limit (minutes) - 0 for none. A player who runs out of time is not on the leaderboard.
Seconds added for a piece in the wrong place - 0 (the default) for none: a wrong piece simply goes back to the tray.
Goes each (per name) - 0 for as many as they like.
Leaderboard size - how many names it shows (3 to 100).
Leaderboard opens on - the period the leaderboard shows first: today, this week, this month or all time. Players can still switch.
Show a leaderboard - on unless you switch it off.
Animations - on unless you switch it off (see below).

Hints

Players can ask for hints - off unless you switch it on.
Hints a game - 1 to 10 (3 unless you change it).
Seconds added for each hint - 30 unless you change it.

Settings for new jigsaws

The cog at the top of Jigsaw opens its settings: the pieces, shape, time limit, wrong-piece seconds, leaderboard size, turned pieces, faint copy, hints and leaderboard that a new jigsaw starts with. Each jigsaw keeps its own settings once made, so changing these never changes a jigsaw you have already made.

Playing

Drag a piece from the tray onto its place on the board and let go. If it belongs there it snaps in; if not, it goes back to the tray.
Or tap a piece to choose it, then tap its place on the board.
Turned pieces: tap the chosen piece again to turn it a quarter turn, or press Turn.
With a keyboard: Tab to a piece, the arrow keys choose a place on the board, Enter puts the piece there, R turns it (Shift+R the other way), Escape lets go.
Full screen gives the jigsaw the whole screen (where the browser allows it).

The bar shows how many pieces are in ("23 / 36"), the time so far, any time added, and the time left when there is a limit. If the page is reloaded, the pieces already placed come back (the clock does not stop).

To stop people trying every piece in every place, a go is held to 20 tries per piece. Nobody playing normally comes near it.

Testing a jigsaw

Test (in the editor, on each jigsaw in the list, and on its Plays screen) opens the jigsaw right there in the admin, exactly as your players will see it.

It plays the version you last saved. With unsaved changes the button says Save and test, and saves first.
It works whatever the status, so you can try a draft before anyone can see it.
A test go is never saved to the leaderboard. It is not in the Plays list, it does not count towards the goes each name is allowed, and it does not raise a notification. When you finish, it tells you where you would have come.
Each new test clears away the one before.

Leaderboards

The leaderboard shows below the game. The board setting on the shortcode changes that:

[jigsaw id="harbour" board="hide" /]    the game only
[jigsaw id="harbour" board="only" /]    the leaderboard only

A leaderboard on its own, anywhere:

[jigsaw-leaderboard id="harbour" period="week" limit="10" title="Fastest finishers" /]

Leave out period to use the jigsaw's own Leaderboard opens on. The fastest time wins, with any added seconds included. Anyone who used hints has a small H with the number beside their name.

Hints

A hint puts one piece (chosen at random) in its place. Each one adds its seconds to the player's time, so a clean finish still beats one with hints. The finished screen says how many were used; so does the Plays screen, beside the name.

Animations

Pieces pop into the tray when a game starts, snap into place with a little pop, and a wrong piece gives a shake; the finished picture fades in whole. Switch Animations off to have none. Visitors who asked for less motion - in their device settings, or with the site's motion switch - never see them either way. They never slow the game down: the clock is the server's.

When a game is over

The finished screen shows the time, the place on the leaderboard, and the player's personal best under that name ("New personal best!" when this was it). Share copies a line to paste anywhere - the jigsaw's name, the pieces and the time.

Changing a jigsaw people are playing

Change the picture, the pieces, the shape, the cuts or turned pieces of an open jigsaw and anyone part-way through it has to start again (their pieces no longer fit). Finished plays and the leaderboard are kept. Change the title, introduction or rules as you like.

If a picture goes from Media

If the picture of an open jigsaw is deleted from Media, nobody can start it. You get a notice (Jigsaw picture missing) the first time someone tries, and the Jigsaw count in the sidebar shows it. Upload the picture again with the same name, or choose another picture and save.

Looking after the board

Open a jigsaw's Plays to see every go (your own test goes are not shown). You can hide a play from the leaderboard, delete it, or reset the leaderboard.

Moving jigsaws between sites

Export a jigsaw from its menu in the list (right-click it, or ⋮), or from the download button at the top of its editor. Export all at the top of the list puts every jigsaw in one file. The file holds the settings and the picture's Media address (for example /media/harbour.jpg) - not the picture itself, and never who played.

Import… at the top of the list adds the jigsaws in such a file to this site:

Each arrives as a draft. Test it, then set it to Open.
The picture is looked for in this site's Media under the same name. If it is not there, the jigsaw still arrives, and you are told: upload the picture to Media with the same name, or choose another picture, before opening it.
Nothing already here is changed. A jigsaw whose short name is taken gets one of its own (harbour-2), so check the shortcode before putting it on a page.
Importing the same file twice makes copies. One that is not valid is skipped, and the message says which and why.
Up to 50 jigsaws at a time.

Notifications

Jigsaw fastest finishes - someone has finished a jigsaw faster than anyone before.
Jigsaw picture missing - someone tried to start an open jigsaw whose picture is no longer in Media.

Switch either off, or send it to more people, in Notifications' settings.

Who can do what

The Jigsaw permission has two parts: See (open Jigsaw and see the jigsaws, plays and leaderboards) and Manage (make, change and delete jigsaws, change the settings for new jigsaws, hide or remove plays, reset a leaderboard). Admins have both.