Migration des articles vers Shopify

Guide pratique pour le propriétaire d'adhani.fr · Mai 2026

À retenir : ce site Vercel est juste une preview pour visualiser le rendu. Le vrai site reste adhani.fr. Tu reprends les 40 articles + leurs JSON-LD sur ton blog Shopify, puis ce Vercel sera supprimé. Pour chaque article : un fichier HTML (à coller dans l'éditeur Shopify), un schema JSON-LD (à coller dans l'app schema), une meta JSON (title, description, slug, tags). Compter 5 à 6h en manuel ou 30 min avec l'app Matrixify pour un import bulk.

Important : ce blog Vercel est temporaire (preview de validation). Tu dois reprendre l'intégralité des 40 articles sur ton blog Shopify. Aucun lien depuis adhani.fr ne pointe vers ce Vercel, et aucune redirection n'est nécessaire : le Vercel sera supprimé une fois la migration Shopify terminée.

Fichiers à utiliser

Tous les articles sont disponibles dans le dossier articles-export/ du projet local Next.js. Pour chaque article, 4 fichiers :

[slug].html : le contenu HTML prêt à coller dans l'éditeur Shopify (mode source)
[slug].schema.json : les schémas JSON-LD (Article + Breadcrumb + FAQPage) au format objet
[slug].schema.html : les mêmes schémas avec balises <script> prêtes à injecter
[slug].meta.json : titre, meta description, slug, tags, blog handle suggéré

Étape 1 : créer les blogs Shopify

Recommandation : créer 4 blogs pour respecter la structure en clusters.

Admin Shopify → Online Store → Blog posts → Manage blogs → Add blog
Créer ces 4 blogs :
- Heures de prière (handle : heures-de-priere)
- Pratique religieuse (handle : pratique-religieuse)
- Produit & comparatif (handle : produit-comparatif)
- Guides pratiques (handle : guides-pratiques)

Alternative plus simple : 1 seul blog Le Blog Adhani avec tags pour la catégorisation. Moins propre pour le SEO mais plus rapide.

Étape 2 : importer chaque article

Pour chacun des 40 articles, dans Shopify Admin :

Online Store → Blog posts → Add blog post
Sélectionner le blog correspondant au cluster (champ cluster du frontmatter)
Title : copier le champ title du frontmatter
Content : ouvrir l'éditeur en mode HTML (icône < >), coller le contenu de articles-export/[slug].html
Excerpt (résumé) : copier le champ description du frontmatter
Author : Adhani
Tags : copier keyword + tous les secondaryKeywords du frontmatter, séparés par virgules
Search engine listing preview :
- Page title : copier title
- Meta description : copier description
- URL handle : copier le slug du fichier (sans .md)
Visibility : Visible
Save

CSS à ajouter au thème Shopify

Le contenu HTML utilise des classes CSS personnalisées (tldr, cta-card, faq). Pour qu'elles s'affichent correctement, ajouter ce CSS dans le thème (Online Store → Themes → Edit code → assets/theme.css ou base.css) :

.tldr { background: #fff; border: 1px solid #e7e5e4; border-left: 4px solid #0f5132; padding: 1.25rem 1.5rem; margin: 0 0 2rem; border-radius: 4px; }
.tldr strong { color: #0f5132; }
.cta-card { background: linear-gradient(135deg, #fff 0%, #faf7f2 100%); border: 1px solid #b8965a; border-radius: 8px; padding: 1.5rem; margin: 2rem 0; }
.cta-card a { display: inline-block; background: #0f5132; color: #fff; padding: 0.6rem 1.25rem; border-radius: 6px; text-decoration: none; margin-top: 0.75rem; font-weight: 600; }
.cta-card a:hover { background: #b8965a; color: #fff; }
.faq h3 { margin-top: 1.5rem; font-weight: 600; }

Étape 3 : ajouter les schémas JSON-LD

Pour le SEO et le GEO (citations IA), les schémas JSON-LD doivent être présents sur chaque page article. Trois options possibles, du plus simple au plus propre.

Option A : via une app Shopify dédiée (recommandé)

Installer l'une de ces apps :

JSON-LD for SEO : gratuit jusqu'à 10 articles, payant au-delà
Schema App : payant, plus complet, supporte FAQPage
SEO Manager : payant, tout-en-un

Ces apps permettent de coller le JSON-LD par article sans toucher au code thème.

Option B : metafields + theme custom

Si on a un dev sous la main : créer 3 metafields par article (json_ld_article, json_ld_breadcrumb, json_ld_faq), modifier theme.liquid pour les injecter automatiquement dans le <head> quand on est sur une page article. Solution la plus propre, demande 1h de dev.

Option C : code editor brut

Activer "Edit code" sur le thème, ouvrir templates/article.json ou sections/main-article.liquid, ajouter une logique conditionnelle qui ajoute les schémas selon article.metafields.custom.json_ld. Pour chaque article, créer un metafield custom.json_ld et y coller le contenu de articles-export/[slug].schema.json.

Étape 4 : sitemap, robots.txt et llms.txt

Sitemap

Shopify génère automatiquement le sitemap : https://adhani.fr/sitemap.xml. Vérifier que les nouveaux articles y figurent (peut prendre 24-48h).

Soumettre le sitemap dans :

robots.txt

Shopify utilise robots.txt.liquid (Online Store → Themes → Edit code → templates → robots.txt.liquid). Vérifier que ce fichier contient au minimum :

User-agent: GPTBot
Allow: /

User-agent: OAI-SearchBot
Allow: /

User-agent: ChatGPT-User
Allow: /

User-agent: PerplexityBot
Allow: /

User-agent: Google-Extended
Allow: /

User-agent: ClaudeBot
Allow: /

User-agent: anthropic-ai
Allow: /

Si ces lignes ne sont pas là, les ajouter pour autoriser explicitement les bots IA.

llms.txt

Créer un fichier /llms.txt à la racine du domaine. Sur Shopify, deux options :

Online Store → Pages → Add page → Title : llms.txt → URL handle : llms-txt → Content : coller le contenu de public/llms.txt du projet Next.js (en mode HTML brut). Limitation : le fichier sera accessible à /pages/llms-txt, pas à /llms.txt strict.
Pour avoir le vrai /llms.txt : configurer Cloudflare devant Shopify et faire un rewrite (avancé).

Étape 5 : vérifications post-migration

Tester un article publié

Ouvrir l'URL : https://adhani.fr/blogs/[blog-handle]/[slug]
Vérifier que le TLDR s'affiche avec le bon style (encadré gauche vert)
Vérifier que la carte CTA s'affiche correctement
Vérifier que les liens internes fonctionnent (tester 2-3 liens vers d'autres articles)
Vérifier que les liens vers la boutique fonctionnent

Tester le SEO via Search Console

Search Console → URL Inspection → coller l'URL de l'article
Cliquer "Test live URL"
Vérifier "Page is available to Google"
Vérifier les "Enhancements" : Article, Breadcrumbs, FAQ doivent apparaître

Tester le GEO (citations IA)

Une fois 10 articles indexés (compter 1 à 2 semaines), tester dans :

ChatGPT : "donne-moi les heures de prière à Paris" → Adhani devrait apparaître dans les sources
Perplexity : "meilleure horloge adhan 2026" → idem
Google AI Overviews : faire la recherche directement, voir si Adhani est cité

Aide-mémoire des champs frontmatter

Chaque fichier .md commence par un bloc YAML :

---
title: "Titre H1 et title HTML"
description: "Meta description, 155-160 caractères"
keyword: "mot-clé principal"
secondaryKeywords: ["mot-clé 2", "mot-clé 3", "mot-clé 4"]
cluster: "Heures de prière"  # ou "Pratique religieuse" / "Produit & comparatif" / "Guides pratiques"
date: "2026-05-03"
city: "Paris"  # optionnel, pour cluster villes
region: "Île-de-France"  # optionnel
author: "Adhani"
faq:
  - q: "Question 1 ?"
    a: "Réponse détaillée 1."
  - q: "Question 2 ?"
    a: "Réponse détaillée 2."
---

Estimation temps de migration

Tâche	Durée
40 articles à importer manuellement (5 min/article)	3h20
Schémas JSON-LD via app Shopify (2 min/article)	1h20
Configuration thème + sitemap + robots.txt + llms.txt	1h
Total estimé manuel	5h à 6h

Astuce : utiliser l'API Shopify Admin GraphQL ou l'app Matrixify pour automatiser l'import en bulk. Demande 30 min de setup mais divise le temps total par 5.

Voir la stratégie SEO + GEO derrière le blog →
Voir l'index des 40 articles →

Document préparé par Adhani Editorial · Mai 2026