More speed and design freedom for your Kontent.ai – with Laioutr
Feel free to reach out to one of our partners for your e-commerce frontend built on Laioutr.
5/5
OMR Reviews
70+
Frontend components
Lighthouse 100
Performance from day 1
Made in EU
GDPR-compliant, servers in Germany
100% Match
Visual editor & frontend for Kontent.ai – what it means
Kontent.ai is a headless CMS: Content Types, Content Items, Language Variants, Environments, and Web Spotlight are its strength – delivered through the Delivery REST API and the GraphQL API. Kontent.ai comes with a web editor for content, but not a finished, production-ready frontend. That's exactly where Laioutr comes in: as a visual page builder and frontend layer that reads your Kontent.ai content and serves it as a fast website. Kontent.ai stays your content backend, Laioutr delivers the frontend.
1. The backend stays Kontent.ai
Kontent.ai continues to manage content, Content Types, Language Variants, permissions, roles, assets, and workflows. You keep using the Kontent.ai editor and your established processes unchanged – with all webhooks and integrations.
2. The frontend is chosen
For the frontend you have several options: an official Kontent.ai starter, a community framework with a Kontent.ai connection, a custom build (Next.js/Nuxt) – or a page builder like Laioutr. Every option has its pros and cons.
3. Content flows through the Delivery API in real time
No data duplication, no sync conflicts. Laioutr reads your Kontent.ai content through the Delivery REST API and the GraphQL API and renders it – including multilingual setups (Language Variants) and Environments.
Benefits
What frontend options do you have for Kontent.ai?
With a web editor, Content Types, and an end-to-end Delivery REST and GraphQL API, Kontent.ai provides the building blocks, but not a finished, production-ready frontend product. So every Kontent.ai project raises the frontend question. Four options are established in the market.
1. Kontent.ai starter (Next.js/Nuxt)
The official Kontent.ai starters and boilerplates (Next.js, Nuxt, and others) are an ideal starting point for learning and for proofs of concept. As a production frontend, you keep developing the design system, components, and page logic yourself. Sensible for small sites or as an interim solution.
2. Community framework with a Kontent.ai connection
Open-source frontend frameworks with Kontent.ai SDKs and community integrations. Active community, but no official production frontend product and no direct enterprise support net. Sensible with a suitable frontend team for whom open source matters strategically.
3. Custom Build (Next.js or Nuxt)
Maximum control, highest effort. A six- to twelve-month build phase and ongoing maintenance by an in-house frontend team that connects to the Kontent.ai Delivery/GraphQL API itself. Sensible when frontend engineering is your strategic core competency.
4. Laioutr Page Builder
Visual page builder and frontend platform with 70+ components, EU hosting, and a connection to Kontent.ai. Fastest time-to-launch, lowest learning curve, marketing and editorial teams build pages themselves. Sensible when you want to go live fast without a custom-build investment.
USE CASES
What you build with Laioutr on Kontent.ai
Laioutr is designed for Kontent.ai setups that need to change and scale fast. From the corporate website through multi-brand portfolios to campaign landing pages with a high editorial workload.
Multi-brand & multi-site on a single Kontent.ai
Kontent.ai manages structured content for multiple brands and sites – via Content Types and Environments. Laioutr turns them into standalone frontends – one component pool, many brand presences, each with its own design and its own domain.
Campaign and landing pages without a ticket
Marketing builds landing pages visually from ready-made building blocks – without custom code and without a developer ticket. The content comes from Kontent.ai, the layout takes shape in the page builder.
Multilingual websites
Kontent.ai manages translations via Language Variants, and Laioutr serves them consistently. Languages, layouts, and content controllable per site, compatible with the Kontent.ai language concept.
Content-driven sites & omnichannel
One Kontent.ai, many channels. The structured content is served consistently across web and further touchpoints – content, languages, and layouts controllable per channel.
Relaunch without touching the content model
Renew your existing Kontent.ai frontend without touching Content Types, Environments, or editorial processes. Migration in phases, with a clear rollback plan.
Get new Kontent.ai projects live fast
New Kontent.ai project, fresh start. With Laioutr themes and the UI library, it goes live in weeks instead of investing months in a custom build.
Laioutr vs. building the frontend yourself
Laioutr or a custom build for your Kontent.ai frontend?
Both routes lead to a headless frontend on Kontent.ai. The difference lies in time-to-launch, maintenance burden, and the question of who can build pages. The direct comparison.
Compare differences | Laioutr Page Builder | Eigenentwicklung (Next.js / Nuxt) |
|---|---|---|
Builder und Komponenten Was Sie aus der Box bekommen und was Sie selbst aufbauen müssen. | ||
Visueller Page Builder Drag-and-Drop-Editor für Marketing- und Redaktions-Teams. | Inklusive (Studio) Live-Preview, komponentenbasiert | Nicht enthalten Eigenbau oder externes Tool |
Frontend-Komponenten Vorgefertigte UI-Bausteine für Seiten, Landing- und Content-Pages. | 70+ Komponenten Design-Token-basiert, anpassbar | Selbst aufbauen Komplette UI-Bibliothek selbst entwickeln |
Themes und Vorlagen Startpunkt für neue Websites ohne Greenfield-Aufwand. | Vorgefertigte Themes Sofort einsatzbereit, voll erweiterbar | Greenfield Designsystem komplett selbst aufbauen |
Hosting Wo das Frontend ausgeliefert wird und wer es betreibt. | Inklusive (EU-CDN) Laioutr Cloud, kein separater Deploy | Selbst hosten Vercel, AWS, eigene Infrastruktur |
Architektur und Compliance Wie flexibel die Plattform ist und was Sie regulatorisch mitbekommen. | ||
Backend-Flexibilität Welche CMS- und Commerce-Backends sich anbinden lassen. | Multi-Backend Kontent.ai, weitere CMS und Commerce-Systeme | Backend-spezifisch Code an Kontent.ai Delivery API gebunden, Wechsel teuer |
Performance und Core Web Vitals Wie viel Aufwand für Lighthouse-100-Niveau nötig ist. | Out of the box Lighthouse 100 als Default-Ziel | Manuelles Tuning Performance-Engineering durch Team |
BFSG und WCAG 3.0 Konformität mit Barrierefreiheitsstärkungsgesetz und WCAG 3.0. | Im Standard WCAG 3.0, BFSG, EN 301 549 | Eigenverantwortung Audit separat erforderlich |
Datenschutz und Serverstandort Wo Daten verarbeitet werden und welche EU-Verträge gelten. | EU und Deutschland EU-Standardvertrag, deutschsprachiger Support | Hosting-abhängig Je nachdem, wo Sie deployen |
Team und Wirtschaftlichkeit Wer mit der Plattform produktiv ist und was es Sie über die Zeit kostet. | ||
Lernkurve Wie schnell ein neues Teammitglied produktiv wird. | Niedrig Redaktion onboardet in Tagen | Hoch React/Vue plus Delivery/GraphQL API |
Time-to-Launch Realistische Zeitspanne bis zum Live-Gang einer neuen Website. | Wochen Mit Themes und UI-Bibliothek | Monate Sechs- bis zwölfmonatige Build-Phase |
Ideales Team-Setup Wer mit der Plattform arbeiten kann und wer arbeiten muss. | Cross-funktional Marketing, Redaktion, Design und Dev gemeinsam | Engineering-only Drei plus Frontend-Engineers |
Preismodell Wie sich Kosten zusammensetzen, Software plus Betrieb plus Entwicklung. | SaaS (planbar) Transparente Pläne, Hosting inklusive Preise ansehen | Engineering-Kosten Build plus dauerhafte Wartung |
Comparison based on a typical mid-market setup. The exact feature scope depends on your Kontent.ai project, your requirements, and how the project is scoped.
Custom build
When building it yourself is the right call
You have a dedicated frontend team with Kontent.ai and API experience, at least three engineers. You're building exactly one Kontent.ai frontend with highly specialized requirements. Frontend engineering is your strategic core competency. Classic case: a brand with its own engineering team and a demand for pixel-level control.
LAIOUTR
When Laioutr is the right choice
You want to go live in weeks, not months, your editorial and marketing teams should build pages on their own, you run multiple Kontent.ai Environments or brands, you want to keep your Kontent.ai and only modernize the frontend, and BFSG as well as WCAG have to be handled without a separate audit. Classic case: an organization that wants to modernize and scale its Kontent.ai frontend without a double-digit engineering investment.
You don't have to do this alone. Our certified composable partners have delivered Saleor frontend projects with Laioutr, from greenfield setups to storefront-example migrations.
FAQ