# 修改聊天的头像
1.将打算替换的图片放到模板代码 ServiceCloudChatDemo\\src\\assets目录下，
![](https://support.huaweicloud.com/devg-webdemo-cec/figure/zh-cn_image_0000001359519921.png)
2.用谷歌浏览器打开模板页面，键盘按F12打开调试页面，鼠标点击下图中的1指示的位置，然后点击2指示的地方，找到位置3所在类名"avatar-column",复制此类名到模板代码中全局搜索。
图1替换聊天头像1   
![](https://support.huaweicloud.com/devg-webdemo-cec/figure/zh-cn_image_0000001359799369.png)
3.找到如下文件MainContent.vue，将位置1中的src=""里的图片路径替换成打算替换的图片的路径。
图2替换聊天头像2   
![](https://support.huaweicloud.com/devg-webdemo-cec/figure/zh-cn_image_0000001359679809.png)