Aracılığıyla paylaş

Aracınızı özelleştirme

Bir web sitesi için bir aracı oluşturduğunuzda, yanıt oluşturmak için barındırma sitesindeki içeriği kullanır. Microsoft Dataverse site içeriğini ve yapılandırılmış tabloları indeksler. Copilot Studio indekslenen içerikleri ve tabloları özetleyerek yanıtlar üretir.

Kimliği doğrulanmış site kullanıcıları, web rolleriyle uyumlu, özelleştirilmiş, özetlenmiş yanıtlar alır. Kimliği doğrulanmış site kullanıcıları için içerik modelini, aşağıdaki adımlarla verileri iyileştirerek geliştirin:

  1. Power Pages içinde Çalışma alanını ayarla'ya gidin.

  2. Copilot altında Aracı ekle'yi seçin.

  3. Verilerinizi belirginleştirme altında, Değişiklik yap'ı seçin.

  4. Tabloları seçmek veya temizlemek için Tablo arama denetimini seç'i seçin.

    • Bu bölümde birden çok tablo seçebilirsiniz. Seçtiğiniz her tablonun sitede kullanıldığından emin olun.
    • Sonraki sayfalarda, atıf URL'sini oluşturmak için tablonun kullanıldığı sayfayı belirtin.

  5. İleri'yi seçin.

  6. Tablo seç altında, seçmek istediğiniz sütunları ve sayfa bağlantısını içeren tabloyu seçin. Bir tablo yalnızca en az bir çok satırlı sütuna sahipse görünür.

    Bir defada yalnızca tek bir tablo seçebilirsiniz.

  7. Sayfa bağlantısı ekle'nin altında, tablonun kullanıldığı sayfayı seçin.

    Not

    • Doğru sayfayı seçtiğinizden emin olun. Aksi takdirde bot, yanıtlar için yanlış bir alıntı URL'si sağlar.
    • Sayfa, sorgu dizesi parametresi olarak id kullanılmalıdır. Başka bir parametre adı kullanırsanız, alıntı URL'si düzgün çalışmaz.

  8. Sütunları seçin altında, sayfada kullanılan sütunları seçin. Yalnızca çok satırlı metin içeren sütunlar seçim için kullanılabilir.

  9. İleri'yi seçin ve seçiminizi gözden geçirin.

  10. Değişiklikleri göndermek için Kaydet'i seçin.

Aracının görünümünü özelleştirme

Varsayılan Basamaklı Stil Sayfası (CSS) sınıflarını geçersiz kılarak aracının stilini özelleştirebilirsiniz. Bunu yapmak için, başlık şablonuna style öğesini ekleyin ve aşağıdaki adımları izleyerek değerleri geçersiz kılın:

  1. Sitenin kod düzenleyicisini açın.

  2. Gezgin gezinti bölmesinde web-templates klasörünü genişletin.

  3. Header.html dosyasını açın.

  4. style veya script öğenizi ekleyin.

    Visual Studioekran görüntüsü, web-templates klasörünü, Header.html dosyasını ve CSS seçicili stil öğesini vurgulamaktadır.

  5. Uygun stilleri geçersiz kılın.

Aracı arabirim öğesi

Sohbet botu arabirim öğesinin ekran görüntüsü.

Aracı daraltıldı simgesi:

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

Araç ipucu:

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

Simge görüntüsü:

<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

<image URL> öğesini gerçek görüntü kaynağı URL'si ile değiştirin. Harici bir yol kullanın veya Web Dosyası tablosuna bir resim yükleyin ve URL'sini kullanın.

Aracı elemanları

Bu bölümdeki CSS örnekleri, aşağıdaki ekran görüntüsünde numaralandırılmış sohbet botu öğelerinin her birinin nasıl özelleştirileceğini gösteren örnekler sağlar.

Tek tek öğelerin çağrıldığı ve numaralandırıldığı bir sohbet botunun ekran görüntüsü.

1. Başlık

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

2. Yükseklik ve genişlik ayarları

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

3. Temsilci penceresi

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

4. Bir aracıdan gelen baloncuk

Arka plan rengi:

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

Metin rengi:

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

5. Kullanıcıdan baloncuk

Arka plan rengi:

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

Metin rengi:

.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. Gizlilik mesajı ayarları

Arka plan rengi:

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

Metin rengi:

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