Texte Arabe Qui Se Casse WordPress : corriger les lettres qui se séparent, éviter les espaces bizarres, et afficher l’arabe proprement sur mobile et PC.

Quand un thème ou un constructeur applique un espacement des lettres, l’arabe peut perdre ses connexions. Le premier endroit à vérifier est la typographie du thème (titres, paragraphes, menus) ou les réglages d’un bloc (Gutenberg, Elementor, etc.).

/* Colle ceci dans "CSS additionnel" (Apparence → Personnaliser → CSS additionnel)
   ou dans ton thème enfant.
   Le but : empêcher l'espacement des lettres de casser la connexion des lettres arabes. */

:where([lang="ar"], .arab, .rtl-ar){
  direction: rtl;
  unicode-bidi: isolate;
  letter-spacing: normal !important;
  word-spacing: normal !important;
  font-variant-ligatures: normal;
}

/* Cas fréquent : le thème met du letter-spacing sur les titres et menus */
:where(h1, h2, h3, .site-title, .menu, nav, .wp-block-button, .wp-block-heading) :where([lang="ar"], .arab, .rtl-ar){
  letter-spacing: normal !important;
  word-spacing: normal !important;
}

/* Optionnel : si tu veux une classe simple à utiliser dans l’éditeur */
.rtl-ar{ font-family: "Amiri","Noto Naskh Arabic","Scheherazade New", Arial, sans-serif; }

Ensuite, quand tu colles une phrase arabe, garde une structure simple : نص عربي متصل dans un seul bloc, sans découper les lettres en plusieurs morceaux. Si tu as besoin de mélanger du français et de l’arabe dans la même phrase, l’accordéon “RTL propre” te montre une structure stable.

Sur un site en français, l’affichage est généralement LTR (gauche → droite). Quand tu ajoutes de l’arabe (droite → gauche), le rendu devient très propre si tu indiques clairement la langue et la direction sur la portion arabe.

<p>
  Voici un exemple en français, puis une portion en arabe :
  <span class="rtl-ar" lang="ar" dir="rtl">السَّلَامُ عَلَيْكُمْ</span>.
</p>

Si tu vois un rendu bizarre après un copier-coller, l’accordéon “caractères invisibles” te fait gagner beaucoup de temps : caractères arabes cassés et Unicode arabe : problème.

Quand tu copies depuis un PDF, un Word, ou parfois Google Docs, il peut y avoir des caractères invisibles (espaces spéciaux, séparateurs, marques de direction). Résultat : certaines lettres se comportent comme si elles étaient coupées, surtout au milieu d’un mot.

Quand tu veux mettre un mot arabe en gras ou en bleu, fais-le sur le mot entier, pas en découpant les lettres. Exemple stable : اللغة العربية.

Si tu utilises un constructeur et que tu appliques des styles “par morceau” (un span pour une couleur, un span pour une autre), l’arabe peut se retrouver fragmenté. Visuellement, cela donne l’impression que la police “ne colle plus” les lettres.

Si ton problème est surtout lié à la mise en page dans l’éditeur, cette page aide : Écrire en arabe sur WordPress. Si le problème se produit dans Canva aussi, voici la page dédiée : Arabe sur Canva : lettres séparées.

Certaines polices ne gèrent pas correctement les formes arabes (ou ne les gèrent pas du tout). Quand ton thème force une police “latin-only”, l’arabe peut s’afficher de manière étrange, surtout dans les titres.

Exemple d’affichage attendu : العَرَبِيَّةُ تَظْهَرُ مُتَّصِلَةً. Si tu vois des formes incohérentes ou des glyphes “bizarres”, vérifie la police appliquée au conteneur.

Les endroits où l’on retrouve souvent la règle qui casse l’arabe sont les réglages typographiques : titres (H1/H2/H3), menus, boutons, et parfois les “badges” ou petits textes du header.

Si tu tapes l’arabe au clavier et que le rendu change selon l’appareil, ces pages peuvent t’aider : Clavier arabe et Clavier arabe copier-coller.

Les thèmes appliquent souvent des styles spécifiques aux titres : espacement des lettres, transformation, ou police différente. Si un style de type letter-spacing est actif, il peut casser les connexions arabes. La solution la plus stable est de forcer letter-spacing: normal sur l’arabe dans les titres (le bloc CSS prêt à copier le fait déjà).

Pour un guide complet : Écrire en arabe sur WordPress.

Non. Tu peux très bien garder un site en français et afficher des passages en arabe. L’important est de bien isoler les portions arabes avec lang="ar" et dir="rtl", et d’éviter les styles qui “écartent” les lettres.

Pour les réglages RTL dans l’éditeur : texte arabe RTL Gutenberg.

Les PDF ajoutent parfois des séparateurs invisibles ou une structure interne qui n’est pas faite pour le web. Le plus simple est de coller d’abord en texte brut, puis de remettre la mise en forme dans WordPress. Si tu veux des solutions classées : caractères arabes cassés et Unicode arabe : problème.

Sur mobile, les thèmes appliquent parfois d’autres règles (responsive) sur les titres et menus. Vérifie si l’espacement des lettres change selon la taille d’écran, et applique un correctif CSS qui cible l’arabe. Pour taper facilement : Clavier arabe iPhone et Clavier arabe Android.

Si tu veux continuer sans te disperser, voici des sujets qui complètent parfaitement le thème “écrire et afficher l’arabe” sur un site WordPress.

• 🖊️ Écrire en arabe sur WordPress

  Réglages, blocs, HTML minimal, affichage RTL propre.
  ›
• ↔️ Texte arabe RTL Gutenberg

  Direction, alignement, portions mixtes, rendu stable.
  ›
• 🧩 Texte arabe séparé : solution

  Pourquoi les lettres se séparent et comment verrouiller l’affichage.
  ›
• 🧷 Unicode arabe : problème

  Caractères invisibles, copier-coller, compatibilité web.
  ›
• 🎨 Arabe sur Canva : lettres séparées

  Même type de souci, bonnes pratiques de rendu et de police.
  ›
• 📋 Clavier arabe copier-coller

  Copier un texte propre, éviter les caractères invisibles.
  ›

Voici des articles du même univers “affichage et écriture”, utiles juste après cette page.

• 🧨 Texte Arabe Qui Se Casse WordPress

  La page que tu lis : causes + corrections simples.
  ›
• 🖊️ Écrire en arabe sur WordPress

  Méthode propre dans l’éditeur + HTML minimal.
  ›
• ↔️ RTL Gutenberg

  Direction et rendu stable en page française.
  ›
• 🧩 Texte arabe séparé : solution

  Connexions cassées, corrections ciblées.
  ›
• 🧼 Caractères arabes cassés

  Copie-coller, PDF, symboles invisibles.
  ›
• 🧷 Unicode arabe : problème

  Pourquoi certains textes se comportent mal sur le web.
  ›
• 🎨 Canva : lettres séparées

  Problèmes proches, solutions de police et de rendu.
  ›
• 📋 Lettres séparées (copier-coller)

  Méthodes simples pour nettoyer le texte.
  ›
• ⌨️ Clavier arabe

  Installer, changer de langue, taper proprement.
  ›
• 🔤 Police arabe (Canva)

  Choisir une police qui respecte les formes arabes.
  ›
• 🔤 Police arabe (Word)

  Éviter les rendus étranges dans les documents.
  ›
• 🖥️ Écrire en arabe sur ordinateur

  Clavier, direction RTL, compatibilité.
  ›