Oft ist die größte Hürde beim Start einer Community das „Eigengestaltete“.
Man möchte, dass Schriftart und Stil zu seiner Marke passen.
In diesem Beitrag möchte ich zeigen, was sich auf recht unkomplizierte Weise mit den folgenden Mitteln erreichen lässt:
- Discourse MCP - GitHub - discourse/discourse-mcp: MCP client for Discourse sites · GitHub
- Eine Pro- oder Business-Testversion von Discourse
- Ein Open AI Codex Abo
Ich habe mich hier für Codex entschieden, da das kürzlich veröffentlichte GPT-6 Astra ein unglaublich talentierter visueller Künstler ist. Kimi K3 und Fable sind in dieser Disziplin ebenfalls ziemlich stark, aber für diese Demo verwende ich Astra.
Schritt 1 – API-Schlüssel generieren
Gehe zu: your.site/admin/api/keys/new
Generiere einen globalen API-Schlüssel.
Sicherheitshinweis: Bewahre diesen Schlüssel sicher auf und erwäge, ihn nach Abschluss der Arbeiten zu widerrufen, da er unbegrenzten Zugriff auf die Website bietet.
Schritt 2 – Discourse MCP hinzufügen
In diesem Tutorial verwende ich Codex:
Bearbeite: ~/.codex/config.toml
[mcp_servers.discourse]
command = "npx"
args = [
"-y",
"@discourse/mcp@latest",
"--toolsets",
"all",
"--allow-writes",
"--site",
"https://figment123.discourse.group",
"--auth_pairs",
'[{"site":"YOUR_SITE","api_key":"YOUR_API_KEY","api_username":"system"}]',
]
(Hinweis: Codex lässt es nicht zu, auszuwählen, welche MCPs aktiviert oder deaktiviert sind; alles in der Konfiguration wird aktiviert. Du kannst enabled = false eintragen, um ein MCP vorübergehend zu deaktivieren.)
Ein Hinweis zu den Tools: Das Discourse MCP unterstützt über 140 Tools, diese Konfiguration macht sie alle verfügbar. Moderne Harnesses wie Claude und Codex können damit problemlos umgehen, allerdings könnten viele andere Harnesses bei so einer hohen Tool-Anzahl Schwierigkeiten haben – beispielsweise wird Grok Build ein Filtern erfordern.
Sobald du das Discourse MCP hinzugefügt hast, stelle sicher, dass dein Agent darauf zugreifen kann:
Schritt 3 – Gib deinem Agenten die Tools, die er für die Arbeit braucht
Ein Agent liefert deutlich bessere Ergebnisse, wenn er über Folgendes verfügt:
- Augen, also die Fähigkeit, seine Arbeit zu sehen. (Playwright MCP, Computer Use usw.)
- Kontext, das Discourse MCP hilft dabei, aber auch der Discourse-Quellcode.
- Bildgenerierung – falls du Assets usw. benötigst.
Die ChatGPT-App hat einen integrierten Browser; stelle sicher, dass er diesen verwendet. Klonen Sie das discourse/discourse-Codebase und starte deinen Agenten aus dem Discourse-Verzeichnis.
Keines davon ist erforderlich, aber es führt zu deutlich besseren Ergebnissen, wenn es vorhanden ist.
Schritt 4 – Gib deinem Agenten Intelligenz und eine klare Aufgabenstellung
Da ich in diesem Fall sehr gute Ergebnisse sehen wollte, entschied ich mich für GPT-6 Astra XHIGH.
Anschließend verfasste ich mit meiner KI eine kleine Aufgabenstellung (Briefing) darüber, was ich wollte (ein Community-Theme im Stil des New Yorker).
Von KI verfasste Aufgabenstellung
Erstelle The Salon, ein poliertes Discourse-Theme, das demonstriert, wie radikal ein Kunde die Identität von Discourse transformieren kann. Die kreative Referenz ist The New Yorker: eine redaktionelle Institution, deren Leser an der Unterhaltung teilnehmen. Erstelle eine originelle Identität, keine Replik – keine entlehnten Logos oder nicht lizenzierten proprietären Schriftarten. Verwarme warmes Elfenbein (#F7F4ED), fast schwarze Tinte (#20201E), zurückhaltendes redaktionelles Rot (#B52B32), feine Linien, großzügigen Weißraum, ausdrucksstarke Serifen-Überschriften, lesbaren Serifen-Fließtext und kompakte Sans-Serif-Metadaten. Monochrome Illustrationen sollten Witz und Charakter hinzufügen. Du hast kreative Freiheit, alle Assets, die die Demo benötigt, zu beschaffen, herunterzuladen oder zu generieren – Schriftarten, Illustrationen, Fotografie, Avatare und Icons – unter Verwendung entsprechend lizenzierter Materialien und unter Beibehaltung der Quellenangabe, wo erforderlich. Vermeide generische SaaS-Karten, falsches Pergament und dekorativen Ballast. Strebe nach einem zeitgenössischen Literaturmagazin mit einer lebendigen Community im Inneren, nicht nach einem Standard-Forum mit anderen Farben.
Du bist ausdrücklich ermächtigt, die Demo-Instanz mit den Kategorien, Themen, Antworten, fiktiven Beitragsprofilen und unterstützenden Inhalten zu bestücken, die benötigt werden, um das Erlebnis überzeugend zu machen. Bewahre den vorhandenen echten Inhalt auf und halte die fiktive Aktivität klar als Demo-Daten erkennbar. Erstelle fünf redaktionelle Abteilungen – The Commons, Arts & Letters, City Life, Science & Ideas, Table Talk – mit eigenständigen Beschreibungen und Illustrationen. Baue eine starke THE SALON-Masthead, eine kuratierte Leitdiskussion, sekundäre Schlagzeilen und eine Sektion für die neuesten Unterhaltungen. Befülle sie mit durchdachten, vielfältigen Diskussionen wie „Wann wurde aus jedem Hobby ein Nebenjob?“ und „Was würde tatsächlich deine Meinung ändern?“, mit überzeugenden Eröffnungsbeiträgen, substanziellen Meinungsverschiedenheiten, kurzen Antworten, Zitaten und gut ausgewählten Bildern. Füge genug Inhalt hinzu, um Dichte, Scrollen und Navigation zu demonstrieren; verwende keinen wiederholten Fülltext und lass keine wichtigen Screens leer. Jede Schlagzeile muss ein echtes Thema öffnen, und Aktivität, Antwortzähler und ungelesene Zustände müssen sichtbar bleiben. Trage die Identität durch die Kategorielisten, Themenseiten, Suche und den Composer: Eröffnungsbeiträge sollten sich wie schön gesetzte Essays anfühlen, während Antworten kompakte, nutzbare Unterhaltungen bleiben. Mobile sollte zu einer ruhigen Ein-Spalten-Erfahrung werden, und der dunkle Modus sollte ebenso durchdacht wirken.
Prüfe die Ziel-Discourse-Version und die unterstützten Theme-APIs, bevor du Implementierungsdetails wählst. Bevorzuge ein wartbares Theme und fokussierte Theme-Komponenten; vermeide Core-Patches, unnötige Plugins, brüchige DOM-Manipulation und erfundene Funktionen. Mache die redaktionelle Kuratierung explizit und konfigurierbar. Arbeite autonom an reversiblen Design-, Asset- und Staging-Entscheidungen, statt bei jedem Detail um Genehmigung zu bitten; etabliere die visuelle Sprache mit einer repräsentativen Startseite und einer befüllten Themenseite, bevor du die unterstützenden Oberflächen fertigstellst. Liefere ein installierbares Theme, die erforderlichen Komponenten, eine reproduzierbare Demo-Inhalts-Einrichtung, die Herkunft der Assets und knappe Installationsanweisungen. Verifiziere das Ergebnis in einer echten Discourse-Instanz auf Desktop und Mobile, einschließlich Tastaturnavigation, Kontrast, ungelesenen Zuständen, Suche, Zitieren und Verfassen. Erfasse die gleiche gestufte Community vor und nach der Anwendung des Themas, damit die Transformation unbestreitbar ist. Der Standard ist eine kundentaugliche Demonstration – keine Mockup, nicht nur eine schöne Startseite, sondern eine kohärente, funktionierende Community mit einem völlig anderen Gefühl des Ortes.
- Konsultiere den Discourse-Quellcode bei Bedarf
- https://figment123.discourse.group/ ist eine Demo-Seite, du kannst damit tun, was du willst, schau dir die Ergebnisse an, während du arbeitest, aktiviere das Theme
- Erstelle Themen bei Bedarf
Schritt 5 – Sieht großartig aus!
Eine Stunde und zehn Minuten später ist Astra Xhigh fertig.
Ein wunderschönes New Yorker-inspiriertes Theme.
Das Theme ist nicht perfekt, es hat Randfälle; ich würde einen Schritt 6 empfehlen, bei dem du Bereiche einfügst, in denen das Design nicht stimmt, und der Agent es korrigiert. Aber als Ausgangspunkt ist es absolut erstaunlich, dass wir das heute können. Vor einem Jahr war das noch nicht möglich.
Beispiel für eine Feinjustierung in Echtzeit: