Skip to main content

Chatbox pages

A chatbox page is a public page for one of your shared chatboxes, at /c/<name>/<id>. Anyone can open it without signing in, so it's the link to share on Discord, social media or your own site. It's separate from browsing the Chatbox Workshop.

Pages are optional. A chatbox only has one if you create it. This works the same way as widget pages.

What visitors see​

  • A live preview of your published chatbox, with a few sample messages already on screen.
  • Demo buttons for the kinds of messages your chatbox shows, such as chat, subs or raids. Visitors press them to try it. Reset starts over.
  • Style options, a sidebar where visitors try the colours and sizes you made adjustable. Nothing is saved.
  • Under the preview, About, Gallery and Links, with More by you beside them. A section with nothing in it is left out.
  • A Works with list and a Before you install note.
  • A header bar with the Community logo, the chatbox name, its author and its licence, plus the Install with Community button.

The header bar and footer belong to Community and stay as they are.

Private chatboxes​

A private chatbox can have a page too. Anyone with the link can see it and try it, including the demo buttons and style options. It isn't listed anywhere and search engines are asked to skip it. Installing still needs the CC- code. Visitors sign in, then enter the code on the page.

So you can send one link for people to try your chatbox, and give the code only to the people you want to install it.

Create a page​

  1. Publish your chatbox first. A page can't go live until you do.
  2. In the Chat Overlay page, open the Page view and click Create page.
  3. Design the page, then click Save page.
  4. Turn on Page is live. Until you do, only you can see it.

Use Copy link to share it, or View page to open it.

The Page editor​

TabWhat it does
ThemeAccent colour, background, light or dark mode, and the preview backdrop.
CSSYour own styles for the page.
ContentThe link name, the About text, gallery images and links.
StartThe stage size, and the style values the page opens with. Use current values copies the ones from your editor.

Page CSS follows the same rules as widget page CSS. The page editor lists the parts you can style.

Your page always shows what you last published, not your working copy. Publish an update to change what visitors see.