Unanswered

Bot icon is not visible on published website.

(0) Share

Report

Posted on by julianhoewel_95

106

Hi,

we implemented a virtual agent on our website based on the concept that the bot automatically starts the conversation when it is opened (https://docs.microsoft.com/en-us/power-virtual-agents/configure-bot-greeting). This work's fine.

The problem we have is that the bot's icon is not visible on our website, but in contrast to that it's showing just fine on the demo-website or in the virtual agent

Website (live)Preview in Virtual Agents

Any solutions or hints for this problem?

Thanks in advance!
Julian

Categories:

General

All responses (4)

Answers (0)

fernandosilva 785 on at

Like (0)

Report
Re: Bot icon is not visible on published website.

Hi @julianhoewel_95 ,

If you use a custom canvas like the one in this page: https://docs.microsoft.com/en-us/power-virtual-agents/customize-default-canvas
you can customize the bot and user bot.

This is what I did:

const styleSet = window.WebChat.createStyleSet({ // Add styleOptions to customize Web Chat canvas bubbleBackground: 'rgba(250, 250, 250, 1)', bubbleFromUserBackground: 'rgba(250, 250, 250, 1)', rootHeight: '100%', rootWidth: '100%', backgroundColor: 'white', hideUploadButton: false, userAvatarBackgroundColor: 'white', botAvatarBackgroundColor: 'white', }); // Set the avatar options. const avatarOptions = { backgroundColor: 'white', botAvatarBackgroundColor: 'rgba(255, 255, 255, 1)', // accent: 'rgba(255, 255, 255, 1)', botAvatarImage: '../../chatbot/images/chatboticon.png', botAvatarInitials: 'Bot', userAvatarImage: '../../chatbot/images/chatboticonuser.png', userAvatarInitials: 'User', }; fetch(theURL) .then(response => response.json()) .then(conversationInfo => { window.WebChat.renderWebChat({ directLine: window.WebChat.createDirectLine({ token: conversationInfo.token, }), // webSpeechPonyfillFactory: window.WebChat.createBrowserWebSpeechPonyfillFactory(), // store: store, styleSet, styleOptions: avatarOptions }, document.getElementById('webchat') ); }) .catch(err => console.error("An error occurred: " + err));

I hope it helps.
Monkeyman 325 on at

Like (0)

Report

Re: Bot icon is not visible on published website.

Yes, I would try this.
julianhoewel_95 106 on at

Like (0)

Report

Re: Bot icon is not visible on published website.

The icon is hosted directly in virtual agents, nowhere else.
As you see in my screenshots the icon is showing in the preview, but not on our website where the bot is embedded.
Unfortunately I don't have access to the HTML-Code, because our website is managed by an external company.
Is it necessary to also upload the bot's icon into the website's html files?
Monkeyman 325 on at

Like (0)

Report

Re: Bot icon is not visible on published website.

Hey, where have you hosted the image? Is the image accessible from anywhere?