---
sourceDocument: Brazil Customer Service Management
sourceDocumentLink: https://www.servicenow.com/docs/r/customer-service-management

 Release :

    - brazil

ft:locale :

    - en-US

ft:publication_title :

    - Brazil Customer Service Management

ft:clusterId :

    - csm

bundleId :

    - csm

workflow :

    - Customer and Industry


---

# Add and configure the Portal Banner widget

# Add and configure the Portal Banner widget {#ariaid-title1}

Release version: Brazil  
Updated September 10, 2026  
![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 minute to read  
Add a Portal Banner widget to your portal and modify its appearance and behavior. You can use the Portal Banner widget to display announcements, new product or feature highlights, and important information on the portal
page.

## Before you begin

The UI Components for Customer Portals plugin must have been activated. For more information, see [Activate the UI Components for Customer Portals plugin](https://www.servicenow.com/docs/08umwBf4NNZ1Zkike~EuXg "You can activate the UI Components for Customer Portals plugin (sn_ciwf_ui_cmpnt) to enable Configurable Portal widgets. The application installs related plugins if they aren’t already installed.")

If you have not already created the page to which you want to add the widget, see [Create a page for Configurable Portal widgets](https://www.servicenow.com/docs/e7sWR44GAyHAESvrAD7mZg "Create a page into which you can add Configurable Portal widgets.").

Role required: sp_admin

## About this task

## Procedure

1. Navigate to the AllService PortalService Portal Configuration.
2. Select Designer.
3. On the Service Portal Designer page, search for and select the page to which you want to add the widget.
4. Add container.
   1. Select the Widgets tab.
   2. In the Layouts section, drag the Container layout onto the portal edit page.
   3. On the container, select the Pencil icon (![Pencil icon]()).
   4. In the Width field, select Fluid.
   5. Select Save.
   {#config-portal-banner-widget-inst-opt__substeps_gc3_cp3_3fc}
5. Add columns to container.
   1. On the container, add a set of columns by selecting the plus button (![Plus button]()).
   2. In the column, select the Edit page properties icon (![Edit page properties icon.]()) in the banner in Service Portal Designer.  
      Note:  
      Verify that Column is selected in the breadcrumbs navigation.
   3. On the Page window, in the Page Specific CSS field, paste the following CSS code.  

          .col-md-12{ 
               padding-left: 0;
               padding-right: 0; 
           }
          .padding-top {
               padding-top: 0;
           } 

      If a message appears about the application scope, select here to be able to edit the record.
   4. Select Save.
   {#config-portal-banner-widget-inst-opt__substeps_hfp_np3_3fc}
6. Add portal banner widget.
   1. On the Widgets pane, in the Filter Widget field, enter <kbd class="ph userinput">Portal Banner</kbd>.
   2. Drag the widget onto the container.
   3. In the Edit page, select the Portal Banner widget.
   4. Select the Pencil icon (![Pencil icon]()).
   5. On the Instance form, in the Presentation field, paste the following JSON code into the Search Placeholder Text field.  

          {
              "title": "enter the title",
              "size": "enter the size of search bar",
              "color": "enter color"
          }

      For more information about each parameter, see [Script parameters for the search option in the Portal Banner widget](https://www.servicenow.com/docs/bt4Itb3fay~HfwRAwpl5TA "Description of the JSON parameters for the search option in the Portal Banner widget.").
   6. On the Instance form, fill in the fields.  
      For a description of the field values, see [Portal Banner widget instance options form](https://www.servicenow.com/docs/5k9lAEKct~S2atLXzrH6KQ "Instance options enable you to configure the Portal Banner widget on a portal page.").
   7. Select Save.
   {#config-portal-banner-widget-inst-opt__substeps_qqr_yp3_3fc}

*[\>]: and then