The Benefits of Craft CMS: Using the Matrix Block to Cre­ate a ​Con­tent Builder

Craft is an off-the-shelf CMS for building custom websites. It is powerful, flexible and allows you to customise a website however you want.

09 June, 2021
Screen Shot 2019 02 07 at 4 04 16 pm
(Source: Inlight)


Craft CMS is an off-the-shelf Content Management System (CMS) for building custom websites. It is powerful, flexible and allows you to customise a website however you want. Using the Matrix block to create a content builder, designers can be as creative as they like, and clients can edit their content easily.

Clients need a user-friendly platform to manage and change the content on their website. Somewhere they can log in to, type a bit of test into fields, add a few images if they please, and click save without having to see the backbones of the website and overwhelming code – which is where Craft CMS comes in.

We’ve talked about why we switched to Headless Commerce with Craft CMS, and one of the overriding reasons is the Matrix blocks creating a content builder.


The 3 Basics of Craft CMS

Let’s start with the easy stuff Craft CMS is good at. As it is a CMS, you can add and edit pages with ease. Craft calls these pages 'Entries'. You can create several entries and aren't limited to just a few.

Craft CMS also comes with its own Image Editor, perfect for presenting images the way you want.

The significant benefit of Craft CMS is the Matrix field, making it possible for endless creativity and freedom and easy for clients to use themselves.


Entries

(Source: Do Good Things)


Different entry types can be set up, from general to blogs to recipes – helping to keep everything organised. Entries can contain various fields for the client to add content into. Craft CMS’ basic fields include:

  • Assets (images and files)

  • Categories

  • Colour Picker

  • Date/Time

  • Entries

  • Matrix

  • Plain Text

  • Rich Text

  • Table

  • Tags


You can create a large variety of fields and use them across all entry types.


Image Editor

(Source: Do Good Things)


Craft CMS comes with its own Image Editor, perfect for resizing, rotating, flipping and cropping your images before they’re shown on your website.

A valuable feature of the editor is called the ‘Focal Point’. It allows you to set the main focus point and where the website should look in the image. No matter the screen size or device, this feature ensures that the most important part of the images is always on show.


Matrix

(Source: MadeByShape)


The dominating benefit of Craft CMS is the Matrix block – it makes it possible for designers to be as creative as they like with the structure of pages and content. It’s possible to build flexibility into pages, split up content in a design into different blocks, and order these blocks how you like.

The Matrix block is one of the most powerful features of Craft CMS. It enables developers to create reusable blocks or fields that can make up complicated page layouts.

The beauty of this feature is that it allows you to differentiate every page and make it engaging. Instead of being stuck with the same format of ‘Hero, Image, Text’, you can customise it.


Using the Matrix Block to Create a Content Builder

When a website is created, a graphic designer will often produce the look while a front-end developer implements it. There are other roles in the mix, like people who do the marketing and SEO, but that’s the basic flow.

The missing element from the equation is the client. The website is essentially an empty shelf without the content from the client. As a basis, the client needs to be able to create, modify and update content to suit their needs – that’s the entire point of using a CMS, to begin with.

Typically, the Rich Text field has been used to enable the client to enter the formatted text and images how they want them to appear on the page. But in the end, that isn’t the best content experience, as the client could end up messing up the structure of things.


The content builder

(Source: Inlight)


A great example of a content build with the Matrix block is categorising each block to format a specific type of content.

The latest Craft CMS updates give you the ability to change the layout of your fields within the Matrix field – helping things look neater, saving page space, and overall providing a better user experience.

Before using Matrix blocks to create a content builder for your next project, you need to plan out the blocks you want to use. For example, this could include:

  • Rich Text blocks, including formatting controls, optional titles and more

  • Image blocks, with the option of different types of images

  • Quote blocks, if you want to present quotes or ideas differently and to break up the design

  • Code blocks, with the opportunity for presenting different code


Creating the content builder

(Source: Do Good Things)


Once you have an idea of the blocks you’ll need for your project, you can group the blocks into different categories, and within each category, different block types can be formatted to a type of content. For example, under ‘Text’, you could have:

  • Text Boxes

  • Text Columns

  • Text, List and Image


Even with just different blocks, you can mix up how the content is laid out on a page. Overall, the Matrix blocks are critical in enabling flexibility and customisation for both you and your client.

You can read more about the technical side on Craft CMS’ website.


The Overview of Using Craft CMS’ Matrix Blocks

All in all, you want a user-friendly platform, a place where you and your developers have endless creative opportunities and a place where your clients can too. Without wanting to overwhelm your clients with the backbones of their website and code, you also want to limit any potential issues.

With Craft CMS, the Matrix blocks enable you to create a content builder customised to your wants and needs. While we’ve touched on the basics concerning content creation, there are plenty more benefits of using Craft CMS, such as increased page load speed, and more which you’ll discover as you use it.