Delen via

Uw agent aanpassen

Wanneer u een agent voor een website maakt, gebruikt deze de inhoud van de hostsite om reacties te genereren. Microsoft Dataverse indexeert site-inhoud en geconfigureerde tabellen. Copilot Studio vat de geïndexeerde inhoud en tabellen samen om reacties te genereren.

Geverifieerde sitegebruikers krijgen op maat gemaakte, samengevatte antwoorden die aansluiten bij hun webrollen. Verbeter het inhoudsmodel voor geverifieerde sitegebruikers door de gegevens met de volgende stappen te verfijnen:

  1. Ga in Power Pages naar Werkruimte instellen.

  2. Selecteer Agent toevoegen onder Copilot.

  3. Selecteer onder Uw gegevens verfijnen de optie Wijzigingen aanbrengen.

  4. Selecteer Opzoekbesturingselement Tabellen kiezen om tabellen te selecteren of te wissen.

    • In deze sectie kunt u meerdere tabellen selecteren. Zorg ervoor dat elke tabel die u kiest, op de site wordt gebruikt.
    • Geef op de volgende pagina's de pagina op waar de tabel wordt gebruikt om de bronvermeldings-URL te genereren.

  5. Selecteer Volgende.

  6. Selecteer onder Tabellen kiezen de tabel die de kolommen en de paginakoppeling bevat die u wilt selecteren. Een tabel wordt alleen weergegeven als deze minimaal één kolom met meerdere regels heeft.

    U kunt slechts één tabel tegelijk selecteren.

  7. Selecteer onder Paginakoppeling toevoegen de pagina waarop de tabel wordt gebruikt.

    Notitie

    • Zorg ervoor dat u de juiste pagina selecteert. Anders geeft de bot een onjuiste bronvermeldings-URL voor de antwoorden.
    • De pagina moet id als queryreeksparameter gebruiken. Als u een andere parameternaam gebruikt, werkt de bronvermeldings-URL niet correct.

  8. Selecteer onder Kolommen kiezen de kolommen die op de pagina worden gebruikt. Alleen kolommen met tekst op meerdere regels kunnen worden geselecteerd.

  9. Selecteer Volgende en controleer uw selectie.

  10. Selecteer Opslaan om de wijzigingen door te voeren.

Het uiterlijk van de agent aanpassen

U kunt de stijl van de agent aanpassen door de standaardklassen van het Cascading Style Sheet (CSS) te overschrijven. Hiertoe voegt u een element style toe aan de koptekstsjabloon en overschrijft u de waarden door de volgende stappen te volgen:

  1. Open de code-editor van de site.

  2. Vouw in de Explorer-navigatie de map web-templates uit.

  3. Open Header.html.

  4. Voeg uw element style of script toe.

    Schermopname van Visual Studio, met de map web-templates, het bestand Header.html en het stijlelement met een CSS-selector gemarkeerd.

  5. Overschrijf de nodige stijlen.

Agent-widget

Schermopname van de chatbotwidget.

Pictogram samengevouwen agent:

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

Knopinfo:

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

Pictogramafbeelding:

<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>

Notitie

Vervang <image URL> door de werkelijke bron-URL van de afbeelding. Gebruik een extern pad of upload een afbeelding naar de tabel Webbestand en gebruik de URL ervan.

Agent-elementen

De CSS-voorbeelden in deze sectie laten zien hoe u elk van de genummerde chatbotelementen in de volgende schermopname kunt aanpassen.

Schermopname van een chatbot met afzonderlijke elementen die zijn benoemd en genummerd.

1. Header

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

2. Instellingen voor hoogte en breedte

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

3. Agentvenster

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

4. Bubble van een agent

Achtergrondkleur:

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

Tekstkleur:

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

5. Bubbel van de gebruiker

Achtergrondkleur:

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

Tekstkleur:

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

.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. Instellingen voor privacyberichten

Achtergrondkleur:

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

Tekstkleur:

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