# Bulles & frometons — le site statique

Cette version autonome constitue la référence visuelle de l’adaptation WordPress livrée avec le pack. Elle contient 25 pages HTML, les illustrations d’origine, les polices locales, les animations et les sources de personnalisation. Elle ne nécessite ni WordPress, ni abonnement à un constructeur de pages, ni compilation JavaScript.

## Ouvrir le site

Décompressez `bulles-frometons-site.zip` et ouvrez `index.html`. Les liens entre pages fonctionnent dans le dossier. Pour publier, déposez les fichiers et le dossier `assets` sur votre hébergement statique. Gardez `site-config.js`, les fichiers CSS et les scripts à la racine.

Les animations WebGL peuvent être limitées lorsque le site est ouvert directement depuis le disque. Le paysage d’origine reste affiché et les autres effets continuent de fonctionner selon les possibilités du navigateur. L’intégration Tally demande une connexion Internet.

## Ce qui est livré

- Accueil immersif : port illustré conservé, eau WebGL, détails animés en SVG, profondeur au défilement, composition fromagère en perspective et vergers en parallaxe.
- Portrait de Yoan dès l’accueil et page personnelle.
- Pages ateliers, particuliers, entreprises et mariages.
- Préparation de demande, contact, devenir partenaire, FAQ et explication des suites d’une demande.
- Carte SVG des cinq départements normands, zoom et filtres prêts pour les producteurs réels.
- Journal avec quatre guides d’accords issus du contenu de la première version.
- Pages et modèles de recettes et de sélections B&F.
- Pages de préparation des mentions légales, confidentialité et modalités de réservation.
- Page 404, téléchargement et outil local de personnalisation.

Les deux images du port et de la composition fromage/cidre sont conservées à l’identique. Le décor combine images, SVG, CSS et WebGL : il ne s’agit pas d’un modèle de ville 3D ni d’une illustration entièrement vectorielle.

## Recevoir les demandes avec Tally

Le formulaire `https://tally.so/r/w2r1Jp` est déjà intégré directement dans `reserver.html`, avec le script officiel de hauteur dynamique. Un lien de secours l’ouvre dans un nouvel onglet. Aucun paiement ni blocage de créneau n’est effectué : il s’agit d’une demande de devis, confirmée après échange.

Pour changer le formulaire, ouvrez `personnaliser.html`, modifiez son URL puis remplacez le fichier `site-config.js` par celui téléchargé. Le paramètre `occasion` est transmis depuis les pages particuliers, entreprises et mariages ; ajoutez dans Tally un champ caché portant ce nom pour le recevoir. Configurez vos notifications dans Tally et effectuez un envoi de contrôle depuis votre compte.

Les formulaires de contact et de partenariat sont configurables séparément. Sans URL, les liens de contact restent disponibles.

## Personnaliser les textes et les contenus

Les réglages rapides de `personnaliser.html` portent sur les couleurs, les coordonnées, les liens Tally, les repères de la formule et les animations. Ce fichier est un outil local : il exporte une configuration publique, sans enregistrer de données sur un serveur. N’y mettez jamais de secret Notion ou de mot de passe.

Les sources sont fournies dans `sources/` :

| Fichier | Rôle |
| --- | --- |
| `content/site-config.json` | Configuration de référence pour reconstruire les pages |
| `content/pages.json` | Textes et blocs des pages principales |
| `content/articles.json` | Guides et billets du journal |
| `content/recipes.json` | Recettes réelles à ajouter |
| `content/producers.json` | Producteurs réels et statut de partenariat |
| `content/selections.json` | Sélections B&F |
| `content/home-base.html` | Illustration et sections conservées de la première version |
| `scripts/build-static.py` | Génération des pages HTML |

Pour reconstruire les pages après modification de ces sources, avec Python 3 installé :

```sh
python3 sources/scripts/build-static.py
```

Cette commande réécrit les pages et `site-config.js` à partir des sources. Si vous avez d’abord personnalisé les réglages dans le navigateur, reportez également leurs valeurs dans `sources/content/site-config.json` avant une reconstruction. Les textes détaillés des pages restent éditoriaux : une modification de durée ou de taille de groupe nécessite de relire ces textes et la FAQ, en plus des repères chiffrés.

Les contenus HTML des fichiers sources doivent provenir de personnes de confiance. Le générateur est un outil d’édition local, pas une interface acceptant des contributions publiques.

## Ajouter un producteur

Ajoutez un objet dans `sources/content/producers.json`, puis reconstruisez le site :

