Skip to main content
Microsites

Mini-sites — Guide de l'utilisateur complet

Qu'est-ce que les Mini-sites ?

Les Mini-sites vous permettent de créer et de publier votre propre site web directement dans OrbitingFox — sans besoin de coder. Chaque site obtient sa propre URL publique, des pages personnalisées, des images et un formulaire de contact. Vous pouvez parcourir tous les sites publiés à /sites/.

Créer votre premier site

  1. Allez dans Tableau de bord des Mini-sites  cliquez sur + Nouveau Site.
  2. Remplissez un titre, un slug interne (surnom sûr pour l'URL) et une description facultative.
  3. Cliquez sur Créer — vous arrivez dans le Builder.

Le Builder

Le Builder a deux zones principales :

  • Barre latérale gauche — votre liste de pages. Cliquez sur une page pour l'éditer. Utilisez l'icône de l'œil de visibilité pour contrôler qui voit chaque page.
  • Toile (droite) — votre éditeur de blocs. Chaque bloc est un morceau de contenu (texte, image, bouton, etc.).

La barre supérieure a des boutons d'accès rapide :

  • Aperçu — voir la vue publique de votre page
  • Paramètres — paramètres globaux du site (couleurs, logo, SEO, style de navigation)
  •  Exporter ZIP — téléchargez l'intégralité du site sous forme de fichier portable
  • Révisions — parcourez et restaurez des instantanés précédents

Pages & sections

Chaque site est composé de pages (appelées sections). Les pages apparaissent automatiquement dans la navigation de votre site.

  • Cliquez sur + Ajouter une page dans la barre latérale pour créer une nouvelle page.
  • Donnez-lui une étiquette (ce qui apparaît dans la navigation) et un slug (nom court sûr pour l'URL, par exemple services).
  • Faites glisser les pages vers le haut/vers le bas pour réorganiser la navigation.
  • Visibilité par page : Public (tout le monde), Propriétaire uniquement (uniquement vous), Caché (non affiché dans la navigation).

Pages secondaires

Vous pouvez imbriquer des pages jusqu'à 4 niveaux de profondeur. Pour faire d'une page l'enfant d'une autre, définissez sa page parente lors de l'ajout/de l'édition. Les sous-pages apparaissent comme des éléments déroulants dans la navigation.

Types de blocs

Cliquez sur + Ajouter un bloc dans une page pour insérer du contenu. Types de blocs disponibles :

BlocCe qu'il fait
TexteÉditeur de texte enrichi (gras, italique, listes, liens). Idéal pour les paragraphes et le contenu formaté.
HTML brutCollez du HTML Bootstrap 5 — conçu pour des mises en page générées par l'IA. Dispose d'une aide intégrée pour les invites AI.
ImageAffichez une image à partir d'une URL, avec une légende et un contrôle de largeur optionnels.
BoutonUn lien d'appel à l'action stylisé. Utilisez #page-slug comme URL pour faire défiler vers une autre page sur le même site.
RéduireUn panneau extensible — parfait pour les FAQ. Les visiteurs cliquent sur le titre pour révéler la réponse.
FormulaireFormulaire de contact intégré. Ne fonctionne que sur une page nommée contact. Les soumissions apparaissent dans votre boîte de messages.
CarteIntégrez une carte Google à l'aide d'une adresse ou d'un nom de lieu.
YouTubeIntégrez une vidéo YouTube par URL.
VidéoLiez ou téléchargez un fichier vidéo.
FichierTéléchargez ou liez un fichier PDF, markdown ou HTML pour que les visiteurs puissent le télécharger/voir.
IntégrerCollez n'importe quel code d'intégration iframe (ex. Calendly, Google Form, Typeform).
ColonnesColonnes d'agencement côte à côte — parfait pour des sections d'information à deux colonnes.
Table des matièresTable des matières générée automatiquement basée sur les titres de la page.
Barre de navigationUne barre de navigation secondaire dans la page.
Séparateur / EspaceUne règle horizontale ou un espace vertical vierge pour une séparation visuelle.

Aide à la saisie AI (blocs HTML bruts)

Lorsque vous ajoutez un bloc HTML brut, un panneau violet Personnaliser avec l'IA apparaît. Cliquez dessus pour l'agrandir — il montre une invite AI prédéfinie pour ce type de section.

  1. Faites défiler vers le [MODIFIER CETTE PARTIE] au bas de l'invite et remplacez l'exemple par votre propre contenu.
  2. Cliquez sur Copier l'invite.
  3. Collez dans ChatGPT ou Gemini (tous deux gratuits).
  4. Copiez le HTML que l'IA renvoie  collez-le dans la boîte de code  cliquez sur Enregistrer.

Astuce — lier des boutons aux sections : Si l'IA vous donne un bouton comme <a href="#">En savoir plus</a>, remplacez # par #your-page-slug. Exemple : <a href="#services">Nos Services</a> fait défiler à la page avec le slug services.

Un panneau vert Conseils en dessous de l'aide AI explique cela et vous rappelle d'utiliser le bloc Formulaire intégré pour les formulaires de contact (pas pour les formulaires HTML générés par l'IA).

Onglet Paramètres

Ouvrez l'onglet Paramètres dans le builder pour configurer les options à l'échelle du site :

  • Basics — titre, slug, description, titre/description/mots-clés SEO, titre de la bannière
  • Branding — image d'en-tête, logo, favicon, logo animé
  • Couleurs — fond, zone de logo, en-tête, pied de page (sélecteurs de couleur hex)
  • Carrousel de logos — téléchargez plusieurs logos pour une bande défilante ; contrôlez l'intervalle de défilement, l'alignement
  • Navigation — mise en page (Barre latérale gauche / Barre supérieure / Barre latérale droite), thème (Clair / Sombre / Transparent)
  • Formulaire de contact — montrer le basculement du champ téléphone, rendre le téléphone/l'email requis
  • Badge OrbitingFox — montrer ou cacher le badge d'attribution du site
  • Publication — définir votre URL publique, mode de visibilité et boutons Publier/Dépublier

Publier votre site

  1. Dans la section Paramètres  Publication, entrez une URL publique (un slug unique, par exemple my-bakery). Votre site sera disponible à /sites/my-bakery/.
  2. Choisissez Visibilité de la publication:
    • Public — listé dans le répertoire /sites/, tout le monde peut le trouver
    • Non répertorié — accessible uniquement par URL directe, non listé dans le répertoire
    • Groupe — accessible uniquement aux membres d'un groupe de contact sélectionné
  3. Cliquez sur Publier. Un instantané de révision est enregistré automatiquement.
  4. Pour mettre votre site hors ligne, cliquez sur Dépublier.

Messages de contact

Lorsque quelqu'un soumet votre formulaire de contact, le message apparaît dans Tableau de bord  votre site  Messages.

Chaque message a un statut que vous pouvez mettre à jour :

  • Nouvelle  Lu  Répondu  Archivé

Répondez en cliquant sur l'email de l'expéditeur (ouvre votre client de messagerie avec une adresse pré-remplie).

Historique des révisions

Chaque fois que vous cliquez sur Publier, OrbitingFox enregistre un instantané de votre site entier. Visitez Révisions (bouton de la barre supérieure) pour parcourir les instantanés.

  • Chaque carte montre la date, l'heure et un résumé des pages et des blocs à ce moment-là.
  • Cliquez sur Restaurer cette version pour revenir en arrière. Une boîte de dialogue de confirmation vous avertit que le changement est immédiat.
  • L'importation d'un ZIP dans un site existant crée également une paire de révisions avant/après.

Dupliquer un site

Dans le Tableau de bord, cliquez sur le menu  à côté d'un site  Dupliquer. Une copie complète est créée (toutes les pages, blocs, paramètres, images) avec un nouveau slug interne. L'URL publique n'est pas copiée — vous devez en définir une nouvelle.

Export ZIP, import & flux de travail VSCode

Exporter votre site existant

Barre supérieure du Builder   Exporter ZIP. Le ZIP contient :

  • site.json — toutes vos pages, blocs et paramètres dans un format lisible
  • images/ et files/ — tous les médias téléchargés
  • README.md — guide étape par étape pour les utilisateurs et assistants IA
  • AI_CONTEXT.md — référence technique complète pour les agents IA et les développeurs

Télécharger un modèle vierge de démarrage

Tableau de bord   Modèle de démarrage. Même format ZIP, pré-rempli avec une page d'accueil (bloc héros) et une page de contact (bloc formulaire). Commencez ici si vous souhaitez concevoir à partir de zéro dans VSCode.

Éditer dans VSCode avec l'IA

  1. Dézippez  ouvrez le dossier dans VSCode.
  2. Dites à un assistant IA : "Lisez d'abord AI_CONTEXT.md, puis aidez-moi avec mon site web."
  3. Décrivez les changements en anglais simple. L'IA édite site.json pour vous.
  4. Re-zippez et téléchargez.

Re-télécharger (importer)

Tableau de bord   Importer ZIP.

  • Laissez le menu déroulant vide  crée un nouveau site brouillon.
  • Sélectionnez un site existant dans le menu déroulant  remplace le contenu de ce site et enregistre automatiquement une révision afin que vous puissiez revenir en arrière.

Ce qui n'est PAS importé

  • URL publique — vous devez définir la vôtre
  • État publié — commence toujours comme un brouillon privé
  • Messages de contact — restent sur le serveur d'origine
  • Restrictions de groupe — les groupes sont spécifiques au serveur

Sécurité

OrbitingFox scanne chaque ZIP téléchargé pour détecter un contenu dangereux. Les ZIP rejetés incluent une explication en anglais simple sur la raison pour laquelle ils ont été bloqués (par exemple, "HTML dangereux détecté", "type de fichier non autorisé").


Note (2026-08-17) — pas le même que le système de conception de la plateforme. Les paramètres de couleur décrits ci-dessus sont des paramètres par site (ou par élément) appartenant à l'utilisateur qui a créé ce site. Ils ne représentent pas la norme visuelle de la plateforme. Les couleurs, tailles de texte et composants de la plateforme se trouvent dans le système de conception — voir Admin → Système de Design et docs/design/DESIGN.md — et sont définis globalement sur Apparence.

This guide was translated automatically. Read the English original.

🪐 OrbitPilot