Personalizar o agente

Quando cria um agente para um site, este usa o conteúdo do site de alojamento para gerar respostas. O Microsoft Dataverse indexa o conteúdo do site e as tabelas configuradas. O Copilot Studio resume o conteúdo indexado e as tabelas para gerar respostas.

Os utilizadores autenticados do site obtêm respostas personalizadas e resumidas, alinhadas com as respetivas funções Web. Melhore o modelo de conteúdo para utilizadores autenticados do site ao refinar os dados com estes passos:

1. No Power Pages, aceda a Configurar área de trabalho.

2. Em Copilot, selecione Adicionar agente.

3. Em Refinar os seus dados, selecione Fazer alterações.

4. Selecione Escolher o controlo de procura de tabelas para escolher ou limpar tabelas.

   • Pode selecionar várias tabelas nesta secção. Certifique-se de que todas as tabelas escolhidas são usadas no site.
   • Nas páginas subsequentes, especifique a página onde a tabela é usada, para gerar o URL da citação.

5. Selecione Seguinte.

6. Por baixo de Escolher tabelas, selecione a tabela que contém as colunas e a ligação de página que pretende selecionar. Uma tabela só aparece se tiver, pelo menos, uma coluna de várias linhas.

   Só pode selecionar uma tabela de cada vez.

7. Em Adicionar ligação da página, selecione a página onde a tabela é usada.

   Nota

   • Certifique-se de que seleciona a página correta. Caso contrário, o bot fornece um URL de citação incorreto para as respostas.
   • A página deve usar id como parâmetro de cadeia de consulta. Se usar qualquer outro nome de parâmetro, o URL da citação não funcionará corretamente.

8. Em Escolher colunas, selecione as colunas utilizadas na página. Apenas as colunas com texto com várias linhas estão disponíveis para seleção.

9. Selecione Seguinte e reveja a sua seleção.

10. Selecione Guardar para submeter as alterações.

Personalizar o aspeto do agente

Pode personalizar o estilo do agente ao substituir as classes da Cascading Style Sheet (CSS) predefinidas. Para isso, adicione um elemento style ao modelo de cabeçalho e substitua os valores seguindo estes passos:

1. Abra o editor de código do site.

2. Na navegação do Explorer, expanda a pasta modelos da Web.

3. Abra Header.html.

4. Adicione o seu elemento style ou script.

   

5. Substitua os estilos apropriados.

Widget do agente

Ícone fechado do agente:

.pva-embedded-web-chat-widget {
    background-color: #484644;
    border: 1px solid #FFFFFF;
}

Descrição:

.pva-embedded-web-chat-widget .pva-embedded-web-chat-widget-tooltip-text {
    background: white;
    color: #323130;
}

Imagem do ícone:

<script>
document.addEventListener('DOMContentLoaded', function() {
   var buttons = document.getElementsByClassName("pva-embedded-web-chat-widget");
    buttons[0].innerHTML = '<img src="<image URL>" height= "70px" width = "70px" />';
}, false);
</script>

Elementos do agente

As amostras CSS nesta secção fornecem exemplos que mostram como personalizar cada um dos elementos numerados do chatbot na captura de ecrã seguinte.

1. Cabeçalho

.pages-chatbot-header
{
    background: #77a145;
    color: #ffffff;
}

2. Definições de largura e de altura

.pva-embedded-web-chat[data-minimized='false'] {
    height: 80%;
    width: 25%;
    max-width: 400px;
    max-height: 740px;
}

3. Janela do agente

.pva-embedded-web-chat-window {
    background: white;
}

4. Bolha de um agente

Cor de fundo:

.webchat__bubble:not(.webchat__bubble--from-user) .webchat__bubble__content {
    background-color: #77a145 !important;
    border-radius: 5px !important;
}

Cor do texto:

.webchat__bubble:not(.webchat__bubble--from-user) p {
    color: #ffffff;
}

5. Bolha do utilizador

Cor de fundo:

.webchat__bubble.webchat__bubble--from-user .webchat__bubble__content {
    background-color: #797d81 !important;
    border-radius: 5px !important;
}

Cor do texto:

.webchat__bubble.webchat__bubble--from-user p {
    color: #ffffff;
}

6. Ligações de referência

.webchat__link-definitions__badge {
    color: blue !important;
}

.webchat__link-definitions__list-item-text {
    color: blue !important;
}

.webchat__render-markdown__pure-identifier {
    color: blue !important;
}

7. Definições da mensagem de privacidade

Cor de fundo:

.pva-privacy-message {
    background: #797d81;
}

Cor do texto:

.pva-privacy-message p {
    color: #ffffff;
    font-size: 12px;
    font-weight: 400;
}

Informações relacionadas

• Descrição geral das caraterísticas com tecnologia de IA e do Copilot no Power Pages
• Gerar respostas a partir de dados públicos com a Pesquisa do Bing
• IA responsável: FAQ sobre o agente do site