Skip to content
Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive
Share your own project

Click map generator

By Martin Jacobsen

Using previews in Sanity to automate generating simple click maps.

Editing environment

Labels attach to the element with the corresponding ID, but can be dragged to a more convenient position

About the project

This project takes advantage of Sanity's excellent support for custom preview components to load the entire document of an email newsletter into the studio preview pane and traverse its DOM to attach labels with click stats to their corresponding elements.

The user enters a URL to the web version of the email, and enters CSV data from our analytics tool and is then able to do some basic editing like moving labels and editing their colors and size, or indeed make corrections to their value, before generating the final graphic which is used in our reports to our clients.

This is the first iteration of our "reportbot" as it is lovingly referred to internally, and is saving us a bunch of time not having to create these graphics manually.

Contributor

Other projects by author