We use cookies to make your viewing experience better. By accepting you consent, you agree to our Cookie policy

Improve your Craft CMS skills

What Is Craft CMS? The Ultimate Guide

10 min read
What is Craft CMS

Struggling to find a content management system that actually fits your needs as a designer or developer? Craving more flexibility to craft custom experiences, without the code bloat of traditional CMS options? This guide to Craft CMS will explain how its versatile architecture streamlines building sites tailored to your specific requirements. Learn how Craft CMS enables you to easily model flexible content structures and output pixel-perfect experiences.

Craft CMS is a flexible, developer-friendly content management system created by Pixel & Tonic in 2013 and acquired by Microsoft in 2016. With its customizable fields and templates, intuitive interface, and modern web development advantages, Craft enables teams to build fully customized digital experiences tailored to their specific needs.

History and Origins of Craft CMS

Founding and Initial Release

Craft CMS originated from the creative minds of Pixel & Tonic, founded by Brandon Kelly in 2013. Having cut his teeth designing websites during the 1990s web boom, Kelly yearned for a content management system tailored specifically for modern web designers and developers.

Frustrated with the limitations of existing options like WordPress and Drupal, he set out on a mission to build a CMS from the ground up optimised for crafting custom digital experiences.

With laser focus on the needs of developers, Pixel & Tonic stealthily built the first iteration of Craft CMS throughout 2012 and 2013. After countless late nights developing the codebase, testing integrations, and refining the interface, Kelly was finally ready to unveil Craft CMS 1.0 to the world in April 2013. The initial release provided a solid foundation for managing content with an intuitive control panel, flexible fields for different content types, and a plugin architecture that could extend functionality. While basic compared to today's version, Craft CMS 1.0 delivered on Kelly's vision for a CMS designed for creatives by creatives.

Craft CMS Version History and Evolution

In the years following the inaugural 1.0 release, Pixel & Tonic continued improving Craft CMS with major updates that added new capabilities and refined existing features. These releases tracked the evolution of the web, introducing enhancements tailored to modern design trends and web development practices.

Craft CMS 1.1 arrived in February 2014 with long-awaited user management tools for managing client access. The 1.2 update later that year focused on usability improvements, providing developers more control over front-end display. 2015 saw the launch of Craft CMS 2.0, rebuilding the core framework to be more extendable and flexible.

Significant strides came in 2.3 with the addition of native matrix field support, opening up complex content modelling possibilities. Craft CMS 2.6 delivered the biggest advancement to date in May 2016 - a ground-up rewrite adding native Unicode support. This crucial update ensured Craft CMS could handle global content needs out-of-the-box. Pixel & Tonic capped off four years of relentless iteration with the release of Craft CMS 3 in April 2018. Craft 3 represented the biggest overhaul since the original launch, future-proofing the CMS with a modern architecture.

Acquisition by Visual Studio in 2016

Craft CMS' relentless growth trajectory captured the attention of Microsoft's Visual Studio division in 2016. With their flagship .NET development platform deeply integrated into Craft's codebase, Visual Studio saw immense synergy in bringing the CMS into their stack. After months of quiet acquisition talks, Microsoft announced the purchase of Pixel & Tonic in July 2016.

While surprised by Visual Studio's interest, Pixel & Tonic leadership recognised the huge benefits of being backed by a technology giant. Joining the Microsoft fold provided financial resources to expand the team and product vision. Just as importantly, it ensured long-term support for .NET and SQL Server tight integration. With the momentum accelerating thanks to Visual Studio's stewardship, Craft CMS was poised to cement itself as the go-to CMS for creatives.

Benefits and Advantages of Craft CMS

Flexible and Customizable Architecture

One of the standout advantages of Craft CMS is its incredibly flexible and customizable architecture. Craft provides endless options to adapt the CMS to specific site needs rather than taking a rigid one-size-fits-all approach.

At the core of the flexible architecture are Craft's custom fields and templates. Developers can create any field type required, from text and images to complex related entries and matrix grids.

These custom fields are then output through Twig templates, unlocking complete control over frontend markup and output.

The customizable architecture empowers teams to build a CMS tailored to their exact preferences. Whether creating a brochure site or a complex web app, Craft's architecture moulds to match. Teams can also tap into a thriving Craft CMS plugin ecosystem to further extend Craft's capabilities, integrating new features like e-commerce and search.

