
How To Create A Content Builder In Craft CMS
It is easy to create a content builder in Craft CMS. You can choose and define different fields for different needs. For example, to create a simple article you’d need feature image, title text, body text, quotes, and other media.
Here’s your step-by-step guide to creating a content builder in Craft CMS.
For this, you’ll have to go in Craft CMS control panel & create a Matrix field type. You can then populate that field with the text, image, pull quote blocks. These blocks let you define the recurring structure of the content you’re going to post.
Create a matrix field with desired content blocks
Roses are red, Matrix is neat. Craft has tons of Blocks, which ones do you need?
Text Block
Rich text is better when it is used with some constraints. The text field in Craft does just that by providing you with only necessary formatting options.
Image Block
Images make the content comprehensible & if you want your content to be consumable then image blocks are a necessity.
Quote Block
This block can be used to highlight the crucial part of any information or for simply quoting your favourite author.
Code Block
Code block is not a necessity but if at some point you plan to upload some technical content on your website then addition of this block in the matrix will help.
The fields are created to define the content layout of the page. The sections are defined by what fields are they going to have. You just have to include the created fields in the desired section.
Go to settings and drop the blocks of fields inside the section/page for which you defined the content layout for.
Tweak the template for content variables
Tetris is fun, but it ends here. Templating is also fun, but only trickier.
For every block type you create in control panel, a twig template partial needs to be created to enable it. The names of the block types should be the same when you include it in the twig template partial.
Defining the content type in the Template
You will have to define the types of images that are going to be used in your content. These are commonly used images, you can add more according to your needs:
1. Normal Images
2. Full Width Images
3. Infographic Images
Defining Text Type
You can use a full fledged Rich text block if you want. But, if you need uniformity in your content then a constrained approach to Rich text block is the way to go. It gives you the absolute necessary editing options.
Additionally, you can always use plugins if you desire a particular look and feel.
Defining Quote Type
You can define the basic formatting of the quote and how it differs from the body text. And if you’re willing to go an extra mile, Typogriphy plugin helps a lot to make your quotes stand out.
Defining Code Type
You can decide how the code will look like with Twig. Codes are a crucial part of technical content and here in the template they can be formatted to look less complex.
After when you’re done with creating fields, adding it to the sections and defining the field variables in the template, edit your content with live preview. Open the control panel to make final changes if needed. Save the changes and proceed.
Your minimalistic Craft content builder is ready
Craft’s content builder is the result of their ‘Content First’ philosophy. It equips you with an impressive level of control over different fields of the content. It also eliminates your dependency on themed layouts which control what and how you can post.
We have been building websites for small to medium enterprises and are absolutely in love with Craft’s ‘Content First’ approach.
If you are looking for development partners who can help you with everything Craft, hit us up here!
By Evnisha Malani
About Galaxy Weblinks
We specialize in human-centric user experience design services to our clients across the globe. Our innovative ideas, creative designs, industry best practices, and processes help us improve user satisfaction and solve complex design problems. Contact us for a free consultation!Related Posts

