Help & Support

Your Cbox embed code is available at your control panel. You need this code to install your Cbox on your website.

Also on that page is your Quick Link — a URL which you can use to access your Cbox directly in your browser or on your mobile device.

Once you have created your Cbox account, go to the Publish page of your control panel. The code and steps for embedding your Cbox are provided there for a number of common platforms.

If you install your Cbox and all you see is code, or nothing at all, your web host may be removing or otherwise interfering with the HTML iframe tags that Cbox uses. Your Cbox code needs to be pasted into an area of your site that accepts HTML without modification. This may mean switching your editor from "rich text" or "WYSIWYG" mode into HTML-editing or "raw" mode, or you may need to open your template files in a plain-text editor like Notepad.

Remember that you always have the option of posting or sharing your Cbox Quick Link — this gives visitors direct access to your Cbox in a full-screen layout, so it's perfect as a mobile option or for stand-alone use.

Go to the Theme editor in your control panel. There you can specify the fonts and colours of your Cbox, using a point-and-click editor. You can always reset your theme to one of the preset defaults there, if you would like to start again.

If you have a Premium or Pro Cbox you can edit CSS, which gives you complete control over presentation.

If you have a Premium or Pro Cbox, you can create a moderator name for yourself at your Users page, and then log in on your Cbox using the "profile" link. You will see a delete icon [x] next to each message in your Cbox, and you will not have to log in at your control panel at all to delete messages.

Alternatively, visit your Messages page to delete messages individually or in bulk. Deleted messages are removed from your public Cbox history, but are preserved in your Archives.

Yes. In the Theme editor, simply delete the colour codes for the main and form background ("BG") elements. This will make the Cbox transparent, allowing whatever is behind the Cbox to show through.

Note that any pop-ups generated by a transparent Cbox will have the default background colour — usually white. If your font colour is light, it may be invisible in popups. You can fix this by editing the CSS to introduce a background-color rule for popups.

You need some development experience to make use of this feature, with the ability to edit your site's back-end code.

Cbox Pro supports Integration, which is a way to implement single sign-on. If users already log in or register with your site, Integration means they don't have to enter their name again on your Cbox.

Configure Integration at your control panel. Example code is available there. The rest of this article deals with general concerns.

How it works

Integration is implemented using query string parameters appended to the Cbox iframe URL. The final parameter is a signature generated from the rest of the URL. You don't need any external components or callbacks, just language support for HMAC-SHA256, base64-encoding, and url-encoding.

The signature is important to secure the generated URL against tampering by the user or any other intermediary. However, most back-end platforms have built-in support for the necessary functions.

Integrating avatars and profile links

The only required parameter is nme, for the user's name, and the signature, sig. But you can also pass lnk and pic parameters to Cbox, to take advantage of name links and avatars, respectively. These should be provided as absolute URLs. For example, https://yoursite.example.com/path/to/image.gif. Note that the respective display settings need to be enabled for name links or avatars to show up.

Integrating with mod/admin permissions

Integrated users' names will be registered with Cbox automatically, if they aren't already. This means you can confer mod/admin permissions at your Users page.

You can also use Integration with Moderated chat. With Moderated mode enabled, your Integrated users by default will not have voice permission. You will be able to review their messages as a mod or admin user in your Cbox and approve them accordingly.

Security

Note that if you have existing users registered before enabling Integration, they are authenticated by Integration regardless of their password. This means if you have an existing "admin" user registered with a password on your Cbox, and you then enable Integration, the corresponding user named "admin" on your site will get that name (and permission). This can be an advantage, but if it's a risk in your case, delete all registered users before enabling Integration.

The signature in the Integrated Cbox URL protects the name and other information in transit. However, if you are concerned about leaked URLs, you can limit URL validity by passing an additional (signed) query string parameter, valid_to, which should be set to a UNIX timestamp. The URL will stop working after the time specified.

You can also change the key used to generate the signature, by changing your security tag. This invalidates all your Cbox URLs, but requires that you change your published Cbox embed code accordingly.

Debugging

If you get an error in your Cbox saying that there's a problem with Integration, the most common cause is an invalid signature.

The first thing to do is right-click and inspect the Cbox iframe URL. You should have nme=...&sig=... parameters populated in the query string. If not, check that your embed code is in place and being parsed without errors.