Intuitive Admin Interface and Editor Experience

Craft CMS places a huge emphasis on an intuitive admin interface and editing experience. The control panel provides all site configuration and content editing options through a clean, uncluttered interface.

Simple drag-and-drop interactions coupled with thoughtful information architecture speed up managing content. The panel focuses on clarity rather than excessive features, guiding users to complete tasks quickly. Craft also allows editors to make front-end content updates, ensuring changes display as intended.

Together these user experience optimizations enable people to efficiently build and update sites in Craft CMS. Rather than navigating a complex maze of options, the intuitive admin panel gets out of the way. For developers, it also means spending less time training clients and customers on how to use the CMS.

Optimized for Modern Web Development

Craft sets itself apart from traditional CMS options by optimizing for modern development approaches. It focuses on being an agile content repository rather than a monolithic all-in-one platform.

Developers can connect Craft to external systems and data sources through its robust API. This enables fully headless architectures decoupling the frontend and backend. JavaScript frameworks like React and Vue can consume content from Craft APIs to build interactive sites.

The modern web development advantages make Craft perfect for today's Jamstack approach. It provides structured content for static sites generated through tools like GatsbyJS. The headless versatility also allows progressively enhancing traditional sites by sprinkling in JavaScript behaviour.

With built-in support for modern workflows, development teams save time integrating Craft CMS into their stack. They can leverage surrounding technologies while letting Craft handle flexible content authoring. This best-of-breed approach brings together the CMS and frameworks optimised for specific jobs.

Key Features and Functionality of Craft CMS

Modular Content Editing and Fields

At the core of Craft's flexibility is its modular approach to managing content. Rather than monolithic pages, content is broken into discrete blocks and sections called entries. Editors build up pages by adding different entry types with customised field layouts.

For example, a "Job Posting" entry would include fields like Company, Location, and Requirements. A separate "Blog Post" entry would have fields optimised for longform articles. Entries are then output through templates, allowing the same content to be displayed anywhere on the site.

Craft provides an extensive set of built-in field types like text, rich text, assets, and numbers. Developers also create completely custom fields tailored to the project, building up reusable field layouts. Fields are organised into field groups, streamlining the editing experience by related data.

This modular content model coupled with custom fields allows Craft CMS to adapt to any content structure required. Editors have the flexibility to manage content in a way that matches real workflows.

Template Architecture and Theming

Craft leverages the Twig templating language to separate content from presentation. All content is stored as Twig variables that get parsed through Twig templates to output HTML markup.

The template architecture includes index, layout, and block sub-templates. Index templates function like controllers, fetching data and passing it to layouts. Layout templates take this data and apply shared chrome and markup. Block templates encapsulate reusable UI components.

Developers create multiple templates forming a hierarchy to control different site sections. Tags route entries to the desired templates based on their type and tags. The template structure along with Twig logic provides precision over front-end markup and output.

Craft CMS also makes it easy to customise and brand sites through its theming support. A themes folder contains common CSS, JavaScript, images, and base templates to provide consistent styling. Global theme settings allow tweaking colours, typography, and branding across all templates in Craft.

User Accounts, Roles and Permissions

Craft provides enterprise-grade tools for managing user accounts and controlling access. The intuitive user management panel enables the creating of any number of user accounts with custom fields attached.

User accounts get assigned to one or more user groups. Groups have granular settings and permissions for restricting access to different site areas and actions. For example, a "Client Editors" group would only have permissions for certain sections and entry types.

User accounts can also have individual custom roles like "Site Manager" or "Copywriter" that overlay additional permissions. Together user groups and user roles provide precision control over what actions each user can perform in Craft CMS.

The advanced user tools make it easy to safely onboard new content creators. Users get access tailored to their scope, streamlining workflows and preventing accidental changes. These user controls ensure content integrity as teams and clients grow.

Getting Started with Craft CMS

Server and Hosting Requirements

Before installing Craft CMS, the server environment must meet the minimum requirements. Craft runs on PHP 7.0 or newer, along with MySQL 5.5+ or MariaDB 5.5+ for the database. It also requires at least 256MB of memory allocated to PHP.

For hosting, any modern shared hosting plan with the required PHP and MySQL should suffice for getting started. Low-traffic sites can run on basic shared servers from Bluehost, SiteGround, and other popular hosts.

