Creating Custom Content Blocks: WordPress Gutenberg vs Sanity.io

This article compares creating custom content blocks in WordPress Gutenberg versus Sanity.io. It was written back in 2018 when Gutenberg was first launching with WordPress 5.0. Let me break down what it demonstrates:

The Comparison

The article shows how to recreate a "testimonial slider" block - a common marketing component that displays rotating customer testimonials. In the Smashing Magazine tutorial referenced, this took a 12-minute read across 10 parts to implement in Gutenberg.

In Sanity, the author demonstrates it takes significantly less code - essentially just defining the content model:

const testimonialSlider = {
  name: 'testimonialSlider',
  title: 'Testimonial slider',
  type: 'object',
  fields: [
    {
      name: 'slider',
      title: 'Slider',
      type: 'array',
      of: [{
        type: 'object',
        fields: [
          { name: 'author', type: 'string' },
          { name: 'image', type: 'image' },
          { name: 'content', type: 'text' },
          { name: 'link', type: 'url' }
        ]
      }]
    }
  ]
}

Once you define this schema, Sanity automatically generates the UI, handles data storage, and provides a real-time API.

Key Advantages Highlighted

Portable Text vs HTML: The article emphasizes that Sanity stores content as Portable Text rather than HTML. This makes your content truly portable - you can query it, transform it, and render it in any frontend framework or platform, not just web browsers.

Structured Content: Your testimonials are deeply typed, queryable data structures rather than presentation-locked HTML blocks. You can use GROQ queries to fetch and transform the content however you need.

Headless Flexibility: While WordPress renders your website, Sanity is a headless CMS that lets you use the content anywhere - React, Vue, mobile apps, or multiple frontends simultaneously.

Custom Previews: The article also shows how you can add custom React preview components with just a few lines of code to visualize your content blocks in the editor.

This is a great example of why Sanity is excellent for structured content authoring - you define what the content is (testimonials with authors, images, and quotes), not how it looks, giving you maximum flexibility in how you present that content across different platforms and contexts.