Partajați prin


Particularizarea propriului copilot

Când creați un copilot pentru un site web, copilot folosește conținutul de pe site-ul de găzduire pentru a genera răspunsuri. Microsoft Dataverse indexează conținutul site-ului și tabelele configurate și Copilot Studio resumează conținutul și tabelele indexate pentru a genera răspunsuri.

Utilizatorii site-ului autentificat primesc răspunsuri personalizate, rezumate, care sunt aliniate cu rolurile lor web. Pentru a îmbunătăți modelul de conținut pentru utilizatorii site-ului autentificat, rafinați datele urmând acești pași:

  1. În Power Pages, accesați spațiul de lucru Configurați.

  2. Sub Copilot, selectați Adăugați copilot.

  3. Sub Rafinați datele, selectați Efectuați modificări.

  4. Selectați Alegeți controlul de căutare a tabelelor pentru a selecta sau a șterge selecția de tabele.

    • Puteți selecta mai multe tabele în această secțiune. Asigurați-vă că fiecare tabel pe care îl selectați este folosit pe site.
    • În paginile următoare, specificați pagina în care este utilizat tabelul, pentru a genera adresa URL a citației.
  5. Selectați Următorul.

  6. Sub Alege tabele, selectați tabelul care conține coloanele și linkul către pagină pe care doriți să îl selectați. Un tabel apare numai dacă are cel puțin o coloană cu mai multe linii.

    Puteți selecta doar un singur tabel la un moment dat.

  7. Sub Adăugați link pentru pagină, selectați pagina în care este utilizat tabelul.

    Notă

    • Asigurați-vă că selectați pagina corectă. În caz contrar, botul furnizează o adresă URL de citare incorectă pentru răspunsuri.
    • Pagina trebuie să folosească id ca parametru șir de interogare. Dacă utilizați orice alt nume de parametru, adresa URL a citației nu funcționează corect.
  8. Sub Alegeți coloanele, selectați lista coloanelor care sunt utilizate pe pagină. Doar coloanele care au text cu mai multe linii sunt disponibile pentru selecție.

  9. Selectați Înainte și examinați selecția.

  10. Selectați Salvați pentru a trimite modificările.

Personalizați aspectul copilot

Puteți personaliza stilul copilot prin suprascrierea claselor implicite Foaia de stil în cascadă (CSS). Pentru a face acest lucru, adăugați un element style la șablonul antet și înlocuiți valorile urmând acești pași:

  1. Accesați editorul de cod al site-ului.

  2. În navigarea Explorer , extindeți folderul șabloane-web .

  3. Deschideți Header.html.

  4. Adăugați-vă elementul style / script .

    Captură de ecran a Visual Studio, evidențiind folderul de șabloane web, fișierul Header.html și elementul de stil cu un selector CSS .

  5. Ignorați stilurile adecvate.

Copilot widget

Captură de ecran a chatbot-ului widget.

Copilot pictogramă restrânsă:

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

Indicator:

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

Imagine pictogramă:

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

Notă

  • Înlocuiți <image URL> cu adresa URL reală a sursei imaginii. Faceți referire la o cale externă sau încărcați o imagine în tabelul Fișier web și utilizați adresa URL a acesteia.

Copilot elemente

CSS Eșantioanele din această secțiune oferă exemple care arată cum să personalizați fiecare dintre elementele chatbot numerotate în următoarea captură de ecran.

Captură de ecran a unui chatbot cu elemente individuale numite și numerotate.

1. Antet

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

2. Înălțime și lățime

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

3. Copilot fereastra

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

4. Bubble de la copilot

Culoare de fundal:

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

Culoarea textului:

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

5. Bubble de la utilizator

Culoare de fundal:

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

Culoarea textului:

.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. Mesaj de confidențialitate

Culoare de fundal:

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

Culoarea textului:

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