If the sig parameter is present in the URL, confirm that it is being generated using the correct secret key. The key is available at your Integration page.

Ensure that you are url-encoding your query string parameters exactly once, and encoding before calculating the signature. The signature itself must then also be url-encoded, and appended to the URL. If you see the sequence %25XX in the URL, that's a sign that you might be applying url-encoding to already url-encoded strings.

If you are still getting errors, contact us including the code you are using and an example URL, and we should be able to assist.

Check that your Quick Link is enabled at your Publish page, and confirm that you have the correct URL for it.

We've recently launched a new version of Cbox with an entirely new interface. By going back to the basics and building a modern UI, we have created a more flexible, accessible platform to support future development.

Some of the things that have been improved in the new Cbox:

1. Mobile responsiveness. We've enlarged the buttons and done away with popups; overlays keep all functions in the Cbox itself.
2. Message history. Simply scroll back to load older messages.
3. Registration and login. It's clearer and quicker to register a name and log in with it.
4. Avatars. Users can upload pictures from within Cbox. No need to copy-paste URLs.
5. Themes. The new Cbox supports more fonts and more colour options.
6. Embedding. The embed code has been simplified to support more platforms.

Migrating to V10

If you already have an older Cbox, you can get the latest version by creating a new Cbox on your account. While it's not possible to transfer your data and settings automatically, we can transfer any paid credit balance if you decide to switch over to your new Cbox: simply contact us to request a transfer.

The option "Enable site whitelist" at your Publish page will prevent other websites from displaying your Cbox to their visitors.

When using this option, ensure the web address we have on record (also on that page) is the simplest possible address for your site. For example you should generally not include the "www." part nor any trailing path, like "/index.html".

When boxcode is disabled in Posting options, it is only disabled for user messages. You will still be able to use it for your Sticky message and Custom filtering rules.

Cbox supports boxcode, which is a way to add markup to messages. You can also use it to style your Sticky message and Custom filtering replacement text.

The boxcodes supported by Cbox are:

• [color=#ff0000]hex colour[/color] or [color=forestgreen]named colour[/color]
• [color=#f00,#ff0]foreground and background[/color]
• [b]bold text[/b]
• [u]underlined text[/u]
• [i]italicized text[/i]
• [s]struck-out text[/s]
• [q]quoted text[/q]
• [sub]_subscript[/sub]
• [sup]^superscript[/sup]
• [center]centered text[/center]
• [br]
  (line break)
• [big]larger font[/big]
• [small]smaller font[/small]
• [class=custom]custom-styled text[/custom]
• [code]fixed-width text[/code]
• [url=https://address.com/hyperlink]link text[/url] or [url]https://address.com/hyperlink[/url]
• [img=https://address.com/image.jpg]image title[/img] or [img]https://address.com/image.jpg[/img]

Combining boxcode

Besides using boxcode in Custom filtering replacement text, you can also match boxcodes in filter rules. See more.

It's possible to combine boxcode by nesting it, with some caveats:

1. Tags must be nested in the correct order: [b][u]bold underline[/u][/b] is valid but [b][u]broken[/b][/u] is not.
2. The same tag cannot be nested. For example, [class=one][class=two]some text[/class][/class] will not work. To get the intended behaviour in this case, you could have a combined class instead: [class=onetwo]some text[/class].
3. The no-attribute form of [url] (e.g. without link text), and both forms of the [img] tag, must be the innermost element in any nested sequence.

Styling boxcode

Boxcode is translated internally to HTML. You can thus affect the presentation of boxcode by editing your CSS. For example, to change the presentation of the [s] tag:

s {
	text-decoration: none; /* reset default */
	opacity: 0.2;
}

[class] parameters must start with a letter, and are limited to 20 alphanumeric characters. [class=blink] is valid but [class=2] is not.

The [class] boxcode is intended for open-ended styling. It produces a span with no default CSS. You can create a corresponding class using a cc_ prefix. For example, for blurred text, copy this to your CSS:

.cc_blur {
	text-shadow: #000 0 0 0.5em;
	color: transparent;
}

Now users can blur the text in their messages: [class=blur]this will be blurred![/class].

Find out more about custom CSS.