cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
HemanthN
Helper III
Helper III

botAvatarImage and userAvatarImage is not working in PVA

Hi,

 

Anyone facing issue with botAvatarImage and userAvatarImage?

I see the botAvatarImage and userAvatarImage are not working. I am referring to the doc provided by PVA. URL:https://powervirtualagents.microsoft.com/en-us/blog/change-your-power-virtual-agents-default-canvas-...


I had also posted the issue earlier but no luck.

@BoLi Can you please help?

 

<!DOCTYPE html>
<html>
<head>
    <title>Contoso Sample Web Chat</title>
    <!-- This styling is for the Web Chat demonstration purposes. It is recommended that style is moved to separate file for organization in larger projects -->
    <style>
        html, body {
            height: 100%;
        }

        body {
            margin: 0;
        }

        h1 {
            font-size: 16px;
            font-family: Segoe UI;
            line-height: 20px;
            color: whitesmoke;
            display: table-cell;
            padding: 13px 0px 0px 20px;
        }

        #heading {
            background-color: black;
            height: 50px;
        }

        .main {
            margin: 18px;
            border-radius: 4px;
        }

        div[role="form"]{
            background-color: black;
        }

        #webchat {
            position: fixed;
            height: calc(100% - 50px);
            width: 100%;
            top: 50px;
            overflow: hidden;
        }

    </style>

</head>
<body>
    <div>
        <div id="heading">
            <!-- Change the h1 text to change the bot name -->
            <h1>Contoso Bot Name</h1>
        </div>
        <div id="webchat" role="main"></div>
    </div>

  <script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>

  <script>
       const styleOptions = {

          botAvatarImage: 'https://image.flaticon.com/icons/svg/3324/3324775.svg',
          userAvatarImage: 'https://image.flaticon.com/icons/svg/3324/3324784.svg'

        };

        // Add your BOT ID below
        var BOT_ID = "ABC";
        var theURL = "https://powerva.microsoft.com/api/botmanagement/v1/directline/directlinetoken?botId=" + BOT_ID;

      fetch(theURL)
            .then(response => response.json())
            .then(conversationInfo => {
                window.WebChat.renderWebChat(
                    {
                        directLine: window.WebChat.createDirectLine({
                            token: conversationInfo.token,
                        }),
                        styleOptions
                    },
                    document.getElementById('webchat')
                );
            })
            .catch(err => console.error("An error occurred: " + err));

    </script>
  </body>
</html>

 

1 ACCEPTED SOLUTION

Accepted Solutions
renatoromao
Super User
Super User

Hi @HemanthN ,

 

Please, follow this topic: https://powerusers.microsoft.com/t5/General/Bot-Avatar-and-User-Avatar-images-not-working/m-p/669088...


Did I answer your question? Mark my post as a solution!
Thanks!

Renato Romão,

Connect with me here 😉

Power Virtual Agents course (+2.650 students) : English | Português

View solution in original post

1 REPLY 1
renatoromao
Super User
Super User

Hi @HemanthN ,

 

Please, follow this topic: https://powerusers.microsoft.com/t5/General/Bot-Avatar-and-User-Avatar-images-not-working/m-p/669088...


Did I answer your question? Mark my post as a solution!
Thanks!

Renato Romão,

Connect with me here 😉

Power Virtual Agents course (+2.650 students) : English | Português

View solution in original post

Helpful resources

Announcements
PVA_User Group Leader_768x460.jpg

Manage your user group events

Check out the News & Announcements to learn more.

Community Connections 768x460.jpg

Community & How To Videos

Check out the new Power Platform Community Connections gallery!

Carousel 2021 Release Wave 2 Plan 768x460.jpg

2021 Release Wave 2 Plan

Power Platform release plan for the 2021 release wave 2 describes all new features releasing from October 2021 through March 2022.

Welcome Super Users.jpg

Super User Season 2

Congratulations, the new Super User Season 2 for 2021 has started!

Center-of-Excellence-Starter-Kit-cropped 768x460.png

The Total Economic Impact™ of Power Virtual Agents

Read this 2021 commissioned study, conducted by Forrester Consulting.

Top Solution Authors
Users online (1,236)