Your server, on your site

Create a server

A server is an isolated chat space. It gets its own users, rooms, and settings. Servers can only be created from a Divcord account on the dashboard.

1. Open the dashboard and create a Divcord account.
2. Click "Create Server" in the upper right. *Optionally allow public registration.
3. Open https://your-server.divcord.gg and sign in with the same username and password. You are the owner.

Every new server starts with a general room. Create more rooms when you need them. Your Divcord account is copied onto the new server so you can log in using the same creds as your divcord account. Each server keeps its own user list after that.

Server name rules

• 2 to 32 characters.
• Start with a letter or number. After that: a-z, 0-9, _, -.
• Stored lowercase. Spaces become hyphens.
• Some names are reserved (admin, docs, about, embed, www, and similar).

Once it exists, the public URLs look like this:

https://your-server.divcord.gg
https://your-server.divcord.gg#general
https://your-server.divcord.gg/embed/general

Embed a room

The smallest embed is one iframe. No JavaScript required. Visitors sign in (or go anonymous, if you allow it) inside the frame.

<iframe
  src="https://your-server.divcord.gg/embed/general"
  style="width:100%;height:480px;border:0;border-radius:12px"
  title="Chat">
</iframe>

Add embed.js when the host page should change the theme, inject CSS, or listen for new messages. Load the script, then call Divcord.connect on that iframe. Wait for bridge.ready before sending commands.

<script src="https://divcord.gg/embed.js"></script>
<iframe id="chat" src="https://your-server.divcord.gg/embed/general"></iframe>
<script>
  const bridge = Divcord.connect(document.getElementById('chat'));

  bridge.ready.then(function () {
    return bridge.setTheme('aurora');
  }).then(function () {
    bridge.on('new_message', function (msg) {
      console.log(msg.username, msg.content);
    });
  });
</script>

Named servers use https://your-server.divcord.gg/embed/room-id. Change general to any public room id on that server.

Customize with CSS

setTheme loads the same stylesheets as the main app (/themes/*.css, plus default /style.css): default, aurora, business, frutiger-aero, irc, lightcast.

bridge.setTheme('aurora');
bridge.setTheme('frutiger-aero', { reset: false });

setCSS injects a <style> tag inside the iframe, appended last. Default reset: true turns off the embed's own sheets first (icons, fonts, highlight, and the user-list menu stay on). Pass { reset: false } to layer on top. clearCSS() removes your sheet and turns the base sheets back on.

bridge.setCSS(`
  body { background: #0f172a !important; color: #e2e8f0 !important; }
  #embed-bar { background: #1e293b !important; border-color: #334155 !important; }
`, { reset: false });

Useful selectors

Use !important when a default rule is equally specific.

Full event list, snapshots, JSON payloads, and the postMessage protocol live on the embed API page.

Preview your server

This page can list servers you own if you are signed in on the main chat in this browser tab. Pick one to load the embed, edit CSS live, and copy a snippet aimed at that server.

Looking up your servers…

What next

• Embed API reference for events, snapshots, flair, and the protocol.
• Bot accounts if you want a script to talk in the same room.
• Lock down registration and hand out invite links from the dashboard page.