---
sourceDocument: Australia Employee Service Management
sourceDocumentLink: https://www.servicenow.com/docs/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 Tabs with Rich Content Editor

# Add Tabs with 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) 4 min. de leitura

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.

## Antes de Iniciar

Role required: sn_cd.content_manager

Fill in the New content form fields. See [Create rich content](https://www.servicenow.com/docs/hX42wdO2gXKjGnfQjc3s4g "Use the Rich Content Editor to build long form content with an easy to use web styled tool.")  
Create the page layout using modules or columns.

* Modules are predefined content layouts comprised of header, paragraph text, and images. See [Add predefined content layouts with the Rich Content Editor](https://www.servicenow.com/docs/DblOyz8TwJh_2e1xReCS8Q "Use modules to easily add new content layouts containing headers, paragraph text, and images. Choose from layouts comprised of three vertical cards, three horizontal cards, or a side-by-side configuration with an image positioned to the right of a text block.")
* Columns are containers that enable you to define a custom layout. See [Add columns with the Rich Content Editor](https://www.servicenow.com/docs/PmOCSQoammLurDyFpDbyGw "Use the Rich Content Editor canvas to create columns to help define and organize your layout for your page.")
{#ec-rich-content-tabs__ul_jzv_qft_wxb}

## Por Que e Quando Desempenhar Esta Tarefa

You can add other components under a tab, like an Image, Video, Text, Text section, Link, Link block, or Button. When you drop the Tabs component into your canvas, an area below the tabs appears that allows you to drop other components into it.  
Nota:  
When the Tabs functionality is not enabled, try reinstalling the Content Publishing application.

## 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 tabs.  
3. To add more tabs, select the entire tab component and click Add item, located in SettingsProperties.  
4. Select a tab you added to your canvas.
5. To change the color of the tabs, first click into the color palette.
6. From the Settings tab, select Styling.
7. Enter the color code that represents the color you want to appear.  
   All HTML colors are supported. For more information, see [HTML color names](https://htmlcolorcodes.com/color-picker/).
8. Or, you can select the color picker (grey square) to the right of the Background Color field.  
   ![Rich Content Editor - Color selector]()
9. Click into the color palette that appears.  
10. After selecting a color from the color palette, use the slide bar on the right side to fine tune your color.  
    Slide the bar up and down.

11. Use the bottom slide bar to lighten or darken your color.  
    Nota:  
    When previewing your changes and you select the tab, the colors or outline of the tab may show the default colors of the portal theme.
12. You can edit or change the text that appears on the tab by highlighting Tab Title and overwriting it.
13. You can edit the size of each tab and the font of the Tab title by selecting a tab and then selecting Advanced styling.
14. You can drop other components into the area below the Tabs you added to your canvas.  
    {#ec-rich-content-tabs__table_vdh_dqy_5vb__entry__2}

    | Field | Description |
    |-|-|
    | Width | Edit the width of each tab by selecting it and using the Width drop-down. Your choices are: * auto: Size is based on the content within the tab. If you enter additional text in the tab, the width automatically increases. * px: Use pixels as your measurement. * %: Use a percentage as your measurement. {#ec-rich-content-tabs__ul_sfv_ydz_5vb} |
    | Height | Edit the height of each tab by selecting it and using the Height drop-down. Your choices are: * auto: Size is based on the content within the tab. If you enter additional text in the tab, the width automatically increases. * px: Use pixels as your measurement. * %: Use a percentage as your measurement. {#ec-rich-content-tabs__ul_pc3_c2z_5vb} |
    | Font name | Select the drop-down to choose a specific font. |
    | Font size | Enter a number to change the font size or use the up and down arrows to make the font smaller or larger. |
    | Font weight | Determines how bold or light your text on the button appears. Select the drop-down arrow to choose a different weight. |
    | Line height | Determines the distance between lines of text. Use the up and down arrows to make line height smaller or larger. |
    | Font color | Defines the color of the font. Select the color picker (grey square) to the right of the Font color field. Click into the color palette, and choose the color you want. Use the slide-bars on the right and bottom to fine tune your color. Nota: When previewing your changes and you select the tab, the color of the text may show the default colors of the portal theme. |
    [Tabela 1. Advanced styling]

    {#ec-rich-content-tabs__table_vdh_dqy_5vb}
15. Edit the Title field under Properties.  
    The text you enter appears as hover text for the tab and the screen reader announces it.
16. Select Save or Save and Finish.  
    Selecting Save saves your content and you remain on the Rich Content Editor canvas. Selecting Save and Finish saves your record and returns you to the New content form.

## O que Fazer Depois

* (Optional) Translate your content.Request language translation for your content. For more information, see [Multilingual support in the Content Library](https://www.servicenow.com/docs/eC0uUEMQcfgevo~mY8BeMQ "The Content Library includes two features for multilingual content creation: Translate content (content translation workflow) and Switch language (changes the interface language).").{#ec-rich-content-tabs__p_vtc_nfg_h1c}

  Nota:  
  Only translate content after you are done modifying the content. For best results, we do not recommend that you add or remove components or change the formatting after translation.

  To create rich content that is formatted differently in different languages, duplicate the content and modify the formatting as needed. Then, use Audiences to target the content to users by
  language. See [Audiences](https://www.servicenow.com/docs/Xlax07RmV~rKwThkDvNAXw "Target portal content and lifecycle event activities to specified audiences with audience records.")
* Preview your content from the Publish tab.  
  Nota:  
  Content Preview is designed to provide a general idea of how your content looks. Content may look different once published due to variations in device resolution, theme difference, or mobile app style configuration.
* Configure a publish plan to control where the content is delivered, the audience, and the period of time it is available: [Create a publish plan for your content](https://www.servicenow.com/docs/DBFxuczuOdDkyWjZ1Cni0Q "After you create content in the Content Library, add one or more publish plans to control where the content is delivered, the audience, and the period of time it is available.").
{#ec-rich-content-tabs__ul_ogf_pv5_nyb}