In this article, we explain the different images you can customize in your chat widget.
Adding images to your chat widget makes your chatbot feel more personal and ensures it aligns with the look and feel of your website and brand. This makes communicating via the chat widget more engaging!
1. Header image
The header image is an important visual element that users will see at the top of the widget when they open the chat. This can be your company’s logo or another image that represents your brand.
- How to add the header image?
You can upload this image in the settings of your chat widget, which can be found through Integrations, under the relevant chat widget, in the Design tab under Header. Here, you can upload the desired image. The image should be a PNG, JPG or GIF file. We recommend uploading an image that is 116x692 pixels with a maximum size of 5MB. - Why is this important?
The header gives your chat widget a professional and recognizable appearance. A familiar logo helps integrate the chatbot seamlessly into your website.
2. Launcher image
The launcher image is the button visitors use to open the chat widget, typically located at the bottom right or left of your website (depending on your settings). This image should be inviting and reflect your brand.
- How to add the launcher image?
You can upload this image in the settings of your chat widget, found through Integrations, under the relevant chat widget, in the Design tab under Launcher. Here, you can choose to add the image as an icon or as the full button (custom launcher):-
The icon should be a PNG, JPG or GIF file. We recommend uploading an image that is 64x64 pixels with a maximum size of 5MB.
- The entire button (custom launcher) should be a PNG, JPG or GIF file. We recommend uploading an image that is 112x112 pixels with a maximum size of 5MB. The entire button will always be round and is only available in Business and Enterprise plan.
- It is also possible to create your own button. You can read more about this in this Help Center article.
-
- Why is this important?
The launcher is the first thing visitors see, so it needs to grab attention immediately. An eye-catching and attractive launcher encourages visitors to open the chat and start a conversation.
3. Avatar mage
The avatar is the image that represents your chatbot. This could be a friendly face, a company mascot, or simply your logo. It appears in two places in the chat widget: in the welcome screen and at the top of the conversation.
- How to add the avatar image?
You can add the avatar via the Chatbot Profile in Pulse. Navigate to Pulse, click on the three dots next to the relevant chatbot, and open the Chatbot profile. Under Avatar, you can upload an image. The maximum file size is 2MB. You can upload .png, .jpeg, and .gif files. We recommend using a square avatar with dimensions of 500x500 pixels. It is possible to upload avatars with other dimensions, but they will be resized automatically. After uploading, the avatar will immediately appear at the top of the pop-up. - Why is this important?
The avatar makes interactions more personal and approachable. A friendly avatar can make users feel like they are chatting with a real person or help clarify that they are speaking with a chatbot.
4. Brand avatar
In the design tab of your chat widget settings you will also see the option to add a brand avatar. This is only relevant when there is no chatbot active on your chat widget, because only then will the brand avatar show.
The avatar should be a PNG, JPG or GIF file. We recommend uploading an image that is 500x500 pixels with a maximum size of 1MB.