Tom Stothard Whitaker

17th Feb 2023

The Kitchen Sink

Welcome to the Kitchen sink post!

Cover image

This post is to show all. the different components that we have the ability to use directly in the document editor of Keystatic.

If you want to play around with these in the editor head over to this post in the Keystatic admin pannel.

If you want to see how they're setup take a look at the keystatic.tsx file and look at the componentBlocks of the Posts collection.

Twitter Embed

YouTube Embed

Banner

Inline CTA

Image (with caption)

This is a more styled version of just using a markdown image syntax including alt text and caption

Thinkmill Cover image

Oh wow what a nice caption

Looping Video

This is running a .mov file in the style of a looping gif. Running the component this way we get to keep up the performance benefits of using a video file over a gif.

An example of SSR vs PSSR from another article on the Thinkmill website

Oh wow look we also have a testimonial component.

Tom Stothard Whitaker

Developer @ Thinkmill