viewport overflow

Identifier l’élément plus large que le viewport en JavaScript

Sur mobile, un site peut parfois bouger horizontalement alors qu’aucun élément ne semble dépasser. Vous faites glisser la page vers la gauche, et une vilaine bande apparaît à droite. Elle était là, tapie dans l’ombre. Très professionnelle, évidemment.

Ce problème vient presque toujours d’un élément plus large que le viewport. Il peut s’agir d’une image, d’un tableau, d’un slider, d’un bloc WooCommerce, d’un menu mobile, d’une section en width:100vw, d’une grille CSS, ou d’un élément positionné hors écran.

Voici une méthode moderne pour identifier l’élément responsable avec Vanilla JavaScript, puis corriger proprement l’overflow horizontal sans masquer le problème sous un grand tapis CSS.

Lire Identifier l’élément plus large que le viewport en JavaScript

PoEdit : mettre à jour les fichiers de traduction de vos thèmes et plugins WordPress photo

Poedit : mettre à jour les traductions WordPress d’un thème ou plugin

Poedit permet de traduire facilement un thème ou un plugin WordPress à partir de fichiers .pot, .po et .mo. C’est pratique, visuel, et nettement plus agréable que de traduire des chaînes dans un éditeur brut en espérant ne pas casser une forme plurielle au passage.

Mais le workflow WordPress a évolué. Aujourd’hui, il faut aussi penser aux chaînes JavaScript, aux blocs Gutenberg, aux fichiers JSON de traduction, aux language packs, et aux traductions personnalisées qui ne doivent pas être écrasées à la prochaine mise à jour.

Voici donc une méthode moderne pour mettre à jour les traductions d’un thème ou d’un plugin WordPress avec Poedit, tout en gardant un workflow propre avec WP-CLI quand vous contrôlez le code.

Lire Poedit : mettre à jour les traductions WordPress d’un thème ou plugin

Le mot "LOST" est formé de plusieurs petits mots noirs qui répètent "FOUND" sur un fond blanc, évoquant le contraste entre être perdu et retrouvé - un peu comme corriger les images perdues dans WordPress.

WordPress : corriger les images qui ont perdu leur chemin

Sur WordPress, une image peut disparaître alors que le fichier existe encore sur le serveur. L’article affiche une icône cassée, la bibliothèque de médias semble confuse, et l’URL générée ne mène nulle part. Bref, l’image n’a pas disparu. Elle a juste perdu son chemin. Ambiance GPS en forêt.

Le cas classique : WordPress stocke un mauvais chemin dans la base de données. Parfois, il mélange une URL publique avec un chemin serveur privé. Parfois, il garde l’ancien domaine après une migration. Parfois, il pointe vers un dossier qui n’existe plus. Dans tous les cas, il faut diagnostiquer avant de corriger.

Symptômes : images cassées dans WordPress

Le problème peut apparaître de plusieurs façons :

  • les images ne s’affichent plus dans les articles ;
  • la bibliothèque de médias affiche des vignettes cassées ;
  • certaines images fonctionnent, mais pas les anciennes ;
  • les URLs contiennent encore l’ancien domaine ;
  • les URLs contiennent un chemin serveur comme /home/public_html/ ;
  • les miniatures sont manquantes après un changement de thème ;
  • Google Search Console signale des images introuvables ;
  • le navigateur retourne une erreur 404 ou 403 sur les fichiers image.

Avant de lancer une requête SQL, ouvrez une image cassée dans un nouvel onglet. Regardez l’URL exacte. C’est souvent elle qui donne le diagnostic.

Lire WordPress : corriger les images qui ont perdu leur chemin