TIKTOK LIVE STATUS by Tonino Gerns

Das Element zeigt auf deiner Joomla-Website an, ob ein TikTok-Konto gerade live sendet. Du setzt es im YOOtheme-Pro-Builder an die gewünschte Stelle, trägst den Benutzernamen ein und bestimmst den Text für live und für offline. Ausgegeben wird eine verlinkte Statusanzeige auf Basis von UIkit 3. Das Plugin läuft unter Joomla 5 und Joomla 6 mit YOOtheme Pro 4.x oder 5.x und ist kostenlos.

So wird der Status ermittelt

Die Prüfung läuft auf deinem Server: Joomla ruft die Live-Seite des Kontos bei TikTok ab und liest den Status aus dem eingebetteten Seiten-JSON. Lässt er sich nicht zweifelsfrei lesen, gilt das Konto als offline, statt fälschlich live zu melden. Das Ergebnis liegt pro Konto im Joomla-Cache, die Haltedauer stellst du im Feld Prüfintervall ein, ab Werk sind es 10 Minuten. Die Anzeige ist also kein Live-Ticker, sondern der Stand der letzten Prüfung, festgeschrieben beim Ausliefern der Seite. Im Frontend läuft dafür kein JavaScript.

Datenschutz: Die Abfrage verlässt deinen Server nicht

Der Browser deiner Besucher baut zu keinem Zeitpunkt eine Verbindung zu TikTok auf: kein Skript, kein Pixel, kein Cookie, keine Übertragung der Besucher-IP. Die einzige Verbindung kommt von deinem Server. Erst wer die Anzeige anklickt, landet in einem neuen Tab auf tiktok.com. Dieser Link trägt standardmäßig rel="noopener noreferrer", deine Seite wird also nicht als Referrer weitergereicht.

Darstellung im YOOtheme-Pro-Builder

Für die Optik stehen 14 feste UIkit-3-Stile bereit: vier Label-, sechs Button- und vier Hintergrund-Varianten. Dazu kommt der Auto-Modus, der bei live grün und bei offline rot einfärbt. Drei Größenstufen greifen bei den Button-Stilen, eine Option streckt die Anzeige auf volle Breite. Ob das Element bei offline überhaupt erscheint, entscheidet eine Checkbox: Ab Werk verschwindet es, solange nicht gesendet wird. Benutzername, Live-Text, Offline-Text, Link-Titel und ARIA-Label lassen sich per Dynamic Content an Joomla-Inhalte binden.

Barrierefreiheit und Absicherung

Der Status steht als Text im Markup, etwa JETZT LIVE oder Momentan offline, und wird nicht allein über die Farbe transportiert. Genau das verlangt WCAG 2.1 AA in Kriterium 1.4.1. Das TikTok-Icon ist per aria-hidden aus der Vorlesereihenfolge genommen, das aria-label des Links nennt Konto, Status und den Hinweis auf den neuen Tab. Der Fokusrahmen ist 2 Pixel stark. Ausgegebene Texte und die Ziel-URL werden maskiert, der Benutzername vorab gegen ein festes Zeichenmuster geprüft.