Webpage

🎥 Integrate SeaChat Widget on Webpage

Customize Your Own Company Webpage Widget

Webpage widget is a powerful tool that allows you to integrate SeaChat into your website. This feature enables you to provide real-time customer support and engage with your website visitors. The widget can be customized to match your brand identity and website design. You can also create forms to collect visitor information and feedback.

SeaChat Widget Configuration

SeaChat widgets come with a range of customization options to help you create a seamless customer experience. You can adjust the widget’s appearance, behavior to suit your needs.

Basic Settings and Chat Setting

Here, you can define the widget’s name, description, and choose the widget UI language in Basic Setting. Scroll down to see the Chat Setting. Here you can define the agent’s behavior during the chat.


Basic setting on SeaChat

Basic Setting for Style


Chat setting on SeaChat

Chat Setting for Agent’s Answers


Everytime you make a change you can see the change in the preview window by clicking on Preview. Once you are satisfied with the changes, click on Save.

⚠️ Attention

Please note that the changes will not be saved until you click on the Save button. We recommend you to click on the Preview button to see the changes, and only after saving the changes can you click on Test AI Agent.


Basic setting on SeaChat

Preview Window


Card Settings

In addition to the fully customizable widget, you can also create cards to display information to your customers. Cards can be used to provide information to user when they first land on your website. You can also attach links to the cards to direct users to specific pages. To add more cards, click on the Plus button.


Chat setting on SeaChat

Design your Card


Custom Forms: Pre-chat user information collection form

Sometimes you may want to collect information from your customers. You can create a custom form to collect information such as name, email, and phone number. This information can be used to provide personalized support to your customers. Depending on your use case, we can define new forms and reuse old ones.


Custom form setting on SeaChat

Choose or Create Customer Forms



Custom form setting on SeaChat

Choose Before Chats Start


To edit a form, click on the Edit button after click on the . You can also delete a form by clicking on the Delete button.


Custom form setting on SeaChat

Choose or Create Customer Forms


Custom Forms: CSAT Survey Form

You can now collect customer feedback effortlessly with CSAT Survey Form — just like how you set up a User Information Collection Form! When a visitor tries to close the WebChat Widget, the form will automatically pop up, allowing the visitor to leave a star rating and optionally write a comment.

To set up:

  1. Click the Add New Form button and choose the Customer Satisfaction Survey card.
Custom form setting on SeaChat

Choose Customer Satisfaction Survey


  1. Configure the Survey
  • Turn on the Enable switch.
  • Customize fields based on your needs including: form name, survey title, survey description, and choose to enable or disable comment box (for written feedback). If enabled, you can also customize the placeholder Text in the comment box. Click Save when you’re done.
  1. Follow the following Installation step to install the updated widget code your website.

  2. View the Survey Results

    Now, when visitors chat with your AI Agent and click the bottom-right icon to close the widget, the CSAT Survey Form will pop up. If the visitor submits feedback, you can go to SeaChat’s Conversations page and view the star rating and comments by clicking the avatar of the conversation.


Custom form setting on SeaChat

Demonstration of how your website visitor can leave a feedback



Custom form setting on SeaChat

View Customer Satisfaction Survey Result


Installation

Now that you have customized your widget, you can install it on your website. Simply copy the provided code snippet from Install Widget and paste it into your website’s HTML code. That is, the end of your current <body>{...}</body> tag.

The widget will be displayed on your website, allowing you to provide real-time support to your customers.


SeaChat interface that guides the user to install the webpage widget

Follow the Installation Procedure


Support

Need assistance? Contact us at seachat@seasalt.ai.

Any questions? We follow up with every message.