Skip to content
HelSup Help Center
Help Center/Knowledge base & design
Knowledge base & design

Customize the chatbox

Select a chatbox layout and review the visitor’s conversation and self-service experience.

1 min read · HelSup product documentation
On this page
  1. Overview
  2. When to use this
  3. Where to find the controls
  4. Who can make these changes
  5. Before you begin
  6. Follow these steps
  7. Settings reference
  8. Example workflow
  9. Good practices
  10. Important considerations
  11. If something does not work

Overview

Presets: Elegant Classic (migration default), Modern SaaS, AI Gradient, Minimal, Glass, Professional Blue, Soft Rounded, Compact Support, Dark Pro, Knowledge Assistant. Size Compact / Standard / Large. Dark: Follow ES / Light / Dark / System.

When to use this

Header layouts change; minimize and status stay. Document tab is visual only. Ticket tab uses Form Builder.

Where to find the controls

Settings → System → Appearance → Chatbox or Live Chat → Chatbox.

Who can make these changes

Support Admin.

Before you begin

Uncheck default colors to set header, bubbles, composer, tabs, and ticket submit independently.

Follow these steps

Select a preset, pick size, save, open the widget. Do not expect a second HTML app — CSS data attributes restyle the existing widget.

Settings reference

Existing chats migrate to Elegant Classic so upgrades are not visually breaking.

Example workflow

Knowledge Assistant lightens the header and emphasizes docs chrome. Dark Pro uses dark surfaces.

Good practices

Ticket fields are designed in Ticket Form Builder (chat_widget surface), not here.

Important considerations

Configure the Add New Ticket fields in Ticket Form Builder; chatbox appearance controls do not change the submission schema.

If something does not work

If tabs disappeared, a CSS override in Theme Builder custom CSS may be hiding .es-chat-tabs.

Continue learning

Build a ticket form→Choose the right appearance controls→

Let’s solve it together.

Can’t find what you need? Our support team can help with your next step.

Contact support ↗
LIFETIME PARTNER POLICY

One introduction.
A lifetime of shared growth.

Introduce HelSup to your customers, readers or community. Earn 30% on their first purchase and 20% on every subsequent purchase and renewal throughout their customer lifetime with HelSup.

Read our invitation to partners ↗
30%FIRST PURCHASE
20%Every subsequent
purchase & renewal

From recommendation to reward

  1. 01

    Get your personal link

    Sign in to your HelSup customer account and open Partner program to access your referral link.

  2. 02

    Recommend with confidence

    Share the link in a useful review, tutorial, customer proposal or with your community. Explain your partner relationship.

  3. 03

    Track your commission

    Follow attributed purchases and commission status in your partner dashboard. Eligible commissions are reviewed before payout.

YOUR LINK, IN PRACTICE

What does a referral link look like?

https://helsup.com/?ref=HS-EXAMPLE

Here, HS-EXAMPLE illustrates a partner code. Your dashboard gives you your own code and complete link. Copy that full link and share it with the customer; do not use this example as your personal link.

For example: “Looking for a customer support solution? Explore HelSup through my partner link: [paste your personal link here].” When an eligible customer purchases through your link, their first purchase earns 30%; later purchases and renewals earn 20%.

Open my partner dashboard →
YOUR CUSTOMER RELATIONSHIP KEEPS WORKING

A $100 first purchase earns $30.
A later $100 purchase or renewal earns $20.

Illustrative amounts, after discounts and excluding tax.

A customer relationship that lasts

30% first, 20% thereafter. Receive 30% on the customer’s first eligible paid purchase, then 20% on subsequent purchases and renewals throughout that customer’s lifetime on HelSup.

From link to lifetime attribution. The initial referral link is remembered for 30 days in the same browser. Once the referred customer’s first paid purchase is recorded, their partner relationship continues without needing another referral click.

Completed payments. Commission is calculated after discounts and before tax. Free orders and self-referrals do not qualify. Refunds reduce or reverse the associated commission.

Review and payout. Earnings appear as pending until reviewed by HelSup. Payout is processed manually after approval. Contact partner support for payment arrangements.