ilch Forum » Allgemein » Design- und Projektvorstellungen » Ilch Radio – Neon Dark Layout v1.0

Geschlossen
  1. #1
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    314
    Beitragswertungen
    35 Beitragspunkte
    Ilch Radio – Neon Dark Layout v1.0

    Hallo zusammen,

    ich habe ein komplett neues Layout für Ilch erstellt, speziell für Internet-Radio-Seiten.

    Features:

    Fixierte Player-Bar oben mit ON AIR Anzeige, Equalizer-Animation und Audio-Player
    „Jetzt läuft" – zeigt automatisch den aktuellen Songtitel aus dem Stream (ICY-Metadaten, folgt Redirects automatisch)
    Studio-Widget in der Sidebar mit Live-Uhr, Datum und animiertem Equalizer – zeigt automatisch den Sendernamen aus dem Stream
    Neon/Lila Dark-Design mit animierten Hintergrund-Orbs, Neon-Grid und Scan-Linien-Effekt
    Vollständig anpassbar über die Admin-Einstellungen: Farben, Player-Höhe, Sidebar-Breite und -Position
    index_full.php für Forum, Gästebuch und User-Panel (kein Sidebar)
    Eigener PHP-Proxy für ICY-Streams (löst CORS und Redirect-Probleme)
    Eigener JSON-Proxy für externe Metadata-APIs
    Installation:
    Ordner ilchradio in application/layouts/ legen und im Admin aktivieren.

    Einstellungen:

    Stream-URL (MP3/AAC)
    Stationsname + Logo
    Alle Farben per Colorpicker
    Optionale externe Metadaten-API URL + JSON-Pfad

    Link direkt zum Repo für das Testen des Layouts.
    github.com/BlackRomeoIlch/ilchradio/tree/main

    Gruß,
    BlackRomeo


    verwendete ilch Version: 2.1.x

    betroffene Homepage: ilch.captive-it.de/


    Zuletzt modifiziert von BlackRomeo am 10.03.2026 - 06:14:58
    2 Mitglieder finden den Beitrag gut.
  2. #2
    User Pic
    WeLo Mitglied
    Registriert seit
    22.05.2012
    Beiträge
    168
    Beitragswertungen
    29 Beitragspunkte
    Ist der Stream auch in der Lage einen laut.fm ICEcast-Stream abzuspielen?
    Bei ICEcast benötigt man noch einen Mountpoint.
    Wenn ja, dann hätte ich noch ein script dafür, welches auch gleichzeitig ein Coverbild vom aktuellen Titel anzeigt, welches man dann oben neben der Titelanzeige setzen kann.

    Ich werde das Layout gleich mal auf meiner Radioseite testen. TOP, dass sich jetzt mal wieder etwas tut hier bei ilch. Yes

    PS.: Die Titelanzeige oben ist fast kaum lesbar, dafür sollte man besser eine andere Schriftfarbe wählen. Trotz Brille kann ich das kaum lesen, was da steht. zwinker


    Zuletzt modifiziert von WeLo am 10.03.2026 - 16:34:07
    0 Mitglieder finden den Beitrag gut.
  3. #3
    User Pic
    rumpel Mitglied
    Registriert seit
    02.12.2021
    Beiträge
    95
    Beitragswertungen
    20 Beitragspunkte
    Design ist Nice auch mal was anderes.

    Lg

    rumpel
    1 Mitglieder finden den Beitrag gut.
  4. #4
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    314
    Beitragswertungen
    35 Beitragspunkte
    ZitatZitat geschrieben von WeLo
    Ist der Stream auch in der Lage einen laut.fm ICEcast-Stream abzuspielen?
    Bei ICEcast benötigt man noch einen Mountpoint.
    Wenn ja, dann hätte ich noch ein script dafür, welches auch gleichzeitig ein Coverbild vom aktuellen Titel anzeigt, welches man dann oben neben der Titelanzeige setzen kann.

    Ich werde das Layout gleich mal auf meiner Radioseite testen. TOP, dass sich jetzt mal wieder etwas tut hier bei ilch. Yes

    PS.: Die Titelanzeige oben ist fast kaum lesbar, dafür sollte man besser eine andere Schriftfarbe wählen. Trotz Brille kann ich das kaum lesen, was da steht. zwinker


    Zuletzt modifiziert von WeLo am 10.03.2026 - 16:34:07


    ja auch die Stream URL´s von laut.fm können abgespielt werden auch wen kein .mp3 ect als endung steht fügt dieser es automatisch hinzu.

    Aktuelle Version auf GitHub.

    ZitatZitat geschrieben von rumpel
    Design ist Nice auch mal was anderes.

    Lg

    rumpel



    Danke dir.

    ja möchte mal ein Paar neue Standart Designs für Ilch Basteln wo für jeden etwas dabei ist.


    Zuletzt modifiziert von BlackRomeo am 10.03.2026 - 17:33:22
    0 Mitglieder finden den Beitrag gut.
  5. #5
    User Pic
    WeLo Mitglied
    Registriert seit
    22.05.2012
    Beiträge
    168
    Beitragswertungen
    29 Beitragspunkte
    So, ich hab es jetzt mal getestet. Funktioniert so weit einwandfrei, auch der Stream funktioniert. Yes

    Ich hab aber einen bösen Fehler entdeckt. Da ich nicht das Modul Artikel als Startseite benutze, sondern meine eigene erstellte Startseite, ist mir aufgefallen, dass das marquee, in dem mehrere Bilder sind, einfach nach jedem Bild einen Zeilenumbruch macht, obwohl in keiner Zeile ein <br> gesetzt ist. Das marquee soll einfach die Stammsendungen von rechts nach links durchlaufen lassen, aber nach jedem Bild kommt ein Zeilenumbruch. Woran liegt das denn?

    PS.: Der Titel wird nicht angezeigt

    Um den Titel bei einem laut.fm Stream abzufragen, muss man folgenden Code benbutzen:
    $station = "Stationame";  //Mountpoint ohne /
    $json_station = file_get_contents("http://api.laut.fm/station/".$station);
    $obj_station = json_decode($json_station);
    $json_song = file_get_contents("http://api.laut.fm/station/".$station."/current_song");
    $obj_song = json_decode($json_song);
    
    echo $obj_song->artist->name . " - " . $obj_song->title;


    Vllt. kannst Du das ja noch mit einbinden. zwinker


    Zuletzt modifiziert von WeLo am 10.03.2026 - 18:21:17
    0 Mitglieder finden den Beitrag gut.
  6. #6
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    314
    Beitragswertungen
    35 Beitragspunkte
    ZitatZitat geschrieben von WeLo
    So, ich hab es jetzt mal getestet. Funktioniert so weit einwandfrei, auch der Stream funktioniert. Yes

    Ich hab aber einen bösen Fehler entdeckt. Da ich nicht das Modul Artikel als Startseite benutze, sondern meine eigene erstellte Startseite, ist mir aufgefallen, dass das marquee, in dem mehrere Bilder sind, einfach nach jedem Bild einen Zeilenumbruch macht, obwohl in keiner Zeile ein <br> gesetzt ist. Das marquee soll einfach die Stammsendungen von rechts nach links durchlaufen lassen, aber nach jedem Bild kommt ein Zeilenumbruch. Woran liegt das denn?

    PS.: Der Titel wird nicht angezeigt

    Um den Titel bei einem laut.fm Stream abzufragen, muss man folgenden Code benbutzen:
    $station = "Stationame";  //Mountpoint ohne /
    $json_station = file_get_contents("http://api.laut.fm/station/".$station);
    $obj_station = json_decode($json_station);
    $json_song = file_get_contents("http://api.laut.fm/station/".$station."/current_song");
    $obj_song = json_decode($json_song);
    
    echo $obj_song->artist->name . " - " . $obj_song->title;


    Vllt. kannst Du das ja noch mit einbinden. zwinker


    Zuletzt modifiziert von WeLo am 10.03.2026 - 18:21:17



    Sers bei mir werden die Titel Angezeigt bei meinem Test ^^
    Schau das du bei den Metadaten-API nichts drin stehen hast dann holt er sich die Infos direkt über die Stream URL.


    Arbeite auch gerade an einem IRC Chat Modul für Ilch,
    Und vErbessere nch ein wenig das Layout.


    Zuletzt modifiziert von BlackRomeo am 10.03.2026 - 18:40:09
    0 Mitglieder finden den Beitrag gut.
  7. #7
    User Pic
    WeLo Mitglied
    Registriert seit
    22.05.2012
    Beiträge
    168
    Beitragswertungen
    29 Beitragspunkte
    OK danke, das war der Fehler. Ich hab die Zeile jetzt geleert und jetzt wird der Titel angezeigt.

    Bleibt immer noch die Frage, warum auf der Startseite in dem marquee plötzlich Zeilenumbrüche gemacht werden, dass ist im Standarddesign nicht.

    Und 1 Frage hätte ich noch: Wo kann man die Größe des HTML5 Players ändern, also doppelt so lang?

    Zuletzt modifiziert von WeLo am 10.03.2026 - 18:58:40
    0 Mitglieder finden den Beitrag gut.
  8. #8
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    314
    Beitragswertungen
    35 Beitragspunkte
    ZitatZitat geschrieben von WeLo
    OK danke, das war der Fehler. Ich hab die Zeile jetzt geleert und jetzt wird der Titel angezeigt.

    Bleibt immer noch die Frage, warum auf der Startseite in dem marquee plötzlich Zeilenumbrüche gemacht werden, dass ist im Standarddesign nicht.


    Das weis ich leider nicht.


    ZitatZitat geschrieben von WeLo


    Und 1 Frage hätte ich noch: Wo kann man die Größe des HTML5 Players ändern, also doppelt so lang?


    Die Länge muss ich noch dazu machen Momentan nur die Höhe anpassbar lachen
    0 Mitglieder finden den Beitrag gut.
  9. #9
    User Pic
    WeLo Mitglied
    Registriert seit
    22.05.2012
    Beiträge
    168
    Beitragswertungen
    29 Beitragspunkte
    OK, dann muss ich mal suchen wo das ist.

    PS.: Bei dem Player musst Du das controls autoplay entfernen. Das ist laut AGB von GEMA und GVL nicht erlaubt!
    Außerdem fällt man vom Stuhl, wenn man die Boxen voll aufgedreht hat und die Seite gerade erst geöffnet wird. lachen zwinker
    0 Mitglieder finden den Beitrag gut.
  10. #10
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    314
    Beitragswertungen
    35 Beitragspunkte
    ZitatZitat geschrieben von WeLo
    OK, dann muss ich mal suchen wo das ist.

    PS.: Bei dem Player musst Du das controls autoplay entfernen. Das ist laut AGB von GEMA und GVL nicht erlaubt!
    Außerdem fällt man vom Stuhl, wenn man die Boxen voll aufgedreht hat und die Seite gerade erst geöffnet wird. lachen zwinker


    Hab das Autoplay eigentlich garnicht Aktiviert.
    hmm muss ich nochmal drüber schauen
    0 Mitglieder finden den Beitrag gut.
  11. #11
    User Pic
    WeLo Mitglied
    Registriert seit
    22.05.2012
    Beiträge
    168
    Beitragswertungen
    29 Beitragspunkte
    So, ich hab mal die Kopfleiste (header) geändert und erweitert.

    Jetzt wird noch zus. das aktuelle Coverbild, 4 weitere Player, das Moderatorbild mit Name und die Hörerzahl angezeigt.
    Die Titelanzeige hab ich als marquee gesetzt und auf width 200 begrenzt, damit rechts genug Platz bleibt für die anderen Elemente.

    Das Design ist recht gut gelungen Yes

    Zu sehen auf meiner Beta-Testseite radio2.hfr1.de/
    0 Mitglieder finden den Beitrag gut.
  12. #12
    User Pic
    BlackRomeo Moderator
    Registriert seit
    31.01.2014
    Beiträge
    314
    Beitragswertungen
    35 Beitragspunkte
    ZitatZitat geschrieben von WeLo
    So, ich hab mal die Kopfleiste (header) geändert und erweitert.

    Jetzt wird noch zus. das aktuelle Coverbild, 4 weitere Player, das Moderatorbild mit Name und die Hörerzahl angezeigt.
    Die Titelanzeige hab ich als marquee gesetzt und auf width 200 begrenzt, damit rechts genug Platz bleibt für die anderen Elemente.

    Das Design ist recht gut gelungen Yes

    Zu sehen auf meiner Beta-Testseite radio2.hfr1.de/


    Ok wen du magst kannst mir gerne das Script privat schicken dann würde ich das mit rein machen.
    0 Mitglieder finden den Beitrag gut.
  13. #13
    User Pic
    WeLo Mitglied
    Registriert seit
    22.05.2012
    Beiträge
    168
    Beitragswertungen
    29 Beitragspunkte
    ZitatZitat geschrieben von BlackRomeo
    Ok wen du magst kannst mir gerne das Script privat schicken dann würde ich das mit rein machen.


    Ich hab das script bereits mit im Design integriert und dann an entsprechender Stelle in der index.php per $this->getLayouUrl eingefügt.

    Ich bin noch mit dem LKW unterwegs. Ich kümmere mich heute Nachmittag darum, wenn ich zurück bin, per PN. zwinker

    EDIT1:
    Ich muss noch im Adminbereich ein Bilder-Uploader einbauen, damit die Moderatorenbilder im richtigen Ordner landen, um angezeigt werden zu können. Das dauert noch etwas. Melde mich später wieder.

    EDIT2:
    So, ich hab jetzt noch einen Bilder-Uploader im Adminbereich und einen laut.fm Stationname speichern eingebunden.
    Das script ist jetzt im Layout verankert. Schau mal PN zwinker

    Zuletzt modifiziert von WeLo am 11.03.2026 - 20:33:33
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu Design- und Projektvorstellungen

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten