[{"data":1,"prerenderedAt":350},["ShallowReactive",2],{"blog-/de/html-to-editable-cms":3,"blog-related-/de/html-to-editable-cms":258},{"id":4,"title":5,"author":6,"body":7,"date":241,"description":242,"extension":243,"image":244,"meta":245,"navigation":246,"path":247,"seo":248,"stem":249,"tags":250,"__hash__":257},"blog/de/html-to-editable-cms.md","Ich habe eine statische HTML-Seite mit einem Prompt zum editierbaren CMS gemacht","Martin Swoboda",{"type":8,"value":9,"toc":231},"minimark",[10,15,24,30,33,36,41,54,61,64,68,75,82,94,98,101,104,114,121,128,132,135,145,156,169,173,176,191,198,205,209,212,221,224],[11,12,14],"h1",{"id":13},"ich-habe-eine-statische-html-seite-zum-editierbaren-cms-gemacht-mit-einem-prompt","Ich habe eine statische HTML-Seite zum editierbaren CMS gemacht — mit einem Prompt",[16,17,18,19,23],"p",{},"Es gibt diesen Moment, den jeder Webdesigner kennt. Das Design ist fertig. Es ist ",[20,21,22],"em",{},"gut",". Die Animationen laufen geschmeidig, die Typo sitzt, der Custom-Cursor macht sein Ding. Und dann stellt die Kundin die Frage, die dein Wochenende löscht:",[16,25,26],{},[27,28,29],"strong",{},"„Kann ich das selbst bearbeiten?\"",[16,31,32],{},"Jetzt bist du kein Designer mehr. Du bist CMS-Klempner. Du baust das Ganze in WordPress oder Contentful nach, mappst jede Überschrift auf ein Feld, kämpfst mit einer Template-Sprache, die du nicht magst, und irgendwo dabei brechen die Animationen und du verbringst einen Nachmittag damit, dein Scroll-Reveal wieder zum Laufen zu bringen. Eine Woche, weg. Das Design ist nicht besser geworden. Es ist nur editierbar geworden.",[16,34,35],{},"Ich habe Neleto unter anderem gebaut, um diese Woche zu killen. Dieser Beitrag zeigt dir wie — mit einem echten Beispiel zum Nachmachen.",[37,38,40],"h2",{"id":39},"die-30-sekunden-version","Die 30-Sekunden-Version",[16,42,43,44,47,48,53],{},"Neleto ist das einzige CMS mit ",[27,45,46],{},"nativem MCP-Server",". ",[49,50,52],"a",{"href":51},"/de/blog/what-is-mcp","MCP (Model Context Protocol)"," ist das, was Tools wie Claude Code, Cursor und Windsurf direkt mit anderen Systemen sprechen lässt. Weil Neleto es nativ spricht, kann ein KI-Assistent dein CMS lesen und beschreiben — Layouts, Komponenten und editierbare Felder anlegen — ohne dass du ein einziges Admin-Formular anfasst.",[16,55,56,57,60],{},"Der Workflow wird also: Du machst dein HTML fertig, führst ",[27,58,59],{},"einen Prompt"," aus, und Neleto verwandelt es in eine vollständig komponentenbasierte Seite, auf der die Kundin jedes Wort und jedes Bild bearbeiten kann — während dein CSS, deine Animationen und dein JavaScript unangetastet mitwandern.",[16,62,63],{},"Nicht „KI-unterstützt\". Ein Prompt, fertige Seite.",[37,65,67],{"id":66},"das-beispiel","Das Beispiel",[16,69,70,71,74],{},"Ich habe eine kleine Design-Studio-Landingpage gebaut — nennen wir sie ",[20,72,73],{},"Studio Nordlys",". Bewusst so etwas, das du tatsächlich ausliefern würdest: eine fixierte Nav mit Scroll-Zustand, ein Hero mit leuchtendem animiertem Blob und gestaffeltem Reveal, ein scrollender Marquee, ein About-Bereich mit animiertem Zähler, ein Vierer-Services-Grid mit Hover-States, eine Projektgalerie mit Bild-Zoom, ein dunkler Process-Bereich, ein großes Testimonial, ein CTA-Banner und ein Custom-Cursor, der dir am Desktop folgt. CSS-Variablen, Keyframes, ein IntersectionObserver, das volle Programm.",[16,76,77,78,81],{},"Eine Datei. Die Art Seite, die das „mach es editierbar\"-Gespräch normalerweise schmerzhaft macht, weil ",[20,79,80],{},"so viel"," drinsteckt, das du nicht verlieren willst.",[83,84,85],"blockquote",{},[16,86,87,88],{},"📥 ",[27,89,90],{},[49,91,93],{"href":92},"/examples/html_to_neleto_example.zip","Beispiel „Studio Nordlys\" herunterladen — die HTML-Seite plus den vollständigen Prompt (.zip)",[37,95,97],{"id":96},"der-prompt-erledigt-den-langweiligen-teil","Der Prompt erledigt den langweiligen Teil",[16,99,100],{},"Der Trick: Das schwierige Wissen ist nicht das Design — das ist deins. Das schwierige Wissen ist, wie ein CMS seine Layouts, Komponenten, Templates und Felder strukturiert haben will, und all die kleinen Arten, es falsch zu machen. Dieses Wissen steckt also in einem Prompt.",[16,102,103],{},"Du zeigst Claude auf deine Datei:",[83,105,106],{},[16,107,108,109,113],{},"Nutze den Neleto-MCP-Server, um ",[110,111,112],"code",{},"@studio-nordlys.html"," als vollständig komponentenbasierte Seite umzusetzen. Jeder Inhalt muss über das CMS editierbar sein — nichts fest verdrahtet.",[16,115,116,117,120],{},"…und übergibst die Spezifikation. Von da an zerlegt Claude die Seite in Abschnitte, legt dein gesamtes globales CSS in ein Layout, macht aus jedem Abschnitt eine Komponente mit eigenem gekapseltem CSS und JS und — der entscheidende Teil — ersetzt jede Überschrift, jeden Absatz, jedes Label, jeden Link und jedes Bild durch ein benanntes, editierbares Feld. Aus deinem ",[110,118,119],{},"\u003Ch1>Design that moves people\u003C/h1>"," wird ein Feld „Überschrift\" im CMS. Gleiches Markup, gleiches Styling, jetzt editierbar.",[16,122,123,124,127],{},"Es setzt die Seite in deiner ursprünglichen Reihenfolge zusammen, bindet Nav und Footer ins Layout ein, damit sie auf jeder Seite erscheinen, und gibt dir eine Live-URL. Deine Animationen laufen noch. Der Custom-Cursor folgt noch der Maus. Der Zähler zählt noch hoch. Weil nichts davon neu gebaut wurde — es wurde ",[20,125,126],{},"verschoben",", intakt, an die richtigen Stellen.",[37,129,131],{"id":130},"warum-das-anders-ist-als-ki-website-baukästen","Warum das anders ist als „KI-Website-Baukästen\"",[16,133,134],{},"Zwei Gründe, und es sind die, auf denen ich immer wieder herumreite.",[16,136,137,140,141,144],{},[27,138,139],{},"Du behältst dein Design."," Das ist kein Generator, der aus einem Text-Prompt eine generische Seite erfindet. Er nimmt ",[20,142,143],{},"dein"," pixelgenaues HTML und bewahrt es. Die KI macht die CMS-Verkabelung, nicht die Art Direction. Das ist die richtige Arbeitsteilung — Maschinen sind gut im stupiden strukturellen Mapping, du bist gut im Geschmack.",[16,146,147,150,151,155],{},[27,148,149],{},"Darunter steckt ein echtes CMS, in der EU gehostet."," Wenn du fertig bist, loggt sich die Kundin in einen Admin ein, in dem jeder Abschnitt ein sauberes Panel mit Klartext-Feldern ist. Sie kann dein Layout nicht kaputt machen, weil das Layout kein Feld ist. Und weil Galerien und Listen als wiederholbare Komponenten gebaut sind, kann die Kundin selbst ein fünftes Projekt hinzufügen — nicht nur die vier bearbeiten, die du ausgeliefert hast. Bilder werden beim Upload automatisch skaliert, ein Kunde, der ein 6-MB-Foto einwirft, ruiniert also nicht deinen Performance-Score. Und es läuft auf Neletos Rust-Backend auf ",[49,152,154],{"href":153},"/de/blog/eu-hosting-compliance","EU-Infrastruktur"," — kein US-Cloud-Act-Risiko, was deinen Kunden Jahr für Jahr wichtiger wird.",[16,157,158,159,163,164,168],{},"Zum Preis-Kontext: Ein solches Setup ",[49,160,162],{"href":161},"/de/blog/neleto-vs-contentful","auf Contentful"," startet bei rund 109 €/Monat und klettert mit Sitzen schnell. Neleto startet kostenlos, mit ",[49,165,167],{"href":166},"/de/pricing","bezahlten Tarifen ab 24 €/Monat",". Für eine Agentur, die an Kunden weiterverkauft, ist genau diese Marge der Punkt.",[37,170,172],{"id":171},"der-ehrliche-teil","Der ehrliche Teil",[16,174,175],{},"Ich tu nicht so, als wäre es kantenlose Magie.",[16,177,178,179,182,183,186,187,190],{},"Es funktioniert am besten auf einer ",[27,180,181],{},"sauberen, gegliederten Seite",". Gib ihm ordentliche ",[110,184,185],{},"\u003Csection>","-Wrapper und gruppiertes CSS, und die Umwandlung ist gestochen scharf. Gib ihm 4.000 Zeilen unbeschrifteten ",[110,188,189],{},"\u003Cdiv>","-Brei, und du räumst etwas auf. Die Beispielseite ist absichtlich sauber — das ist die Lektion, nicht der Trick.",[16,192,193,194,197],{},"Gelegentlich wird ein Abschnitt doppelt umgewandelt, oder ein JavaScript-Effekt braucht einen Schubs zum erneuten Andocken, oder ein Feldname vertippt sich. Jedes davon lässt sich beheben, indem du das ",[20,195,196],{},"Symptom beschreibst"," — „dieser Abschnitt ist doppelt, aktualisiere ihn in-place\" — nicht durch händisches Editieren von CMS-Interna. Der Prompt dokumentiert die häufigen Fälle bereits. Aber ich würde lügen, wenn ich sagte, es ist auf einer verzwickten Seite immer One-Shot-perfekt. Auf einer sauberen Seite ist es das im Grunde.",[16,199,200,201,204],{},"Und es macht deine Arbeit nicht ",[20,202,203],{},"für"," dich. Es schreibt keine Content-Strategie, repariert keine Barrierefreiheit, macht kein SEO. Es bewahrt, was du ihm gibst. Müll rein, editierbarer Müll raus.",[37,206,208],{"id":207},"probier-es","Probier es",[16,210,211],{},"Wenn du Websites gestaltest und je eine Woche verloren hast, eine editierbar zu machen, ist das zwanzig Minuten deines Abends wert. Schnapp dir die Beispielseite und den Prompt, verbinde den Neleto-MCP-Server mit deinem Editor und sieh zu, wie ein fertiges Design zur kunden-editierbaren Seite wird, während du Tee kochst.",[83,213,214],{},[16,215,87,216],{},[27,217,218],{},[49,219,220],{"href":92},"Beispielseite + Prompt herunterladen (.zip)",[16,222,223],{},"Nächstes Mal, wenn jemand fragt „Kann ich das selbst bearbeiten?\" — ja. Und es kostet dich einen Prompt, kein Wochenende.",[16,225,226,227,230],{},"— ",[27,228,229],{},"Kostenlos starten auf neleto.io"," · das einzige CMS mit nativem MCP-Server, in der EU gehostet.",{"title":232,"searchDepth":233,"depth":233,"links":234},"",2,[235,236,237,238,239,240],{"id":39,"depth":233,"text":40},{"id":66,"depth":233,"text":67},{"id":96,"depth":233,"text":97},{"id":130,"depth":233,"text":131},{"id":171,"depth":233,"text":172},{"id":207,"depth":233,"text":208},"2026-07-06","Webdesigner verlieren Tage damit, fertige Designs als CMS nachzubauen. So macht Neletos nativer MCP-Server das aus einem einzigen Prompt — inklusive Animationen und Custom-Cursor.","md","/img/blog/html-to-editable-cms.svg",{},true,"/de/html-to-editable-cms",{"title":5,"description":242},"de/html-to-editable-cms",[251,252,253,254,255,256],"MCP","KI-Agenten","Webdesign","Claude Code","CMS","Neleto","fOW4OT-9gfreRyxVxKOEtCWv1K3OPhyxmWnVdjUjnYM",[259,261,272,282,293,301,312,323,333,341],{"path":247,"title":5,"description":242,"date":241,"author":6,"image":244,"tags":260},[251,252,253,254,255,256],{"path":262,"title":263,"description":264,"date":265,"author":6,"image":266,"tags":267},"/de/console-launch-free-tier","Neleto Console ist live — und der Free-Tier ist offen","Registrier dich auf console.neleto.io, bekomm ein echtes CMS und zahl uns nichts. Hier ist, warum wir es so gebaut haben.","2026-06-29","/img/blog/console-launch-free-tier.svg",[268,256,269,270,271,255],"Build in Public","Free-Tier","Self-Serve","EU-Hosting",{"path":273,"title":274,"description":275,"date":276,"author":6,"image":277,"tags":278},"/de/mcp-server-explained","MCP-Server erklärt: Der Deep Dive","Wie das Model Context Protocol sichere, native Interaktion von KI-Agenten mit deinen Anwendungen ermöglicht — und warum native Implementierung entscheidend ist.","2026-06-22","/img/blog/mcp-server-explained.svg",[251,279,280,252,281],"MCP-Server","Model Context Protocol","KI-Integration",{"path":283,"title":284,"description":285,"date":286,"author":6,"image":287,"tags":288},"/de/neleto-vs-contentful","Neleto vs Contentful: Welches CMS solltest du 2026 wählen?","Ein praxisnaher Vergleich für Entwickler, Agenturen und wachsende Unternehmen — von Preisen über Performance und KI-Integration bis hin zu EU-Compliance.","2026-06-16","/img/blog/neleto-vs-contentful.svg",[256,289,290,291,292],"Contentful","Headless CMS","CMS-Vergleich","KI-CMS",{"path":294,"title":295,"description":296,"date":297,"author":6,"image":298,"tags":299},"/de/agentic-traffic-surpassed-humans","Bots überholen uns: Was das agentische Web für dein CMS bedeutet","Cloudflare meldet: KI-Agenten treiben inzwischen den Großteil des Web-Traffics — 18 Monate früher als erwartet. Was das für die Art ändert, wie du Inhalte veröffentlichst, und was du jetzt tun solltest.","2026-06-08","/img/blog/agentic-traffic-surpassed-humans.svg",[300,252,251,255,256],"Agentisches Web",{"path":302,"title":303,"description":304,"date":305,"author":6,"image":306,"tags":307},"/de/glw-gmbh-case-study","Ein 40 Jahre altes Familienunternehmen modernisiert: Die neue Website der GLW GmbH mit Neleto","Wie wir für einen führenden deutschen Spezialisten für Kabelverarbeitung eine schnelle, mehrsprachige und CRM-integrierte Website mit Neleto umgesetzt haben — in enger Zusammenarbeit mit der Agentur Inhalt.","2026-06-05","/img/blog/glw-gmbh-case-study.svg",[308,309,256,310,311],"Case Study","Kundenprojekt","CRM-Integration","Custom Plugin",{"path":313,"title":314,"description":315,"date":316,"author":6,"image":317,"tags":318},"/de/eu-hosting-compliance","Warum EU-Hosting-Compliance für deine Website wichtig ist","Datensouveränität, DSGVO und die richtige Infrastruktur im Jahr 2026","2026-06-01","/img/blog/eu-hosting-compliance.svg",[319,320,321,322,256],"DSGVO","EU Hosting","Datenschutz","Compliance",{"path":324,"title":325,"description":326,"date":327,"author":6,"image":328,"tags":329},"/de/buergerstiftung-ravensburg","Bürgerstiftung Ravensburg: Moderne Website für gesellschaftliches Engagement mit Neleto","Wie wir für eine regionale Bürgerstiftung eine klare, schnelle und emotional ansprechende Website mit Neleto entwickelt haben — in enger Zusammenarbeit mit der Agentur Inhalt.","2026-05-29","/img/blog/buergerstiftung-ravensburg.svg",[308,330,331,256,332],"Nonprofit","Stiftung","Website",{"path":334,"title":335,"description":336,"date":337,"author":6,"image":338,"tags":339},"/de/what-is-mcp","Was ist das Model Context Protocol (MCP)?","Der neue Standard, der KI-Agenten mit deinen Tools und Daten verbindet","2026-05-25","/img/blog/what-is-mcp.svg",[251,340,280,252,255],"KI",{"path":342,"title":343,"description":344,"date":345,"author":6,"image":346,"tags":347},"/de/why-neleto-exists","Warum es Neleto gibt","Das CMS für Geschwindigkeit, Einfachheit und das KI-Zeitalter","2026-05-18","/img/blog/why-neleto-exists.svg",[255,340,348,349,256],"Webentwicklung","Performance",1783370228353]