---
sourceDocument: Interface do usuário da Now Platform Yokohama
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/pt-BR/yokohama/platform-user-interface

 Release :

    - yokohama

ft:locale :

    - pt-BR

ft:publication_title :

    - Interface do usuário da Now Platform Yokohama

ft:clusterId :

    - platux

bundleId :

    - platux

workflow :

    - Platform


---

# Configurando um botão de ação para abrir um modal personalizado

# Configurando um botão de ação para abrir um modal personalizado {#ariaid-title1}

* Versão de lançamento: Yokohama
* 
* Atualizado 30 de jan. de 2025
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 min. de leitura

Depois de adicionar um botão de ação ao espaço configurável, você pode configurar o botão para abrir um modal personalizado.

Os botões executam ações em seu espaço configurável. Os modais personalizados fornecem informações ou elementos interativos sem sair da página atual por meio de caixas pop-up. A integração de modais personalizados com botões de ação cria uma experiência perfeita e interativa, permitindo que você execute ações intuitivamente.

## Processos para criar um modal personalizado {#configuring-an-action-button-to-open-a-custom-modal__section_ar5_vgn_21c}

A configuração de um botão de ação para abrir um modal personalizado envolve vários processos:

1. Adicionando o botão de ação ao formulário:A criação de uma ação adiciona o botão ao formulário sem atribuí-lo para fazer nada quando selecionado. Para obter mais informações, consulte [Crie uma ação de formulário](https://servicenow-prod.fluidtopics.net/Oe~pPhp_CEeXYhx62w~QDA "Adicione um botão de ação de formulário ao seu espaço configurável.").

2. Ativando a Gestão de atendimento ao cliente:A adição do plug-in de Atendimento ao cliente fornece dados de demonstração e ativa plug-ins relacionados que ainda não estão ativos. Para obter mais informações, consulte [Ative a Gestão de atendimento ao cliente](https://www.servicenow.com/docs/access?context=t_ActivateCustomerService&version=yokohama&pubname=yokohama-customer-service-management&ft:locale=en-US).

3. Abrindo sua página de registro no Construtor de IU:O acesso à página de registro no Construtor de IU permite que você crie e configure a variante de página com um modal personalizado. Para obter mais informações, consulte [Crie uma variante de página](https://www.servicenow.com/docs/access?context=create-variant&version=yokohama&pubname=yokohama-application-development&ft:locale=en-US).

4. Projetando a variante de página no Construtor de IU:Usar o Construtor de IU para projetar uma variante de página passa o modal para a página de registro do espaço. Para obter mais informações, consulte [Projete uma variante de página no UIB](https://servicenow-prod.fluidtopics.net/jUAYHl18aRZoezNO4oiHtQ#design-a-page-variant-in-uib "Configure uma variante de página do Construtor de IU para passar de um modal de espaço para a variante. Esta etapa atua como parte do processo para configurar um botão de ação para abrir um modal personalizado.").

5. Configurando a variante de página como um modal no Construtor de IU:Usar o Construtor de IU para configurar a variante de página define o modal a ser exibido na página de registro do espaço. Para obter mais informações, consulte [Configure uma variante de página como um modal no UIB](https://servicenow-prod.fluidtopics.net/gk5wXxYupfMOGYddaUiKrw#configure-a-page-variant-as-a-modal-in-uib "Defina sua variante de página para aparecer como um modal usando as configurações do Construtor de IU. Estas etapas atuam como parte do processo para configurar um botão de ação para abrir um modal personalizado.").

6. Criando um mapeamento de evento de complemento de UX:A configuração de um mapeamento de evento de complemento de UX conecta o botão de ação ao modal personalizado. Para obter mais informações, consulte [Crie um mapeamento de evento de complemento de UX](https://servicenow-prod.fluidtopics.net/F~VziWpQYwEkJ3kYOeN~~Q#create-a-ux-add-on-event-mapping "Conete um botão a um modal usando o mapeamento de eventos de complemento de UX para que um botão de ação abra um modal personalizado.").

7. Definindo a carga para um modal personalizado:A configuração da carga define o botão de ação para abrir o modal personalizado em seu espaço. Para obter mais informações, consulte [Defina a carga para um modal personalizado](https://servicenow-prod.fluidtopics.net/6D7AISvIjlDTkqHou0ybcw#define-the-payload-for-a-custom-modal "Defina seu botão de ação para abrir um modal personalizado definindo os parâmetros de carga.").

{#configuring-an-action-button-to-open-a-custom-modal__ol_lb2_4hn_21c}