Pages
Construis ton site comme tu produis ton contenu. Builder visuel, blocs typés, versioning par révision, variables prospect, sessions dédiées.
Vue d'ensemble
Pages est le builder visuel de Freelance OS. Tu construis ton site (landing, présentation, blog) en composant des blocs typés. Chaque page est versionnée (révision git-like): tu peux revenir en arrière, comparer, publier une révision spécifique.
Les variables {{prospect.first_name}}, {{prospect.company}}, {{audit.summary}} permettent de personnaliser une présentation pour un prospect spécifique. Tu génères une session de présentation, le prospect ouvre un lien dédié qui affiche sa version.
Le rendu est servi par un Astro renderer DB-driven. Le SaaS theme engine (S1-S11) gère les variables design (couleurs, fonts, spacings) par workspace. Chaque workspace peut avoir un domaine custom et un branding propre.
Ce que le module fait
Éditeur 3 modes
Le builder propose un toggle [Visuel | IA | Code] dans la toolbar. Visuel = drag-drop + inspecteur. IA = chat + textarea pour générer une page complète from prompt. Code = éditeur Monaco sur les blocs HTML personnalisés. Les 3 modes partagent le même AST de blocs (un seul state, undo/redo continu).
Mode IA : génération from prompt
Décris la page que tu veux (ex: 'page de vente pour mon coaching 6 000€'), l'IA génère 6-12 blocs avec copy prêt à éditer. La sortie est structurée automatiquement. Disponible aussi via /pages/new path 'IA' pour créer une page de zéro.
Mode Code : HTML custom
Bloc rawHtml accessible à tous les owners (avant : super_admin only). Éditeur Monaco avec syntax highlight. Sanitize-html au save + au render : <script>, on* handlers et javascript: URLs strippés. Iframes whitelist YouTube/Vimeo/Spotify/Google Docs. Variables Liquid : {{ workspace.name }}, {{ page.title }}.
/pages/new : 3 chemins
Page picker avec 3 cartes : Vide (form classique), Template (5 templates curated : landing coaching, à propos, pricing 3 tiers, contact, blog post), IA (prompt -> page générée directement). Chaque chemin redirige direct dans l'éditeur.
Blocs typés
47 types : hero, piliers, founder, ctaFinal, pricing, FAQ, testimonials, rawHtml, container, columns, etc. Chaque bloc a son schema Zod et son rendu Astro.
Versioning git-like
Chaque page a un historique de révisions. Tu publies une révision donnée. Tu peux revenir, comparer, brancher.
Variables prospect
Tu insères {{var}} dans le content. Tu crées une session par prospect: à l'ouverture, les variables sont résolues. Parfait pour les présentations 1:1.
Sessions de présentation
/p/<session_token> sert une version unique de la page pour un prospect. Tracking de la visite, du temps, des sections vues.
SaaS theme engine + wizard
Tokens design (couleurs, fonts, radius, spacings) appliqués par workspace. Le wizard /settings/brand/wizard les fixe en 5 étapes (voir module Theme). Override directement dans /pages/[id]/theme.
Per-workspace branding et SEO
Member app + Pages + Blog rendent le branding et le SEO du workspace en cours. Bucket page-assets, og_image_path par page.
Domaines custom
Ajout de domaine en quelques clics. Vérification automatique, certificat géré.
Comment on l'utilise
- 01
Crée une page
/pages/new. Tu choisis un template (landing, présentation, blog post) ou tu pars vide.
- 02
Compose
Tu drag-drop des blocs. Tu remplis le contenu, tu vois la preview en live.
- 03
Theme
Tu ajustes les variables design dans /theme. Couleurs, fonts, spacings.
- 04
Variables
Tu insères {{prospect.first_name}} là où tu veux personnaliser.
- 05
Publie
Tu cliques Publier. La révision passe en live sur ton domaine.
- 06
Sessions
Pour une présentation 1:1, tu génères une session liée à un contact CRM.
Apercu
