Votre site en ligne,
étape par étape.

Trois outils, chacun avec un rôle précis. Tous ont une formule gratuite suffisante pour un site vitrine ; seul le nom de domaine est payant, et il est facultatif.

Créer les comptes

1. Créez un compte sur github.com ↗. Choisissez un nom d’utilisateur sobre : il apparaîtra dans l’adresse de vos dépôts.
2. Créez un compte sur dash.cloudflare.com ↗.
3. Si vous n’en avez pas encore, créez un compte sur chatgpt.com ↗.

Réunir votre contenu

Rassemblez tout dans un dossier sur votre ordinateur avant de commencer : la personnalisation ira beaucoup plus vite.

• Logo : de préférence en SVG, sinon en PNG sur fond transparent.
• Textes : un document par page suffit (accueil, à propos, services…).
• Photos : en JPG, 2 000 px de large au maximum, avec des noms simples (equipe.jpg plutôt que IMG_4032.JPG).
• Coordonnées : adresse, téléphone, e-mail, horaires, liens vers vos réseaux.
• Couleurs : les codes de votre charte (par exemple #1F4E79), si vous en avez une.

Créer le dépôt

1. Sur GitHub, ouvrez l’onglet Repositories de votre profil et cliquez le bouton vert New (ou + en haut à droite, puis New repository).
2. Donnez-lui un nom, par exemple mon-site, et cochez Private. Ne cochez rien d’autre : ni README, ni .gitignore, ni licence.
3. Cliquez Create repository.

Préparer les fichiers

1. Décompressez le fichier .zip reçu au téléchargement : sous Windows, ouvrez-le puis cliquez Extraire tout ; sur Mac, double-cliquez dessus.
2. Ouvrez le dossier obtenu (nom-du-theme-v1.0.0). C’est son contenu que vous allez déposer, pas le dossier lui-même.

Déposer les fichiers

1. Sur la page du dépôt vide, cliquez le lien uploading an existing file.
2. Dans le dossier du thème, sélectionnez tout (Ctrl + A, ou Cmd + A sur Mac) et glissez la sélection dans la fenêtre de GitHub.
3. Attendez la fin du chargement, puis cliquez Commit changes.

On publie avant de personnaliser : à partir de cette étape, chaque modification enregistrée sur GitHub sera mise en ligne toute seule, et vous verrez chaque changement sur le vrai site.

Relier Cloudflare à GitHub

1. Dans Cloudflare, ouvrez Workers & Pages dans le menu de gauche, puis cliquez Create application.
2. Choisissez Pages, puis Import an existing Git repository. Cloudflare met parfois Workers en avant : cherchez bien la mention Pages.
3. Cliquez Connect GitHub et autorisez Cloudflare. Quand GitHub le propose, choisissez Only select repositories et sélectionnez votre dépôt : Cloudflare n’a besoin de voir que lui.
4. Sélectionnez le dépôt, puis Begin setup.

Les réglages exacts

1. Cliquez Save and Deploy. La première compilation prend une à deux minutes.
2. Quand le message de réussite apparaît, ouvrez l’adresse https://mon-site.pages.dev : votre site est en ligne, avec le contenu de démonstration du thème.

Connecter GitHub à ChatGPT (une seule fois)

1. Dans ChatGPT, ouvrez Paramètres → Applications (le menu peut s’appeler Apps ou Connecteurs selon la version).
2. Choisissez GitHub, puis Connecter.
3. GitHub vous demande d’installer l’application ChatGPT : choisissez Only select repositories et sélectionnez votre dépôt. Ne donnez accès qu’à lui.

Le premier message

Ouvrez une nouvelle conversation, activez GitHub (bouton + sous la zone de saisie), puis collez ce message en remplaçant ce qui est entre crochets. Il fixe les règles du jeu pour toute la suite.

Tu travailles sur mon site, dans le dépôt GitHub [votre-nom/mon-site]. C’est un site Astro construit à partir d’un thème, publié automatiquement par Cloudflare Pages à chaque modification de la branche main.

Avant de modifier quoi que ce soit :
1. Lis le README, package.json et le dossier src, puis explique-moi en quelques lignes où se trouvent les textes de chaque page, les images, les couleurs et les coordonnées.
2. Ne change ni la structure, ni la mise en page, ni les dépendances, sauf si je te le demande.

Pour chaque modification que je te demanderai :
- enregistre-la directement dans le dépôt, sur la branche main, avec un message clair ;
- dis-moi quels fichiers tu as changés ;
- relis ton travail : chaque image et chaque lien doit pointer vers un fichier qui existe dans le dépôt.

Voici mes informations :
- Nom de l’entreprise : [...]
- Activité, en une phrase : [...]
- Adresse, téléphone, e-mail : [...]
- Réseaux sociaux : [...]
- Couleur principale : [#......]

Ensuite, une demande à la fois

Les demandes courtes et précises donnent les meilleurs résultats. Par exemple :

• « Sur la page d’accueil, remplace le grand titre par : … »
• « Remplace le texte de la page À propos par celui-ci : … »
• « Mets à jour le téléphone et l’adresse partout sur le site : … »
• « Change la couleur principale du site pour #1F4E79. »
• « Supprime l’article de démonstration “…” et retire-le de toutes les listes. »

Ajouter vos images

Vos photos, c’est vous qui les déposez sur GitHub ; ChatGPT se charge ensuite de les mettre au bon endroit.

1. Sur GitHub, ouvrez le dossier des images du thème (souvent public/images ou src/assets : ChatGPT vous l’a indiqué au premier message).
2. Cliquez Add file → Upload files, déposez vos photos, puis Commit changes.
3. Dans ChatGPT : « J’ai ajouté equipe.jpg dans public/images. Utilise-la à la place de la photo de la page À propos. »

Sur GitHub : ce qui a changé

1. Sur la page du dépôt, cliquez Commits (l’icône d’horloge au-dessus de la liste des fichiers) : chaque modification y figure, avec son message.
2. Cliquez une modification pour voir le détail : en rouge l’ancien texte, en vert le nouveau.
3. Si ChatGPT a ouvert une pull request au lieu d’enregistrer directement : onglet Pull requests, ouvrez-la, regardez Files changed, puis cliquez Merge pull request et Confirm merge.

Sur Cloudflare : la mise en ligne

1. Dans Workers & Pages, ouvrez votre projet : un nouveau déploiement apparaît à chaque modification.
2. Success : ouvrez le site et vérifiez le changement. S’il n’apparaît pas, rechargez la page (Ctrl + F5, ou Cmd + Maj + R sur Mac).
3. Failed : ouvrez le déploiement, copiez les dernières lignes du journal et collez-les dans ChatGPT : « La compilation échoue avec ce message, corrige le problème. »

Vous n’avez pas encore de domaine

1. Le plus simple est de l’acheter chez Cloudflare (Domain Registration → Register Domains), au prix coûtant. Il est alors déjà relié à votre compte.
2. Dans votre projet Pages, ouvrez Custom domains → Set up a custom domain, saisissez le domaine et validez. Cloudflare crée lui-même l’enregistrement DNS.

Vous avez déjà un domaine (OVH, Gandi, IONOS…)

• Recommandé : confier le DNS à Cloudflare. Dans Cloudflare, cliquez Add a domain, puis remplacez chez votre registraire les serveurs DNS par les deux que Cloudflare vous indique. Le domaine reste chez votre registraire ; seule la gestion DNS change. Ensuite, comme ci-dessus : Custom domains → Set up a custom domain.
• Pour un sous-domaine seulement (par exemple www.votre-domaine.fr) : gardez votre DNS actuel et ajoutez chez votre registraire un enregistrement CNAME de nom www et de cible mon-site.pages.dev. Déclarez aussi ce sous-domaine dans Custom domains.

Dernière retouche

Dites à ChatGPT : « Mets à jour l’adresse du site dans astro.config.mjs : https://votre-domaine.fr ». Le plan du site et les liens partagés sur les réseaux utiliseront alors la bonne adresse.

1. 01 Demander à ChatGPT
2. 02 Vérifier sur GitHub
3. 03 Valider commit ou merge
4. 04 En ligne Cloudflare, 1 à 2 min

Modifier un texte, ajouter une page ou remplacer une photo, c’est toujours la même boucle. Quelques demandes typiques :

• « Ajoute un article de blog intitulé “…”, avec ce texte : … et l’image chantier.jpg. »
• « Crée une page Tarifs sur le modèle de la page Services, et ajoute-la au menu. »
• « Ajoute ce témoignage client sur la page d’accueil : … »