Theme-Builder Pro

Dein eigenes Design ohne eine Zeile Code

Theme-Builder Pro ist ein visueller Editor für das komplette Aussehen deiner Radio-Seite. Du klickst dir Farben, Schriften und Layout zusammen, siehst die Änderung sofort in einer Live-Vorschau und speicherst das Ergebnis als eigenes Theme. Dazu kommt ein KI-Generator, der dir aus einer kurzen Beschreibung ein fertiges Farbschema baut. Gedacht für alle, die ein individuelles Design wollen, ohne sich mit CSS herumzuschlagen.

Was du konkret damit machen kannst

Farben und Schriften live anpassen

Jede Farbe deiner Seite (Hintergrund, Akzent, Buttons, Text) stellst du mit einem Color-Picker ein. Die Schrift wählst du direkt aus den Google-Fonts. Alles, was du änderst, siehst du sofort in der Vorschau, bevor es live geht.

Ein Theme aus einer Idee generieren lassen

Du beschreibst in einem Satz, was du willst (zum Beispiel "warmes Retro-Design für einen Oldie-Sender"), und der KI-Generator baut dir ein passendes Farb- und Schrift-Set. Entweder voll automatisch über deinen eigenen KI-Zugang oder im Manual-Modus, bei dem du den Text einfach in ChatGPT oder Claude kopierst.

Designs speichern, exportieren und weitergeben

Fertige Themes legst du als Entwurf ab, exportierst sie als .theme-zip und spielst sie auf einer anderen RadioCMS-Installation wieder ein. Praktisch, wenn du mehrere Sender betreust oder ein Design sichern willst.

Installation und Aktivierung

Theme-Builder Pro ist ein Premium-Plugin mit Lizenz-Key.

1. Admin -> Plugins -> Tab Marketplace
2. Theme-Builder Pro finden, lila PRO-Badge
3. Plugin laden + Lizenz klicken
4. Lizenzschlüssel im Format RCMS-XXXX-XXXX-XXXX-XXXX einfügen
5. Speichern und prüfen -> Plugin wird automatisch installiert
6. In der Plugin-Liste auf Aktivieren klicken, fertig

So nutzt du es, Schritt für Schritt

Schritt 1: Wo finde ich es?

Nach der Aktivierung erscheint in der Admin-Sidebar der Eintrag Theme-Builder. Darunter liegen Editor, Entwürfe, KI-Generator und Einstellungen.

Schritt 2: Im Editor ein Theme bauen

Öffne den Editor. Links wählst du die Farben (Color-Picker für jede CSS-Variable), die Schrift (Google-Fonts-Auswahl) und die Layout-Optionen (Ecken-Radius, Abstände, Header-Stil). Rechts siehst du die Live-Vorschau. Stell so lange ein, bis es passt.

Schritt 3: Optional per KI starten

Wenn du keine Lust auf manuelles Tüfteln hast, geh in den KI-Generator, beschreibe dein Wunsch-Design und lass dir ein Schema vorschlagen. Das Ergebnis landet im Editor und du kannst es weiter verfeinern.

Schritt 4: Speichern und aktiv schalten

Speichere das Theme als Entwurf. Wenn du zufrieden bist, exportierst du es als .theme-zip und spielst es über Einstellungen -> Themes (Core) als aktives Theme ein.

Tipps für den Alltag

1. Bau dir zuerst ein helles und ein dunkles Theme, dann kannst du je nach Jahreszeit oder Aktion schnell wechseln.
2. Nutze die Live-Vorschau auch im Handy-Format, damit das Design mobil genauso gut wirkt.
3. Halte den Akzent-Farbton kräftig genug, damit Buttons und Links sich klar abheben (guter Kontrast = bessere Lesbarkeit).
4. Speichere Zwischenstände als Entwürfe, dann kannst du jederzeit zu einer älteren Version zurück.
5. Für den KI-Generator reicht ein günstiges Modell (zum Beispiel ein Mini- oder Haiku-Modell) völlig aus, das spart Kosten.
6. Kein eigener KI-Zugang? Nimm den Manual-Modus, kopiere den Prompt in ChatGPT oder Claude und füge den JSON-Output zurück ein.
7. Exportiere dein Lieblings-Theme als .theme-zip und sichere es, dann ist es auch bei einem Server-Umzug sofort wieder da.

Was das Plugin NICHT macht

• Es baut keine kompletten Seiten-Layouts mit Inhaltsblöcken. Dafür ist der Page-Builder Pro v2 zuständig. Theme-Builder steuert das Design (Farben, Schriften, Abstände), nicht die Inhalte.
• Es schreibt keine eigenen CSS-Klassen von Hand. Es arbeitet über die vorgesehenen Theme-Variablen.
• Die KI-Funktion braucht entweder einen eigenen API-Key (OpenAI, Anthropic, Gemini, Mistral oder Groq) oder du nutzt den Manual-Modus. Es ist kein KI-Zugang im Plugin enthalten.

Beispiele zum Inspirieren

Beispiel 1: Oldie-Sender im Retro-Look

KI-Prompt "warmer Retro-Sound der 70er, Creme und Orange, runde Ecken". Im Editor den Akzent noch etwas dunkler ziehen für besseren Kontrast, Schrift auf eine Serifen-Font stellen, speichern, exportieren, aktiv schalten.

Beispiel 2: Moderner Dance-Sender

Dunkles Theme, kräftiger neon-türkiser Akzent, enge Ecken-Radien, klare Sans-Serif-Schrift. In der Vorschau prüfen, dass der Player-Button gut sichtbar ist.

Lizenz und Aktivierung

Theme-Builder Pro wird als Premium-Plugin im RadioCMS Community Hub angeboten. Nach dem Kauf bekommst du einen Lizenzschlüssel. Eine Lizenz erlaubt standardmäßig 1-2 Domains. Bei Fragen zur Lizenz: Mail an me@heikodeutsch.io.

Bei Fragen

Schreib eine Mail an me@heikodeutsch.io mit einem Screenshot von dem, was du bauen willst, dann gibts gezielte Tipps.

RadioCMS Community Edition, Theme-Builder Pro v1.0