Add a new website widget
You can adjust the look and feel of the website widget entirely to the branding of your organisation. In this article we'll tell you how.
- Login to the Watermelon platform.
- Navigate to the Settings and select "Add/edit channels".
- Select "Website widget".
- Click "Add a new website widget".
- Fill in the URL of website on which you want to place the widget. Don't worry, you're not actually placing the widget on the website right now, but you're making the new widget easy to recognise in the menu. Click on "Continue".
- You can now see some code. In this article we explain how you can place the code on your website. This activates the widget on your website. For now we an click "I'll do it later". Next, click on "Set up account".
We can now start personalising the widget!
The company name
In the first field you can fill in your company name. In our case it's "Watermelon".
The status message
A status message is visible in the top part of the chat window, and says something about your organisation. Think about a message that says something about what the visitors can do or find, or perhaps the available times of your chat agents. In our case, we chose for:
"Our chatbot is available 24/7! Our colleagues are available from Monday till Thursday, from 08:00 to 18:00 and on Friday from 08:00 to 17:00 uur. 💬"
The welcome message
A welcome message can be set up to welcome the visitors and to invite them to ask their questions. In the case of a chatbot, and thus with the use of a start button, you could chose for something like this: "Click on the button to ask your question".
The eye-catcher
When you want to make the welcome message visible above the website widget icon as well, you can chose to turn on the eye-catcher as well. This eye-catcher will draw the attention of your website visitors, increasing the chance of your website widget being opened.
Changing the icon
In the menu Change icon you can decide how you want the icon of your website widget to look like. You can add a personalised icon. You can also choose on of our default icons (square or round).
An uploaded icon can be a maximum of 500 x 500 pixels. It can be a .jpg, .png or .gif file. The maximum file size is 1mb.
The colours
Turn the chat window in the colour of your brand. The main colour is visible in the company name, the chat window, the chat bubbles and the buttons. We recommend to keep the background colour light, to keep the conversation readable. You can fill in the hex code of your colours of choice under "Personalise" and "Colours". In our case we set the main colour to Yellow, and the background colour to White.
Watermelon Branding
Under Watermelon Branding you can decide if you want the "Powered by Watermelon" watermark is visible on your website widget.
Placeholder title
The placeholder title is the short bit of text which is visible in an empty typebar. You can also personalise this and fill it in to your liking. This way you can help visitors type in the right message. For example, you can use: "Type your question here".
Language
With the language option you can choose the language of your website widget information, like timestamps and calendar. This language is visible for visitors.
View code
Earlier we talked about placing the code on your website. With "View code" you can find the code of your website widget, at any time. In this article you can read how to place the code.
Remove account
Do you want to remove the website widget? Click on "Remove account". The website widget will no longer be active and your settings will be lost.
