SPCast Player einbinden und testen

Mit einem Player auf Ihrer Website können Besucher Ihr Radio direkt einschalten. Den passenden Player und die Einbindung finden Sie nach der Einrichtung von SPCast in Ihrer Produktverwaltung im STREAMPANEL Kundencenter. Unser Support hilft Ihnen bei der Auswahl und beim Einbau in Ihre Homepage.

So kommen Sie vom Kundencenter zum Player

1. Melden Sie sich im STREAMPANEL Kundencenter an und öffnen Sie Ihr eingerichtetes SPCast-Produkt.
2. Öffnen Sie die Produktverwaltung. Die dokumentierte Oberfläche führt unter Tools zu den HTML5-Playern mit und ohne Cover.
3. Wählen Sie die gewünschte Variante. Übernehmen Sie den dort für Ihre Station angezeigten Code. Der einfache Standardplayer benötigt HTML; die MSE-Variante zusätzlich JavaScript, der Player mit Cover auch CSS.
4. Öffnen Sie in Ihrem CMS einen HTML- oder Code-Bereich an der Stelle, an der der Player erscheinen soll. Fügen Sie die Bestandteile entsprechend den Möglichkeiten Ihres CMS ein und speichern Sie zunächst eine Vorschau.
5. Öffnen Sie die Vorschau wie ein Besucher und starten Sie die Wiedergabe. Wenn Ihr CMS Skripte entfernt oder der Player stumm bleibt, unterstützt Sie unser Support bei der Einrichtung.

Einfaches Beispiel für eine eigene HTML-Seite

Für den Standardplayer mit einer direkt abspielbaren Audioadresse genügt ein Audioelement. Dieses Beispiel entspricht dem in der Abbildung gezeigten Aufbau:

<audio controls preload="none"
       src="https://HOSTNAME.sp.radio.fm/stream">
  Ihr Browser unterstützt diesen Audioplayer nicht.
</audio>

Ersetzen Sie die gesamte Beispieladresse durch die öffentliche HTTPS-Audioadresse Ihrer Station aus der Produktverwaltung. HOSTNAME ist ein Platzhalter. Verwenden Sie hier keinen Moderatorenzugang und kein Sendepasswort.

Der Browser zeigt seine eigenen Wiedergabetasten. Der Ton startet nach einer bewussten Aktion des Hörers. Das Beispiel ergänzt weder Cover noch Titelanzeige und ersetzt keine MSE- oder HLS-Einbindung. Für diese Varianten verwenden Sie den zugehörigen Playercode aus der Verwaltung. Die HTML-Audio-Dokumentation erläutert die verwendeten Attribute.

Player mit Cover, MSE oder bestehender Radio-Software

Beim Player mit Cover gehören HTML, CSS und JavaScript zusammen. Fügen Sie die bereitgestellten Bestandteile vollständig ein. Für CMS mit getrennten Feldern für HTML, Design und Skripte hilft Ihnen der Support bei der Zuordnung. Teilen Sie uns dazu Ihr CMS und den gewünschten Player mit.

Für den AIO Radio Station Player gibt es eine eigene Anleitung zur MSE-Anbindung. Sie beschreibt das Laden des stationseigenen spAudioPlayer.js in dessen template.html. Dieser Weg gilt für den AIO-Player.

So hören Ihre Besucher das richtige Programm

Verwenden Sie auf einer HTTPS-Website eine HTTPS-Audioadresse. AutoDJ verarbeitet ausschließlich MP3; im Livebetrieb sind weitere Formate möglich. Für die Wiedergabe zählt der vom Player genutzte Ausgabeweg.

• Öffnen Sie die eingebettete Wiedergabe auf Smartphone und Computer. Starten und pausieren Sie den Player auch per Tastatur.
• Hören Sie eine AutoDJ-Playlist ab. Übernehmen Sie mit dem Live-Encoder und trennen Sie ihn anschließend, um die Rückkehr zum AutoDJ zu hören.
• Prüfen Sie bei einem Player mit Metadaten auch Titel und Cover. Laden Sie die Seite danach neu.

Funktioniert die direkte Höreradresse, aber die Einbindung nicht, nennen Sie dem Support Ihre Website, Ihr CMS, den gewählten Player und die Fehlermeldung. Funktionieren beide Wege nicht, hilft das Einrichtungstutorial bei der ersten Hörprobe. Da wir SPCast selbst entwickeln, können wir bei Fehlern auch die Software prüfen und nacharbeiten.

Bei einem Anbieterwechsel aktualisieren Sie neben dem Website-Player auch Apps und Radioverzeichnisse. Der Migrationsleitfaden hilft bei der Umstellung.