For higher traffic or enterprise sites, a cloud VPS with more resources is ideal. Platforms like DigitalOcean, Linode, and AWS's Lightail offer affordable VPS plans to host Craft CMS. They provide more control over configuring PHP, MySQL, caching, and security tweaks for optimal performance.

Installation and Configuration

Once hosting is ready, it's time to install Craft CMS. The primary method is via Composer, which handles dependencies and updates. After Composer is installed, run "composer create-project craftcms/craft" to download and configure Craft CMS.

For quick setups, Craft also offers one-click installer packages from the Control Panel. Upload the zipped installer to the server, unzip it, and browse to the CP install page.

After installation, running through the configuration checklist is critical:

  • Set the site name, base URL, timezone

  • Generate a new secure encryption key

  • Remove the default admin account

  • Create a new administrator account

  • Configure email settings

  • Adjust system settings

With those basics set, enable Dev Mode to unlock all features during initial development and testing. The final step is creating user groups and granular user permissions.

Initial Template and Content Modeling

Once Craft is installed and configured, developers can start building out the content structure and front-end templates. A key best practice is to map out content types and fields before development.

For example, identify common modules like hero sections, content blocks, FAQs. Create associated entries with custom fields to manage those modules. Build these fields into field layouts for reuse.

With the content model defined, build out the Twig template hierarchy following Craft conventions. Start with _layout templates, then top-level routing _index templates, flowing into _entry and _block sub-templates.

Spinning up a quick prototype site at the start makes iterating on templates and content modelling easier. Treat the CMS as a living prototype, continually refining fields and templates as the true client needs to emerge. With the fundamentals in place, the CMS customization can really begin.

Developing Websites with Craft CMS

Templating Syntax, Variables and Functions

Craft CMS leverages Twig for its templating language, providing powerful capabilities for building sites. Twig syntax is similar to PHP, using {{ variables }} and {% logic %} delimiters.

All content in Craft is stored in Twig variables that get passed to templates for output. For example, entry content can be displayed via {{ entry.myField }}. The . operator accesses attributes on variables.

Craft predefines hundreds of variables for common entities like the current user, entry, global settings, etc. Developers also create custom variables to pass data between templates.

Logic like for loops, if statements and filters execute directly within {% %} tags. Twig | filters modify output, like {{ text|lower }} to lowercase text. Functions like craft.entries fetch data into variables.

This mix of familiar PHP-style syntax with built-in Craft variables and functions enables complete control when building templates to display content, while keeping code concise and readable.

Entries, Categories and Assets

At the heart of many Craft sites are entries - the modular content blocks created through the CMS. The {% set entry = craft.entries() %} variable fetches entries for output.

Adding .id, .section, .type parameters queries specific entries. For example, {% set newsEntries = craft.entries.section('news') %} gets the News entries. .all() gets all entries.

Categories organize and group entries. {% set category = craft.categories.group('news') %} gets the News category group. .relatedTo(category) displays related entries.

Assets contain uploaded images, docs, and files. {% set image = entry.heroImage.one() %} gets the Hero Image asset for the entry. .url displays the image URL.

Craft's content modeling flexibility combined with intuitive querying and output syntax makes templating a breeze.

Modifying and Creating Fields

Craft lets developers modify existing fields and create completely custom field types through UI tools or plugins.

Existing fields are changed right from the CMS by clicking the Settings icon on any field. Here you can rename labels, change formatting, tweak default values, and more.

Creating new fields and field types is done in Settings → Fields. Choose types like Text, Dropdown, Number, Assets, and more. Adjust settings then add fields to sections and field layouts.

For entirely custom fields, plugins extend Craft's field types. For example, a Matrix plugin provides a field for managing groups of blocks. A Map plugin creates a custom Google Maps field type.

This customizable field architecture enables modelling any content structure needed for current and future projects. Fields seamlessly integrate into the native Craft authoring experience for editors.

Whether tweaking existing fields or building custom ones, Craft provides unlimited flexibility to craft purpose-fit content models tailored to the project. Templating then unlocks displaying those custom fields and content however you need for the site design.

Example Sites Built with Craft CMS

Marketing Websites

Craft CMS delivers the flexible content and design options perfectly suited for marketing websites. Companies like SeatGeek and Bliss Brewery leverage Craft to showcase their brands and offerings.

SeatGeek rebuilt their event ticket marketplace site using Craft CMS for greater control over pages and UX. Craft's modular content and custom fields let them create mixed layouts with different data modules on each page.

UK brewery Brewdog needed a fast, marketing-focused CMS for their disruptive brand. Craft provided a developer-friendly platform tailored to Brewdog's complex content and multi-language needs. The result is a sleek, high-performing site that converts visitors.

From established brands to scrappy startups, Craft CMS empowers marketing sites with custom content architecture and presentation unchained from rigid templates. The result is higher quality experiences optimised for each brand's messaging and offerings.

Ecommerce Stores

Increasingly, commerce brands rely on Craft's flexibility to model product content and build customer experiences that convert. Retailers like Activision and Hawkins New York use Craft for their ecommerce engine.

When Activision sought to consolidate its flagship gaming sites, it turned to Craft for its content flexibility and developer friendliness. Craft provided the perfect headless CMS to feed content APIs consumed across their properties.

Designer housewares company Hawkins New York moved to Craft to unify its brand presence. Craft's structure and theming capabilities enabled the building of a seamless experience across online stores, catalogs, and content sites.

With the ability to create custom product types, taxonomies, modals and templates, Craft helps ecommerce brands deliver the customer experience needed to sell.

Blogs and Magazines

From hobby blogs to leading digital publishers, Craft excels at managing large volumes of editorial content. Sites like Food52 and The Ringer leverage Craft for content production.

Food52 relies on Craft CMS to fuel its community cooking site and magazines. Craft's editing tools and structure empower Food52's editors and writers to efficiently produce recipes, articles and other content.

Sports and pop culture site The Ringer focuses on high-velocity publishing. Craft's flexibility enabled modeling diverse content from quick news hits to longform features. Custom workflows empower editors to create varied content at scale.

For publishers managing lots of content, Craft provides a robust toolbox rather than a rigid system. The result is a CMS tailored to content teams' unique needs and workflows.

Limitations and Considerations of Craft CMS

Learning Curve

One potential drawback of Craft CMS is its steeper learning curve compared to other options. Since Craft is tailored for developers, it requires more technical skill to get started with templating and custom fields. Less technical users or very small teams may prefer simpler CMS platforms.

For developers experienced with PHP/Twig, Craft's learning curve is manageable. But it does require dedicating time upfront to learn best practices for templating, querying data, and modelling content structures. Developers with only basic HTML/CSS skills will need to budget extra time ramping up on Craft.

The learning curve also applies to content editors and site managers. Craft's flexible fields and modular sections provide extensive options but less hand-holding for newcomers. Editors will need guidance in understanding how to structure and manage content for an optimal authoring workflow.

Scaling to Very Large Sites

While Craft CMS handles typical small to mid-sized site needs with ease, it may not be the best fit for massive enterprise sites. Craft's architecture focuses on flexibility over raw performance at scale. Very large sites managing millions of pages and terabytes of assets may encounter challenges.

Sites like major global media publications with 10,000+ editorial users and billions of monthly pageviews are beyond Craft's sweet spot. At a huge scale, choices like Sitecore or Adobe Experience Manager are better optimized for massive content volumes and user bases.

For most typical sites though, Craft can scale to hundreds of thousands of pages and assets with careful optimization like caching, image transforms, and database indexing. Craft's sweet spot is mid-size organizations with room to grow.

Reliance on Plugins and Integrations

Since Craft keeps the core CMS lightweight, it relies heavily on plugins and custom development for complex features. Craft has fewer built-in features out-of-the-box than some other CMS options.

Sites needing native advanced functionality like social integration, personalization, multivariate testing, etc will need to evaluate available plugins and custom development costs. Heavier projects should budget for extra integration work.

For smaller sites, Craft's lightweight core and plugin architecture offer more flexibility. You only enable what you need, avoiding coder bloat. But larger enterprises will incur more overhead integrating Craft into their existing martech stack.

Overall the plugin reliance reinforces Craft's positioning as a developer-centric CMS, rather than an all-in-one platform. It focuses on providing a rock-solid core content foundation that integrates with modern architecture.

Shape April 2022 HR 202
Andy Golpys
- Author

Andy has scaled multiple businesses and is a big believer in Craft CMS as a tool that benefits both Designer, Developer and Client. 

Show us some love
Email Us
We usually reply within 72 hours
Agency Directory
Submit your agency
Affiliate Partners
Let's chat