Skip to main content

​
Aperçu

Si du HTML invalide ou cassé est ajouté au champ Custom HTML de l’éditeur de panier, cela peut casser la mise en page et rendre l’interface de l’éditeur inutilisable. Ce guide vous explique comment réparer temporairement la mise en page afin de pouvoir supprimer en toute sécurité le code défectueux et restaurer toutes les fonctionnalités.

​
Causes du problème

Ce problème survient généralement lorsqu’un marchand :
  • Insère des balises <style> ou <script> sans structure appropriée
  • Laisse des balises HTML non fermées ou mal appariées
  • Ajoute du contenu qui casse la mise en page dans le champ Custom HTML
En conséquence, l’éditeur de panier devient illisible ou inutilisable et peut empêcher les utilisateurs de modifier, voire de faire défiler la page.

​
Correction temporaire à l’aide des outils de développement

Suivez ces étapes pour réparer temporairement la mise en page à l’aide des outils de développement de votre navigateur afin de pouvoir accéder au champ Custom HTML.

​
Étape 1 : Ouvrir les DevTools

  1. Ouvrez l’éditeur de panier dans l’application Upcart
  2. Faites un clic droit n’importe où sur la page et sélectionnez Inspect, ou appuyez sur :
    • Cmd + Option + I (Mac)
    • Ctrl + Shift + I (Windows)

​
Étape 2 : Trouver le conteneur de mise en page cassé

  1. Dans l’onglet Elements des DevTools, cliquez sur l’outil de sélection (coin supérieur gauche des DevTools)
  2. Survolez la mise en page de l’éditeur de panier et trouvez la section surlignée en vert à gauche du panneau de paramètres. Elle devrait être libellée :
  3. Remontez de six niveaux dans la hiérarchie jusqu’à atteindre :

​
Étape 3 : Désactiver la position fixe

  1. Avec .Polaris-Frame__Content sélectionné, regardez sous l’onglet Styles
  2. Trouvez la propriété position: fixed et décochez-la
Cela devrait débloquer la page et vous permettre à nouveau de faire défiler la mise en page.

​
Supprimer le HTML invalide

Maintenant que la mise en page est à nouveau accessible :
  1. Faites défiler jusqu’au champ Custom HTML
  2. Recherchez tout HTML cassé ou CSS intégré qui pourrait avoir causé le problème
Exemple de ce qui casse généralement la mise en page :
  1. Copiez le contenu ailleurs en tant que sauvegarde, puis supprimez-le
  2. Enregistrez vos modifications

​
Confirmer que c’est réparé

Après l’enregistrement, l’éditeur de panier devrait à nouveau se charger normalement. Si le problème persiste, vérifiez à nouveau la présence de balises invalides restantes ou contactez le marchand pour confirmer ce qui a été ajouté.

​
Bonnes pratiques pour prévenir ce problème

  • N’insérez que du HTML complet et valide
  • Évitez d’ajouter des blocs <style> en ligne directement dans les emplacements HTML
  • Utilisez la section Custom CSS plutôt que d’ajouter du CSS dans les champs HTML
  • Prévisualisez toujours vos modifications en mode Sandbox en cas de doute