Del via

Tilpas din copilot

  • Artikel

Når du opretter en copilot for et websted, bruger copiloten indholdet fra værtswebstedet til at generere svar. Microsoft Dataverse indekserer webstedsindhold og konfigurerede tabeller og Copilot Studio opsummerer det indekserede indhold og de indekserede tabeller for at generere svar.

Godkendte webstedsbrugere modtager skræddersyede, opsummerede svar, der er tilpasset deres webroller. Hvis du vil forbedre indholdsmodellen for godkendte webstedsbrugere, skal du finjustere dataene ved at følge disse trin:

  1. I Power Pages skal du gå til Konfigurer arbejdsområde.

  2. Vælg Tilføj copilot under Copilot.

  3. Vælg Foretag ændringer under Finjustering af data.

  4. Vælg Opslagskontroltabellen for at vælge eller fjerne markeringen af tabeller.

    • Du kan vælge flere tabeller i denne sektion. Sørg for, at alle de tabeller, du vælger, bruges på webstedet.
    • På efterfølgende sider skal du angive den side, hvor tabellen bruges, for at generere URL-adressen til citatet.

  5. Vælg Næste.

  6. Under Vælg tabeller skal du vælge den tabel, der indeholder de kolonner og sidelink, du vil vælge. En tabel vises kun, hvis den har mindst én kolonne med flere linjer.

    Du kan kun vælge én tabel ad gangen.

  7. Under Tilføj sidelink skal du vælge den side, hvor tabellen bruges.

    Bemærk

    • Sørg for, at du vælger den rigtige side. Ellers angiver robotten en forkert citations-URL for svarene.
    • Siden skal bruge id som parameter for forespørgselsstrengen. Hvis du bruger et andet parameternavn, fungerer citatets URL-adresse ikke korrekt.

  8. Vælg den liste over kolonner, der bruges på siden, under Vælg kolonner. Det er kun kolonner med tekst med flere linjer, der kan vælges.

  9. Vælg Næste, og gennemgå dit valg.

  10. Vælg Gem for at sende ændringerne.

Tilpasse copilotens udseende

Du kan tilpasse copilotens typografi ved at tilsidesætte standardklasserne for overlappet typografiark (CSS). Det gør du ved at føje et style-element til overskriftsskabelonen og tilsidesætte værdierne ved at følge disse trin:

  1. Gå til webstedets kodeeditor.

  2. I Oversigt-navigationen, udvid mappen web-skabeloner.

  3. Åbn Header.html.

  4. Tilføj dit style element.

    Skærmbillede af Visual Studio, hvor mappen med webskabeloner, Header.html filen og stylelementet med en CSS vælger er fremhævet.

  5. Tilsidesæt de relevante styles.

Copilot-widget

Skærmbillede af chatrobotwidgetten.

Copilot skjult ikon:

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

Værktøjstip:

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

Copilot-elementer

CSS viser eksempler, der viser, hvordan du kan tilpasse hvert af de nummererede chatrobotelementer på følgende skærmbillede.

Skærmbillede af en chatrobot med individuelle elementer fremhævet og nummereret.

1. Sidehoved

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

2. Højde og bredde

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

3. Copilot-vindue

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

4. Boble fra copilot

Baggrundsfarve:

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

Tekstfarve:

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

5. Boble fra brugeren

Baggrundsfarve:

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

Tekstfarve:

.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. Privat meddelelse

Baggrundsfarve:

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

Tekstfarve:

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