---
sourceDocument: Australia Employee Service Management
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/employee-service-management

 Release :

    - australia

ft:locale :

    - pt-BR

ft:publication_title :

    - Australia Employee Service Management

ft:clusterId :

    - emplsm

bundleId :

    - emplsm

workflow :

    - Employee


---

# Add columns with the Rich Content Editor

# Add columns with the Rich Content Editor {#ariaid-title1}

* Versão de lançamento: Australia
* 
* Atualizado 12 de mar. de 2026
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 3 min. de leitura

Use the Rich Content Editor canvas to create columns to help
define and organize your layout for your page.

## Antes de Iniciar

Role required: sn_cd.content_manager

After you have completed the New content form (see [Create rich content](https://servicenow-prod.fluidtopics.net/hX42wdO2gXKjGnfQjc3s4g "Use the Rich Content Editor to build long form content with an easy to use web styled tool.")) and navigated to the Rich
content canvas, you can create rich content.  
You can add 1, 2, or 3 columns. Each column acts as a container for other components. Each column component can also be edited by selecting the component and updating the properties under settings.  
Nota:  
The minimum height for a cell within a column is 75px. If you set the cell height smaller, the cell overflows the row.

## Procedimento

1. Navigate to the canvas by selecting the Open editor button from the Design tab of the New content form.
2. From the Rich Content Editor canvas, you can use a drag-and-drop method to add columns.  
   Columns act as containers for the content you are creating.Figura 1. Rich Content Editor

   After you drop a 1 Column, 2 Column, or 3 Column into the Rich Content Editor canvas, there are two separators that appear.
   The outside separator is labelled Row. The inside separator is labelled Cell.

Add styling to the row or cells, such as background color, maximum width, or padding. If you do not want to add styling, you can proceed to the links at the bottom of this page.

3. Select a row or cell to edit.
4. Navigate to Settings tab.
5. Use any of the following styling settings:  
   Nota:  
   Content Managers and Admins have the option to apply background colors to selected canvas elements, including images. Available features include the use of solid and gradient colors, as well as adjustments for color opacity. These settings can be accessed in the right-hand panel under the Settings Styling tab when adding rich content to a canvas element.
   {#ec-rich-content-canvas__table_zx2_tgw_jyb__entry__2}

   | Settings field | Description |
   |-|-|
   | Styling ||
   | Background Color | Use the color picker (grey square) to select a color or enter the color code that represents the background color you want to appear. All HTML colors are supported. For more information, see [HTML color names](https://htmlcolorcodes.com/color-picker/). Nota: Background color to canvas element shows the background options for gradient, color and image. Toggle on and then select background options. |
   | Advanced styling ||
   | Width | Specify the value by entering a number or dragging the right side of the cell. Select the unit of measure: * px: pixel * %: percentage {#ec-rich-content-canvas__ul_z1t_33z_z5b} |
   | Height | Specify the value by entering a number or dragging the bottom of the row. Select the unit of measure: * px: pixel * %: percentage {#ec-rich-content-canvas__ul_dkg_mhw_jyb} |
   | Padding | Padding is the space between content and the border of an element. Specify the value for top, bottom, right, or left padding by entering a number. |
   | Margin (for rows only) | Margin is the space between a row and another element/the canvas boundary. Specify the value for top, bottom, right, or left padding by entering a number. |
   | Border (for cells only) | Define the width, border style, and color. |
   | Border radius (for cells only) | Radius setting rounds the border corner. |
   | Properties ||
   | ID | A unique ID that identifies the HTML element. |
   | Title | A tool tip or information that appears when a user hovers over the component. |
   [Tabela 1. Styling settings]

   {#ec-rich-content-canvas__table_zx2_tgw_jyb}
6. Select Save.

## O que Fazer Depois

Add and style more columns to create a layout for all the content on the page.  
Then, add components such as images, videos, text boxes, and buttons:

* [Add Tabs with Rich Content Editor](https://servicenow-prod.fluidtopics.net/G0twUJZPOOVr8gHXEa2Kwg "Add tabs to your rich content to help your users navigate efficiently by allowing them to select the various tabs to reveal the associated content within them.")
* [Add a Divider with the Rich Content Editor](https://servicenow-prod.fluidtopics.net/yw3jCS3OgAsmIHFE4bVouA "Add a horizontal Divider into your canvas to visually separate elements or highlight important sections.")
* [Add an Image with the Rich Content Editor](https://servicenow-prod.fluidtopics.net/qGZW2Xtv5I_NA7p29NsKAg "Use the Rich Content Editor canvas to add images in your content.")
* [Add a Video with the Rich Content Editor](https://servicenow-prod.fluidtopics.net/_091kY_ywvgBv9g1W4yOSw "Use the Rich Content Editor canvas to add videos in your content.")
* [Add Text or a Text section with the Rich Content Editor](https://servicenow-prod.fluidtopics.net/kqwyxC_jw~d7fBaP25eNeg "Use the Rich Content Editor canvas to add Text or a Text section in your content.")
* [Add a Link or Link block with the Rich Content Editor](https://servicenow-prod.fluidtopics.net/JtONvVbKC1CXykWFKmRM9Q "Use the Rich Content Editor canvas to add a link or a link block to redirect users to different content or a web page. A Link provides a textbox and a Link block allows you to add an image that acts as a link.")
* [Add a Button with the Rich Content Editor](https://servicenow-prod.fluidtopics.net/IBNx8pccCHKPgMrUjrdtgg "Add a Button to trigger actions or redirect users to different content.")
{#ec-rich-content-canvas__ul_ab5_2kw_jyb}