Das bekommst du
- Eine Offline-HTML-Seite oder echte Routen in React, Next.js, Vue, Svelte oder Astro
- Folgenarchiv mit Suche und Filtern, Folgenseiten mit Kapiteln und Notizen
- Ein angedockter Player mit Kapiteln, Warteschlange, Tempo und einer Jetzt-läuft-Ansicht auf dem Handy
- Ein Validator für Routen, Barrierefreiheit, den Player und übrig gebliebene Beispieltexte
- Optional Fotobereinigung, Cover-Serie, Intro-Thema und Trailer mit PopNow nach Preisangebot
Gut für
- Interviewpodcasts und Shows mit Co-Hosts
- Marken- oder Firmenpodcasts, die eine gepflegte Startseite brauchen
- Erzählreihen, die nach Staffeln geordnet sind
Nicht für
- Videozentrierte Shows
- Feeds hinter einer Bezahlschranke
- Netzwerke, die viele verschiedene Shows auflisten
So nutzt du ihn
In Claude oder ChatGPT
Nutze den PopNow-Skill „Podcast-Website-Vorlage“ (podcast-website-template) dafür: Bau die Seite für Long Lunch, eine wöchentliche Interviewsendung mit Restaurantbesitzer:innen. Folgen und Audiolinks stehen in unserem RSS-Feed unter feeds/longlunch.xml.
In einem Coding-Agent
/popnow-podcast-website-template Bau die Seite für Long Lunch, eine wöchentliche Interviewsendung mit Restaurantbesitzer:innen. Folgen und Audiolinks stehen in unserem RSS-Feed unter feeds/longlunch.xml.
Dann probier
Zeig mir vorher das Angebot für ein 30-sekündiges instrumentales Intro-Thema und einen gesprochenen Trailer aus unserer Show-Beschreibung.
Sechs Folgen sind Soloausgaben. Mach dafür eine Cover-Serie im Zweifarbenlook.
Das solltest du bereithalten
- Showname, Moderation, Zeitplan und die RSS-Feed-URL
- Die Folgenliste mit Daten, Längen, Zusammenfassungen und Kapiteln
- Audiolinks von deinem Podcast-Hoster und Fotos, die du verwenden darfst
- Optional: ein PopNow-API-Schlüssel für Cover, Titelmusik und Trailer
Ähnliche Skills
Alle ansehen →- Web
3D-Avatar-Maker
+25Baue im Browser eine niedliche 3D-Figur im Plüschtier-Look und speichere sie als transparentes PNG oder 3D-Seite.
- Web
Kalender-Heatmap
+25Ein Jahr täglicher Aktivität als schattiertes Kalenderraster, mit Serien, Summen und Tastaturbedienung.
- Web
KI-SaaS-Landingpage
+25Warmes Sandpapier und feine Linien um ein lebendiges Kanban-Board, auf dem ein Assistent Aufgaben plant.
- Web
Animierte Hero-Section
+25Ein Landingpage-Hero mit sanft wechselndem Schlagwort, zwei Buttons und einem breiten Bildrahmen.
- Web
Getränkemarken-Website-Vorlage
+25Sonnige Website für Getränke- oder Snackmarken: Shop, Kistenkonfigurator, Händlerkarte und Demo-Kasse in einer Datei.
- Web
Shader-Hero-Website für Agenturen
+25Orange-Shader hinter großer Aussage, Pillen-Navigation und versetztem Raster mit Fallstudien.
- Web
Dunkle SaaS-Landingpage
+25Eine dunkle, bewegungsreiche Marketingseite für ein Softwareprodukt, geliefert als eine eigenständige HTML-Datei.
- Web
Designer-Portfolio-Website
+25Sechs geneigte Karten um eine verblassende Überschrift auf ruhigem Grau, eine rote Porträtkarte, Fallstudien.
- Web
Entwickler-Portfolio-Website
+25Eine dunkle persönliche Website für Entwickler mit Fallstudien, Artikeln, Vorträgen, Lebenslauf und Kontaktformular.
- Web
Redaktionelle SaaS-Website
+25Marineblauer geteilter Hero, Serifen-Überschrift neben einem Dokumentarbild, schräge Bänder, ein Kobaltakzent.
- Web
Website für Freelance-Designer:innen
+25Eine mutige Ein-Personen-Studioseite mit festen Paketpreisen, Paketseiten, Fallstudien und Anfrageformular.
- Web
Glassmorphism-Website-Vorlage
+25Mattglas-Pillen auf Fastschwarz, große Serifen-Überschrift mit einem kursiven Wort und E-Mail-Anmeldung.
- Web
Website für Hardware-Produkte
+25Riesige haarlinige Modellnamen auf Silber-Studioaufnahmen, Datenkarten und eine maßstabsgetreue Reihe.
- Web
Interaktives Architekturdiagramm
+25Ein offline nutzbares, klickbares Systemdiagramm aus einem geprüften JSON-Modell, mit den Belegen zu jedem Kasten.
- Web
Interaktiver Raster-Hero
+25Dunkles Raster feiner Fäden, das sich zum Cursor neigt und bei jedem Klick einen Ring ausrollt.
- Web
Knowledge-Graph-Explorer
+25Mach aus Projektnotizen einen durchsuchbaren Offline-Graphen, in dem jede Aussage auf ihre Quellzeile verweist.
- Web
KPI-Dashboard-Vorlage
+25Vier KPI-Kacheln mit Veränderungs-Chips über einem leuchtenden Liniendiagramm, Aufschlüsselung und Zielbalken.
- Web
Landingpage aus KI-Mockups
+25Drei Entwürfe ganzer Seiten ansehen, einen wählen, dann baut dein Agent ihn als sauberen Code.
- Web
Magazin-Website-Vorlage
+25Eine Magazin-Website in Printqualität mit Artikeln, Themen, kleinem Shop und Abos, als eine HTML-Datei.
- Web
Partikel-Animations-Hero
+25Text auf warmem Papier neben einer drehenden Kugel aus Tinten- und Türkispunkten, die sich je Idee formt.
- Web
Persönliche Marken-Website
+25Ein Porträt, das in warmes Papier übergeht, darüber eine feine Klammer, daneben kurze und fette Aussagen.
- Web
Tierbedarf-Shop-Website-Vorlage
+25Ein funktionierender Tierbedarf-Shop mit Katalog, Varianten, Tasche, Nachfüll-Planer und Demo-Kasse in einer HTML-Datei.
WebHandgezeichneter Preisbereich
+25Eine Preistabelle im Notizbuchstil mit schrägen Tintenkarten, Jahresumschalter und Dunkelmodus, in einer Offline-Datei.
- Web
Kinoreife Produkt-Launch-Seite
+25Fastschwarze Filmseite: Serifen-Titelkarte über gleitendem Licht, Letterbox-Nachtszene, Reservierungsformular.
- Web
Website für Forschungsarbeiten
+25Projektseite zu deinem Paper mit interaktiver Abbildung 1, Ergebnissen, Grenzen und Zitat mit einem Klick.
- Web
Admin-Dashboard-Vorlage
+25Eine funktionierende Backoffice-Konsole mit Diagrammen, Tabellen, Kanban und Kalender, als eine Offline-HTML-Datei.
- Web
SaaS-Landingpage-Vorlage
+25Eine ruhige, helle Marketingseite für ein Softwareprodukt mit funktionierender Produktkonsole, Preisen und Registrierung.
- Web
Portfolio-Website im Scrapbook-Stil
+25Ein mehrseitiger Online-Lebenslauf aus Papierobjekten, mit Fallstudien und druckbarem Lebenslauf.
- Web
Sneaker-Shop-Website-Vorlage
+25Ein kompletter Schuh- oder Modeshop mit Katalog, Produktseiten, Warenkorb und Demo-Checkout in einer HTML-Datei.
- Web
Website für Sportvereine
+25Eine Seite für Verein, Fitnessstudio oder Studio mit Stundenplan, Trainerseiten, Mitgliedschaften, Platzplan und Buchung in einer Datei.
- Web
Kundenstimmen-Wand
+25Eine Wand aus Kundenzitaten als Masonry-Raster oder langsam driftende Spalten, in der nur Zitate stehen, denen Menschen zugestimmt haben.
- Web
Website für Reisebüros
+25Eine bildstarke Seite für Touren, Guides oder Lodges mit Reisesuche, Buchungsanfragen und einem Reise-Finder-Quiz.
- Web
Landingpage für Workflow-Automatisierung
+25Graphit-Seite mit kleiner Überschrift und einem lebenden Knotengraphen, der läuft und Logs streamt.
Fragen
Spielt der Player unsere echten Folgen ab?
Ja. Gib jeder Folge ihre Audio-URL von deinem Podcast-Hoster, dann nutzt der Player ein echtes Audioelement mit Spulen, Kapiteln, Tempo und Weiterlaufen. Ohne URL läuft eine stumme Demo-Uhr, damit sich das Layout prüfen lässt.
Unsere Gastfotos sind alle unterschiedlich. Passen die Cover zusammen?
Ein CSS-Zweifarbenfilter macht aus jedem quadratischen Foto dasselbe Cover in Marineblau und Hellblau. Bei stark unpassenden Fotos kann PopNow unruhige Hintergründe freistellen, kleine Bilder hochskalieren und das Licht angleichen, ohne die Person zu verändern.
Kann PopNow unsere Einlaufmusik machen?
Ja, optional: ein instrumentales Thema von 20 bis 40 Sekunden und ein gesprochener Trailer mit einer synthetischen Stimme, jeweils vorab beziffert. Der Skill enthält einen ffmpeg-Befehl, der beides mischt.
Funktioniert es für eine Solo- oder erzählende Sendung?
Ja. Gäste werden zu Themen oder Abschnitten, Staffeln können den Hauptfilter bilden, und Folgen ohne Gastfoto bekommen das eingebaute Sendungsbild oder eine erzeugte Cover-Serie.
Worin unterscheidet es sich von der kostenlosen Seite, die mein Podcast-Hoster mir gibt?
Hoster-Seiten sind eine Folgenliste. Diese Podcast-Website-Gestaltung ergänzt einen abspielbaren Hero, Gastseiten, Shownotes mit Zeitmarken und einen Player, der beim Blättern weiterläuft. Sie dient auch als Podcast-Landingpage für einen Start.