NashTech Blog

Umbraco 13 Essentials: Step 2 – Mastering Content Management Features

Table of Contents

Introduction 

Umbraco 13 offers a powerful and intuitive content management system (CMS) designed to make content creation and management straightforward and efficient. In this article, we will explore the various content management features of Umbraco 13, providing you with a comprehensive understanding of how to leverage these tools to build and maintain your website effectively.

The Content Editing Interface 

Umbraco’s content editing interface is designed to be user-friendly and highly customizable, enabling editors to create and manage content with ease. Here’s a closer look at some of the key features:

Content Tree

The content tree is the backbone of the Umbraco backoffice, providing a hierarchical view of all the content on your website. It allows you to: 

  • Organize content into a clear structure. 
  • Easily navigate between different pages and sections. 
  • Quickly locate and edit specific content nodes. 

Creating and Editing Content Nodes

Content nodes represent individual pages or pieces of content. To create a new content node:

  1. Right-click on the desired parent node in the content tree. 
  1. Select “Create” and choose the document type you want to use. 

When editing a content node, you will encounter a variety of fields, depending on the document type. These fields can include text boxes, rich text editors, media pickers, and more, allowing you to create rich, dynamic content.

Rich Text Editor

The rich text editor in Umbraco 13 provides a familiar word processor-like interface for creating and formatting content. It supports: 

  • Basic text formatting (bold, italic, underline). 
  • Inserting links, images, and videos. 
  • Creating tables and lists. 
  • Adding custom styles and formatting options.

Managing Media and Document

Umbraco 13 makes managing media and documents straightforward with its Media section. Here’s how you can efficiently organize and utilize your media assets:

Media Library

The media library is where you upload and manage all your images, videos, PDFs, and other media files. It supports: 

  • Drag-and-drop uploads. 
  • Organizing media into folders and subfolders. 
  • Editing media properties, such as titles and descriptions.

Media Pickers

Media pickers allow you to easily select and insert media into your content. When editing a content node, you can use media picker fields to: 

  • Select images and videos to display on your pages. 
  • Link to documents and other downloadable files. 

Using the Block List Editor 

The block list editor is one of Umbraco 13’s standout features, offering a flexible and modular approach to content creation. It allows you to create content blocks that can be reused and rearranged across different pages. Here’s how to use it:

Setting Up Block List Editor

To set up the block list editor: 

  1. Go to the Settings section. 
  2. Create a new block list document type or edit an existing one. 
  3. Define the blocks you want to use, specifying the fields and settings for each block.

Creating Content with Block List Editor

When creating or editing a content node that uses the block list editor, you can: 

  • Add new blocks by selecting from the predefined list. 
  • Rearrange blocks by dragging and dropping them into the desired order. 
  • Edit block content directly within the editor. 

This approach provides immense flexibility, allowing you to create complex, dynamic layouts without the need for custom templates or extensive coding.

Conclusion 

Umbraco 13’s content management features are designed to empower editors and developers alike, providing the tools needed to create and manage content efficiently. From the intuitive content editing interface and robust media management capabilities to the powerful block list editor, Umbraco 13 offers a comprehensive suite of features that make content creation a breeze. 

In the next articles of this series, we will delve into customizing and extending Umbraco 13, exploring the API, and optimizing performance and security. Stay tuned for more insights and tips on mastering Umbraco 13. 

Picture of Trung Lê Tấn

Trung Lê Tấn

As a Senior Software Engineer with over 10 years of experience, I specialize in backend development and handle frontend tasks as well. My background includes previous experience as a Team Leader, which has helped me develop strong project management and team collaboration skills.

Leave a Comment

Your email address will not be published. Required fields are marked *

Suggested Article

Scroll to Top