Creating forms in React – The Right Way!
In the world of web development, there are several front-end frameworks. Angular, Vue, React and a few others have gained immense popularity over the last…
Frontend Web Website Development
Craft CMS: Building the frontend of a website using Twig and GraphQL
Craft is a mature and tested content management system. Airbnb, W3C, Netflix, PBS, Salesforce, Moz, and countless other brands switched to Craft CMS for redesigning…
CMS Frontend Website Development
GWL 2020 Wrapped: Top 10 Blogs You Must Read for App/Website Design & Development
At Galaxy Weblinks, we build high-performing software solutions that help teams scale. And write about it in the process. You may have spotted us on…
Best Practices Design Ecommerce Web
The Quest Of The Most Extraordinary CMS - WordPress vs Drupal vs Craft
This article is an assessment and comparison of the popular content management systems WordPress, Drupal, and Craft. We’ll dig into each CMS platform’s features, ease…
CMS
Why you should partner with a development agency?
As a creative agency, it is imperative for you that your product is developed exactly as you envisioned without countless iterations and unreasonable overheads. That…
App Developement Product Development Web Website Development
Migrating your Legacy Apps to Cloud
Cloud usage has increased by many folds over the past few years. Public clouds have become the goto choice of enterprises for enhanced scalability, disaster…
Backend Cloud Web
Atom vs Sublime: Which text editor to choose in 2020?
Developers use Text Editors, also known as code editors, for editing programming code. These editors basically contain features like quick navigation, syntax highlighting, automatic indenting,…
App Developement Web
Why it is better to partner with a Digital Agency than Freelancers?
Your business is growing and your team is doing their best to meet the tight deadlines and increased workload. You may be exploring the idea…
App Developement Web
Next JS or Electron | Which Way to Go?
When we talk of Next JS, server- side rendering is the first thing that comes to our mind. On the other hand, Electron JS provides…
Backend Web
5 ways to optimize your ecommerce website for Voice Search
Voice search is at its peak in popularity among millions of users. According to an OC&C Strategy Consultants market research, Voice Shopping is projected grow…
Ecommerce Web
A failproof Magento 2 migration plan
Editor’s note: If you are still wondering ‘Do I really need to upgrade to Magento 2’, we recommend reading our 5 reasons why you should…
Ecommerce Web
Is Hyper-Personalization the key to your E-commerce growth?
Hello (Inserts your First name), All of us have received emails/ sms notifications, social media ads, that are sharing offers and discounts on the products…
Ecommerce Web
WordPress 5.4 ‘Adderley’ | New features and improvements
The recently released WordPress 5.4 ‘Adderley’ update has got a lot to look forward to! Since this highly popular CMS ditched its classic editor for…
CMS Web
Maintenance chores to keep your WordPress site in good health
Today, websites are more than just a ‘set-it-and-forget-it’ proposition. They are marketing machines that help you get new customers and leads. You might be planning…
CMS
5G is not just an extension of 4G technology
Commercial 5G network is going live. Big carriers like Verizon, AT&T, Qualcomm, and SKT are building out their 5G networks. But, it’s going to take…
Others
Why it’s a bad idea to ignore older adults from your app demographics
Modern technology has two problems: Devices have too many integrated features and everything is smaller. A good implementation of more-than-what’s-necessary features can give some users…
App Developement Others Web
iOS 13 design | What’s changed and what remains?
Ever wondered why Apple allows only selected employees in its Industrial Design Studio? Surprisingly, it’s a part of their design concept and not a security…
Apple Web
Unboxing popular PWAs | Techniques used and impact
What is common between Pinterest, Tinder, Uber, Trivago, and Airbnb? All these companies experienced a surge in their product’s performance, user-engagement, and conversions by going…
Mobile PWA Web
Kotlin 1.3.50 | More than just a performance upgrade
Kotlin has emerged as both substitute and supplement to C++ and Java. In 2018, the language had over 96,000 repositories on GitHub and had already…
App Developement Galaxy Apps Others Web
Galaxy Weblinks Ranked Among Best Web Developers on Clutch
When you think of hotspots for tech, don’t zero in on Silicon Valley just yet. According to Expert Market, Boston is one of the top…
Galaxy Apps Internet Marketing Others Web
Product tour lessons from Disneyland | What keeps you asking for more?
The experience of Disneyland is always an awe-inspiring one. No matter how many miles you have walked, you are always up for another Pirates of…
Galaxy Apps Others Product Development Web
What are Google Play’s new mobile app requirements?
Google Play set out many criteria in their app guidelines that you need to follow. These changes may cause some issues as you try to…
Galaxy Apps Mobile Others Web
Turning remote collaboration challenges into opportunities with AR
Leading the AR revolution, industrial enterprises are experiencing improved ROI through AR-optimized supply chain. Enterprise sector is using AR across other functions such as product design…
AR Galaxy Apps Others Web
The flip side of Wellness apps
Contrary to popular belief wellness apps are not so wholesome after all. Apart from the flaw in fundamental definition of wellness, it also brings along…
Galaxy Apps Mobile Others Web Wellness Apps
The Bare Bones of Skeleton Screens
Losing customers to Slowpoke of a UI is a nightmare for any UX designer. What if there was a pseudo-catalyst that could make your UI…
Design Galaxy Apps Others UX Web
What is Code Readability?
You are a programmer when you write code. You are a brilliant programmer when you write readable code other programmers can understand and edit as…
Best Practices Web Website Development
All there’s to know about the new Swift UI 5.1 update
Apple in its annual WWDC made some game changing announcements like a new Mac Pro, an exclusive OS for iPad, iOS 13 release, new Apple…
Apple Galaxy Apps Others Web
Prototyping | Our playground for Idea Validation
Prototyping might slow down the design process but it fast tracks the entire product development process. Our team recently handled a successful app design for…
Design Design Process Galaxy Apps Others Web
You ARen’t collaborating remotely even if you are
Fun fact: Virtual reality was realized way before digital computing was even a thing. Virtual reality came into existence with an arcade size immersive machine…
AR Galaxy Apps Others Web
Galaxy Weblinks on Clutch 2019 List!
As Galaxy Weblinks says “Our first and most important job: to help our clients understand the totality of the technology landscape and conceive, design, implement,…
Company News Internet Marketing Updates Web
Making your UX more human with digital wellbeing
A wellbeing app called ‘Calm’ was recently valued at a sizeable billion dollars. This billion dollar app is a meditation app. It helps you disconnect…
Design Design Process Galaxy Apps Others Web
What Configuration management gets right spotting the wrongs?
At the time of an unsuccessful product deployment, you might ask yourself. “What went wrong with the product delivery?” The simple answer lies in configuration…
Galaxy Apps Others Product Development Web
Choosing the right QA tool for your organization
Selecting the right QA tool from a list of the most popular ones is difficult. Your operational scope defines your testing needs. Getting it right…
Galaxy Apps Others QA Web
How to conduct a mobile usability test?
It is important to know that there are more variables when it comes to recording mobile usability test. The technical set-up for this test is…
Galaxy Apps Mobile Others QA Web
Outsourcing QA | A Doomsday prepper’s guide to an apocalypse-ready webapp
You might be familiar with Murphy’s law which says ‘Anything that can go wrong, will go wrong’. Software isn’t immune to that. But that’s often…
Galaxy Apps Others QA Web
Scala v/s Java | Approach & performance overview
Scala is a derivative of Java, but comparisons can’t be avoided. These languages share similarities to some extent and differences too, but they are not…
Frontend Galaxy Apps Others Web
Mastering the Art of Data Driven Web Designing
The web traffic is constantly growing and designers struggle to create and maintain website which is optimized to reach the desired number of users with…
Design Galaxy Apps Others Web Web Design Website Development
Is WordPress 5.0 headed the Craft CMS way with Gutenberg?
When you look at the respective market share of both the CMSs, WordPress has a clear edge over Craft CMS with 81.9% market share to a…
CMS Galaxy Apps Others Web
Angular 7 upgrade | What will you miss if you ignore?
Angular 6, released earlier in May 2018 didn’t offer much improvements on the performance part. It was mainly focused on making Angular migration-friendly. Google dropped…
Frontend Galaxy Apps Others Web
Developing Custom Softwares, the Agile Way
The dynamic business environment with rapid technological changes have resulted in subsequent changes in customer requirements. They now look forward to options which have an…
Agile Galaxy Apps Management Web Design Website Development
Craft & its Plugins | A transforming workflow
We like to think of Craft CMS as a Transformer (one with BumbleBee as his friend) and plugins as its Jet Pack. And every time…
CMS Galaxy Apps Others Web
How we use Zeplin for an Agile workflow
Earlier when our designers completed the wireframe of a project, they worried about the design handoff and the tedious specification work that came with it.…
Design Design Tool Galaxy Apps Others Web Web Design Website Development
Drupal 8.6 update. What’s new?
Keeping up with the promises made during earlier announcements, Drupal released the 8.6 version on September 5. The update comes with significant additions. Drupal 8.6…
Drupal Galaxy Apps Others Web
Magento 1 End Of Life: It’s time to migrate to Magento 2
Magento announced that it is pulling the plug on Magento 1 in April 2017 at the ‘Meet Magento’ conference in Prague. The announcement caused a…
Ecommerce Galaxy Apps Others Web
ACF vs Visual Composer website builder: Which is better?
Building a WordPress website? The WordPress community provides you with plenty of options. You can either make an easy one using WordPress themes or a…
Galaxy Apps Others Web Website Development
WhatsApp Business API: What’s in the limited public preview?
Facebook has finally decided to monetize WhatsApp. Earlier this month, on August 1, Facebook rolled its long-in-development WhatsApp Business API for medium to large businesses.…
Galaxy Apps Others Web
How to use Macros with Twig in Craft CMS — DRY
Templating is one of the most commonly used processes in web development. It helps with easier management during the development & design process. Apart from…
CMS Galaxy Apps Others Web
Craft Vs Perch: A Clash Of Customizable CMSs
In our earlier blogs we’ve favoured Craft CMS heavily because of its ‘content first’ philosophy. Perch also majorly focuses on the content but with functionality…
CMS Galaxy Apps Others Web
How to migrate a Craft 2 project to Craft 3?
Craft 3 update changed a lot of things. Added functionalities aside, the process of installing and maintaining the CMS also changed with this breakpoint release.…
CMS Galaxy Apps Others Web
More Craft CMS Features: Matrix and Its Powerful Friends
Craft CMS’s consistency can be seen in its regular updates & latest features. Matrix is one of those early features that helped Craft dominate the…
CMS Galaxy Apps Others Web
Debug Tool in Craft 3: Here’s all you need to know about it
Before introducing the Debug Tool in Craft 3, Craft CMS made you install a separate web-based application, Web-Console. You could run shell commands on your…
CMS Galaxy Apps Others Web
How to Setup a New Project in Craft CMS 3
There are two ways you can set up a new project in Craft 3, vis-a-vis, via Composer and Manual. Both the methods require extensive technical…
CMS Galaxy Apps Others Web
How To Get Started With SEO In Craft CMS
SEO in Craft CMS is easy and quick. Craft CMS offers several SEO options depending on the approach you choose. You can either optimize with…
CMS Galaxy Apps Others Web
Craft CMS Vs WordPress: Why Choose Craft?
We are not saying that we do not like WordPress but old man has to move the order to pave way for new and what…
CMS Galaxy Apps Others Web
Pitching Lessons from Shark Tank that Will Save Your MVP
Investors have the money, you have the idea, and the right pitch is the only thing that stands between you and them. But, pitches are…
Galaxy Apps Others Product Development Web
Is Android Picture-In-Picture Next Step to Innovation For The Edtech Industry?
When you look at it for the first time, the Android PIP feature looks pretty dope. It is a classic example of taking ‘ease of…
Android Galaxy Apps Mobile Others Web
Data Security Matters: Know Everything about GDPR Requirements, Compliances, and Deadline
“Personal data shall be processed in a manner that ensures appropriate security of the personal data, including protection against unauthorized or unlawful processing and against…
Galaxy Apps Others Web
Running Outdated Drupal? You Need to PATCH NOW!
Are you using outdated Drupal version for your website? Your website is open to hackers now! Everyone is calling it Drupalgeddon2! Here is the big news,…
Drupal Web Web Design Website Development
Google Rolls Out Mobile-First Indexing for Web Content
Google recently announced Mobile-First Indexing after a year and half of extensive experimenting and testing. The search engine giant will start migrating sites that follow…
App Developement Galaxy Apps Others Web
Tool Alert: UI Faces: Easier Design Process IS Everything
Dear fellow designers, have you ever felt serendipitous? (yeah yeah I will monitor my Word Porn consumption). That is how I felt when I found…
Design Design Tool Galaxy Apps Others Web
Older Apps Might Become Useless After Android P
Google recently came up with a developers’ preview for Android P. The developers have now found a new class in the latest Android P Dev…
Android Galaxy Apps Mobile Others Web
Social Media Marketing and Its Characteristics (updated 2018)
Social media networks are mode of social interaction. It is a platform of sharing and discussing information among human beings. Social media can include text,…
Internet Marketing Social Media Web
Agency Originals: A London-based Design Agency Finds Their Right Development Partner
When one of our clients introduced us to his friend’s London-based design agency, the one which cannot be named (Voldemort and NDA have things in…
Design Design Agency Galaxy Apps Others Web
Moving from Idea to MVP: Enroute Hustle
Building the MVP the right way After ages of working on the idea and dreaming the dream (impostor syndrome is cruel, ain’t it?), you have…
Galaxy Apps Others Product Development Web