Remarque : même si nos guides les plus populaires ont été traduits en espagnol, certains guides sont uniquement disponibles en anglais.
Utilisation des blocs Code

Vous pouvez utiliser les blocs Code pour ajouter du code personnalisé à une page, à un billet de blog, à une barre latérale ou à un pied de page. Les blocs Code sont très pratiques si vous souhaitez intégrer des widgets tiers ou personnaliser vos pages au-delà des possibilités offertes par d’autres blocs. Vous pouvez également utiliser les blocs Code pour afficher des extraits de code ou restituer du code HTML et Markdown.

Pour en savoir plus sur le choix du meilleur bloc pour du contenu personnalisé, consultez la page Blocs Intégration vs Blocs Code.

Quel que soit le forfait, les blocs Code prennent en charge le code HTML, le texte brut, le code Markdown et le code CSS entouré des tags <style></style>.

L’ajout de code JavaScript ou d’iframes aux blocs Code est une fonctionnalité Premium disponible avec le forfait Entreprise pour site web et les forfaits supérieurs ou lors de la période d’essai.

Pour en savoir plus, rendez-vous sur Fonctionnalités Premium.

Regarder une vidéo

Étape 1 - Ajouter le Bloc Code

  1. Ouvrez un éditeur de page ou d'article.
  2. Cliquez sur un Point d'Insertion ou sur l'icône +.
  3. Sélectionnez Code dans le menu.
  4. Pour des étapes plus détaillées, rendez-vous sur Ajout de blocs.

Étape 2 - Ajouter du code

Si vous affichez du contenu avec le Bloc Code, assurez-vous de sélectionner HTML ou Markdown dans le menu déroulant.

Ensuite, saisissez ou collez le code dans le champ, puis supprimez la balise <p>Hello, World!</p> (<p>Bonjour tout le monde !</p>). Pour coller le code, copiez-le puis cliquez dans la case et appuyez sur Ctrl + V (Windows) ou Cmd + V (Mac).

Remarque : les blocs Code sont limités à 400 Ko, soit environ 300 000 caractères.

Astuce : les codes CSS et JavaScript s’affichent sous forme de texte par défaut. Pour les ajouter aux blocs Code, sélectionnez le menu déroulant HTML et ajoutez des tags. Entourez le code CSS par les tags <style></style> et le code JavaScript par les tags <script></script>.

Étape 3 - Afficher la source (facultatif) 

Si vous utilisez le Bloc Code pour afficher du code, cochez l'option Display Source (Afficher la Source).

Cette option est utile pour afficher des exemples de code, car les blocs Code formatent automatiquement les extraits de code pour des raisons de lisibilité, ce qui en fait une meilleure solution que le bloc Texte.

Remarque : l'option Afficher la Source est toujours cochée pour les options CSS, JavaScript et Plain Text (Texte Clair).

Étape 4 - Enregistrer

Cliquez sur Apply (Appliquer) pour publier vos modifications.

Prévisualiser du code intégré

À titre de mesure de sécurité, votre code ne s'affichera pas toujours lorsque vous êtes connecté(e), même si les visiteurs pourront le voir. Si vous ne pouvez pas voir du code que vous avez ajouté à un Bloc Code, vous pouvez utiliser Preview in Safe Mode (Prévisualiser en Mode Sans Échec) pour consulter l'élément intégré.

Résolution de problèmes

  • Les blocs Code sont limités à 400 Ko, soit environ 300 000 caractères.
  • Votre code peut également ne pas s'afficher si vous l'avez ajouté à une page située dans un Index. Pour effectuer un test, retirez la page de l'Index dans la section Pages, puis déconnectez-vous de votre site.
  • Le chargement Ajax peut causer des problèmes avec du code personnalisé. Pour effectuer un test, désactivez Ajax afin de vérifier si le problème est toujours présent. 

Si vous rencontrez toujours des problèmes pour voir l'effet du code, nous vous recommandons de prendre contact avec la source (par exemple, le service vous ayant communiqué un extrait de code pour un widget), car elle connaît mieux la façon dont il est censé fonctionner.

Remarque  : l'ajout de code personnalisé n'est pas pris en charge par notre service d'assistance. Autrement dit, nous ne somme pas en mesure de vous aider concernant la configuration de code personnalisé ou la résolution de problèmes associés. En outre, si vous utilisez une solution basée sur du code, nous ne pouvons garantir sa fonctionnalité ou son entière compatibilité avec Squarespace, notamment son fonctionnement avec notre design adaptatif et plus particulièrement son affichage sur les appareils mobiles, ainsi que son fonctionnement sur l'ensemble des templates. Les personnalisations tierces peuvent également causer des problèmes d'affichage avec les futures mises à jour de notre plateforme. Bien que nous ne soyons pas en mesure de vous assister à ce sujet, de nombreuses ressources peuvent vous orienter dans la bonne direction :
Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 72 sur 206
Utilisation des blocs Code