SPChat Logo SPCHAT.EU
Live Demo
DE
Installation

Installation & Setup

Install and setup SPChat on your shared hosting in 5 minutes. Download from the customer center, PHP 8.2+, MySQL. No VPS or root access required.

Test the Live Demo View Integration Steps

System Requirements

SPChat setup runs on almost any shared hosting package.

PHP 8.2+
pdo_mysql, mbstring, json, fileinfo, curl
MySQL / MariaDB
InnoDB · utf8mb4
Apache, Nginx, or LiteSpeed
Rewrite to public/index.php
Storage space
for the application, uploads and optional modules
Step by Step

Installation in 5 Minutes

1

Download SPChat

The download is available in the STREAMPANEL Customer Center. SPCast customers will also find it there. Simply download and extract the ZIP package.

Customer Center, My Products, Click Open Product Management for SPChat, Download
2

Upload files

Upload all files via FTP to your web server. The public/ directory must be the document root. On most hosters, this is done via the file manager in cPanel or Plesk, or via an FTP client like FileZilla.

3

Create database

Create an empty MySQL database with a dedicated user via cPanel, Plesk, or phpMyAdmin. Note the credentials for step 4.

4

Start Web Installer

Access /install/ in your browser. The installer checks PHP extensions, configures the database, runs migrations, and creates the first admin account.

https://your-domain.com/install/
5

Done. SPChat is live.

After installation, you can log in directly. Under /admin/ you can set up rooms, invite users, and configure SMTP, GIPHY, custom CSS, and more.

Integration

Connect SPChat to Websites and OBS

The public chat URL is the starting point. Link to it, embed it when the frame policy permits, or load it as an OBS browser source.

Connect the Chat to an External Website

Connect SPChat using a chat link, iframe or built-in widgets. Widgets include chatbox, online users, room overview, statistics and message ticker.

  1. Choose the Public Chat URL

    Use an HTTPS address under your licensed domain, such as https://chat.my-radio.com/. Open the URL directly first and check sign-in, rooms and the mobile layout.

  2. Add a Chat Link to the Website

    Place the link in the navigation, player or broadcast page. A new tab keeps the website and chat technically separate.

    <a href="https://chat.my-radio.com/" target="_blank" rel="noopener">Open community chat</a>

  3. Embed an iframe or Chat Widget

    The security.allow_iframe and security.x_frame_options settings control embedding of the main chat. The sample configuration allows external embedding. Widget endpoints require widgets.enabled. Check your installation settings before embedding.

    <iframe src="https://chat.my-radio.com/widget/chatbox" title="Community chat" width="1200" height="800" loading="lazy"></iframe>

  4. Test the Embed in a Private Window

    Check sign-in, sign-out, room changes, file uploads and the layout on mobile and desktop. If the browser blocks the iframe, inspect Content-Security-Policy and X-Frame-Options on the chat domain.

Important: Widgets use /widget/ endpoints, such as /widget/online, /widget/rooms and /widget/ticker. JavaScript loaders use the corresponding .js URLs. Keep the standalone chat view accessible too.

Show the Chat as an OBS Studio Overlay

OBS Studio can load a web address as a browser source. No dedicated SPChat plugin is required. Use a separate user account without moderation privileges for broadcasts.

  1. Add a Browser Source

    Open the target scene, choose the plus sign under Sources, then select Browser. Give the source a clear name such as SPChat Overlay.

  2. Enter the Chat URL and Size

    Enter the public chat URL. Set the width and height to match the scene, such as 480 by 900 pixels for a narrow chat column.

  3. Reduce the Interface for the Overlay

    Use the OBS Custom CSS field for a transparent background. Make further changes with Custom CSS in the SPChat admin area. Use only selectors verified on your installation.

    body { background: transparent; overflow: hidden; }

  4. Choose the Connection Behavior

    Turn off the OBS option that shuts down the source when it is hidden if the chat should remain connected across scene changes. Refresh on scene activation only when a fresh page load is intended.

  5. Check a Test Recording

    Send test messages and check font size, contrast, crop and long display names. Review the result during a faster sequence of messages too.

Important: Browser Source and its Custom CSS field are OBS Studio features. See the official OBS documentation for details.

See SPChat before setting it up

Test the interface and chat flow in the live demo. Compare hosted chat and download licenses on the pricing page.

Test the Live Demo Choose your own chat