```json
[
  {
    "id": "identifiant-stable",
    "name": "Nom réel du producteur",
    "city": "Commune",
    "lat": null,
    "lng": null,
    "partner": false,
    "types": ["Fromages"],
    "products": "Produits que vous souhaitez recommander",
    "website": "",
    "body": "<p>Votre présentation personnelle du producteur.</p>"
  }
]
```

Remplacez les valeurs par les données vérifiées. Les coordonnées manquantes laissent la fiche dans la liste, sans inventer de point sur la carte. Le statut `partner: true` est réservé à un partenariat réellement établi. Le site crée une page de détail et ajoute l’adresse aux filtres. Les points situés hors du fond de carte normand ne sont pas dessinés ; la fiche reste accessible.

## Ajouter une vraie recette

Les recettes n’ont pas été reprises de votre ancien blog : son contenu n’a pas pu être récupéré de façon fiable pendant cette intervention. Un export WordPress, un export Markdown ou l’accès aux bonnes pages Notion reste nécessaire. Les quatre guides du journal ne sont pas présentés comme des recettes importées.

Une recette peut être ajoutée à `sources/content/recipes.json` :

```json
[
  {
    "slug": "adresse-stable-de-la-recette",
    "title": "Titre de votre recette",
    "category": "Recette maison",
    "excerpt": "Description fidèle de votre recette.",
    "image": "photo-de-votre-recette.webp",
    "imageAlt": "Description de la photo réelle",
    "cheese": "Fromage AOP utilisé",
    "drink": "",
    "season": "Saison de votre recette",
    "difficulty": "★★",
    "prepTime": "Durée mesurée",
    "cookTime": "Durée mesurée",
    "servings": "Nombre de parts",
    "ingredients": ["Quantité et ingrédient"],
    "steps": ["Première étape réelle", "Deuxième étape réelle"],
    "body": "<p>Votre introduction et vos conseils.</p>"
  }
]
```

Déposez la photo dans `assets/`. La page présente les ingrédients à cocher, les étapes, les repères de préparation et un bouton d’impression. L’accord boisson peut être vide. La difficulté n’est jamais présentée comme une note de lecteurs.

Le site statique ne contient aucun secret et ne synchronise pas Notion. L’automatisation de publication unique demandée concerne l’extension WordPress fournie ; elle n’est pas active dans cette livraison statique.

## Référencement et ouverture au public

Chaque page possède un titre et une description, un titre principal, une navigation explicite et des liens internes. Le journal et ses détails sont de vrais fichiers HTML, lisibles sans exécuter JavaScript.

Renseignez votre adresse finale dans `siteUrl` de `sources/content/site-config.json`, puis reconstruisez : le générateur ajoute les liens canoniques, l’image de partage à son adresse complète et `sitemap.xml`. Évitez de renseigner l’adresse privée de prévisualisation comme adresse finale de votre activité.

Lors de la reprise du blog, conservez les adresses existantes lorsque c’est possible. Préparez les redirections des anciennes adresses vers les nouvelles auprès de votre hébergeur. Aucun contenu ancien n’est remplacé par ce téléchargement.

Les pages de préparation légales sont marquées `noindex`. Renseignez les informations propres à votre activité, adaptez les modalités aux pratiques réelles et relisez-les avant d’ouvrir le site au public. Pour retirer leur bandeau de préparation après finalisation, mettez `draft` à `false` dans `sources/content/pages.json`, puis reconstruisez.

Les éléments de référencement facilitent la compréhension du contenu ; aucun positionnement dans les résultats de recherche n’est garanti.

## Vérifications réalisées

- Présence des pages, des images, des fichiers locaux et des liens internes.
- Un titre principal par page, descriptions et identifiants uniques.
- Conservation exacte des deux illustrations d’origine.
- Syntaxe JavaScript.
- Tests des interactions et contrôle des modèles WordPress : menus, saisie de recette, Tally intégré, validation du domaine, recherche et carte.
- Ouverture et intégrité de l’archive.

Les pages ont été contrôlées dans un navigateur, notamment à une largeur mobile de 390 pixels. Le portrait, le hero et les espacements ont été corrigés. Le formulaire est intégré ; aucun envoi réel n’a été effectué. La publication consultable reste privée.

## Crédits

- Illustrations et composition : visuels de la première version Bulles & frometons, conservés.
- Portrait de Yoan Lureault : image de sa présentation publique sur [Insuffle Académie](https://www.insuffle-academie.com/).
- Limites départementales : [france-geojson, Grégoire David](https://github.com/gregoiredavid/france-geojson). La carte ne prétend pas positionner de producteurs non renseignés.
- Polices : voir `assets/font-license.txt`.
- Intégration : [documentation Tally](https://tally.so/help/embed-your-form).
- Repères sur le pommeau : [INAO](https://www.inao.gouv.fr/produit/pommeau-de-normandie-24376).