Nachrichten-Widget

Betten Sie eine Liste Ihrer aktuellen TeamMessages auf Ihrer eigenen Website ein. Perfekt zur Anzeige von Neuigkeiten, Ankündigungen oder Alarmen für Ihre Besucher.

Übersicht

Das Nachrichten-Widget ermöglicht es Ihnen, die aktuellen Nachrichten Ihres Teams auf einer externen Website anzuzeigen. Anwendungsfälle sind unter anderem:

  • Anzeige von Neuigkeiten oder Ankündigungen auf Ihrer Firmen-Website
  • Anzeige von Alarmen auf einer Intranet-Seite
  • Integration des Nachrichtenverlaufs in eigene Anwendungen

Authentifizierung

Die Widget-API erfordert einen Bearer-Token zur Authentifizierung. Erstellen Sie einen API-Token in Ihren Kontoeinstellungen:

  1. Melden Sie sich in Ihrem Konto an
  2. Gehen Sie zu API-Tokens
  3. Erstellen Sie einen neuen Token
  4. Kopieren Sie den Token und verwenden Sie ihn in Ihrer Widget-URL

Sicherheitshinweis

Halten Sie Ihren API-Token vertraulich. Wenn Sie das Widget auf einer öffentlichen Website einbetten, ist der Token im Seitenquelltext sichtbar. Für öffentlich zugängliche Widgets sollten Sie serverseitige Includes verwenden, bei denen der Token auf Ihrem Server bleibt.

API-Endpunkte

Endpunkt Beschreibung
/api/v1/widget/messages/ Gibt Nachrichten als JSON zurück (für eigene Integrationen)
/api/v1/widget/embed.html Gibt HTML-Fragment oder vollständige Seite zum Einbetten zurück

Parameter

Parameter Erforderlich Beschreibung Default
token Ja API-Token zur Authentifizierung -
tm Ja Team-ID (Kundennummer) -
ac Ja Komma-getrennte Konto-IDs (Teamlisten-IDs) -
nu Nein Anzahl der anzuzeigenden Nachrichten (max. 100) 10
sf Nein Absendername anzeigen (1=ja, 0=nein) 1
st Nein Teamlisten-Adresse anzeigen (1=ja, 0=nein) 0
ds Nein Direkt-SMS einschließen (1=ja, 0=nein) 0

Zusätzliche Parameter für HTML-Einbettung

Parameter Beschreibung Default
fp Vollseiten-Modus - enthält HTML/HEAD/BODY-Tags (1=ja, 0=nur Fragment) 0
fm Vollständige E-Mail-Adressen anzeigen (1=ja, 0=nur Benutzername) 0
hl Überschrift mit Teamnamen anzeigen (1=ja, 0=nein) 1
css Benutzerdefinierte CSS-URL (optional, zusätzlich zu Standardstilen) -

Einbettungsmethoden

Methode 1: iFrame

Die einfachste Methode - betten Sie das Widget in einem iFrame ein:

iFrame-Einbettung

<iframe
    src="https://www.teammessage.de/api/v1/widget/embed.html?tm=YOUR_TEAM_ID&ac=YOUR_ACCOUNT_IDS&fp=1&token=YOUR_TOKEN"
    width="100%"
    height="400"
    frameborder="0">
</iframe>

Tipp

Verwenden Sie fp=1 (Vollseiten-Modus) beim Einbetten in einem iFrame. Dies enthält die notwendige HTML-Struktur und CSS.

Methode 2: JavaScript Fetch

Für mehr Kontrolle laden Sie die JSON-Daten und rendern Sie sie selbst:

JavaScript-Integration

<div id="teammessages"></div>
<script>
fetch('https://www.teammessage.de/api/v1/widget/messages/?tm=YOUR_TEAM_ID&ac=YOUR_ACCOUNT_IDS&token=YOUR_TOKEN')
    .then(response => response.json())
    .then(data => {
        const container = document.getElementById('teammessages');
        data.messages.forEach(msg => {
            const div = document.createElement('div');
            div.innerHTML = `
                <p><strong>${new Date(msg.date).toLocaleString()}</strong></p>
                <p>${msg.text}</p>
            `;
            container.appendChild(div);
        });
    });
</script>

Methode 3: Server-Side Include (PHP)

Für bessere Sicherheit laden Sie das Widget auf Ihrem Server, wo der Token nicht für Besucher sichtbar ist:

PHP-Include

<?php
$token = 'YOUR_SECRET_TOKEN';
$team_id = 'YOUR_TEAM_ID';
$account_ids = 'YOUR_ACCOUNT_IDS';

$url = "https://www.teammessage.de/api/v1/widget/embed.html?" . http_build_query([
    'tm' => $team_id,
    'ac' => $account_ids,
    'nu' => 5,
    'token' => $token
]);

echo file_get_contents($url);
?>

JSON-Antwortformat

Der JSON-Endpunkt gibt Daten im folgenden Format zurück:

JSON-Antwort

{
    "team_name": "Demo Team",
    "messages": [
        {
            "date": "2026-01-18T10:30:00Z",
            "from_name": "Max Mustermann",
            "from_email": "max@example.de",
            "team_address": "demo@tmsg.de",
            "text": "This is a sample message text.",
            "sms_sent": 5,
            "email_sent": 12
        }
    ]
}

CSS-Styling

Die HTML-Einbettung verwendet die folgenden CSS-Klassen, die Sie anpassen können:

Klasse Element
.tmsg_h1 Teamname-Überschrift
.tmsg_listdiv Container für Nachrichtentabelle
.tmsg_table Nachrichtentabelle
.tmsg_row Nachrichtenkopfzeile (Datum, Absender)
.tmsg_date Datum/Zeit-Zelle
.tmsg_from Absendername-Zelle
.tmsg_teamname Teamlisten-Adresse-Zelle
.tmsg_icons Zustellungssymbole (SMS/E-Mail)
.tmsg_textrow Nachrichtentext-Zeile
.tmsg_text Nachrichtentext-Zelle
.tmsg_footer Fußzeile mit TeamMessage-Link
.tmsg_error Fehlermeldung
.tmsg_empty Keine-Nachrichten-Platzhalter

Sie können eine benutzerdefinierte CSS-URL mit dem css-Parameter angeben, um Stile zu überschreiben:

Benutzerdefiniertes CSS

...&css=https://example.com/my-widget-styles.css

Ihre Konto-IDs finden

So finden Sie die Konto-IDs für Ihre Teamlisten:

  1. Melden Sie sich in Ihrem Konto an
  2. Gehen Sie zu Teamlisten
  3. Die Konto-ID wird in der Liste oder in der URL beim Bearbeiten einer Teamliste angezeigt

Sie können Nachrichten aus mehreren Teamlisten anzeigen, indem Sie die IDs durch Kommas trennen:

ac=123,456,789

Fehlerantworten

HTTP-Status Code Beschreibung
401 -1 API-Token erforderlich oder ungültig
400 -4 Keine gültigen Konto-IDs angegeben
400 -5 Team nicht gefunden oder keine gültigen Konten für Team

Beispiel

Vollständiges curl-Beispiel

# JSON format
curl "https://www.teammessage.de/api/v1/widget/messages/?tm=100042&ac=123,456&nu=5&token=YOUR_TOKEN"

# HTML format (fragment)
curl "https://www.teammessage.de/api/v1/widget/embed.html?tm=100042&ac=123,456&nu=5&token=YOUR_TOKEN"

# HTML format (full page for iframe)
curl "https://www.teammessage.de/api/v1/widget/embed.html?tm=100042&ac=123,456&nu=5&fp=1&token=YOUR_TOKEN"

Legacy-URL

Die Legacy-URL showtmsg.php ist weiterhin für Abwärtskompatibilität verfügbar. Sie erfordert jedoch jetzt einen API-Token:

https://www.teammessage.de/mbr/showtmsg.php?tm=100042&ac=123&token=YOUR_TOKEN
Menü