Personnaliser les paramètres du gestionnaire de conception

Personnalisez votre expérience de développeur avec les paramètres du gestionnaire de conception. Les paramètres du gestionnaire de conception incluent le comportement de démarrage par défaut du gestionnaire de conception, les paramètres de code pour les fichiers codés personnalisés et le linting JavaScript.

Personnaliser les paramètres généraux

1. Dans votre compte HubSpot, accédez à Contenu > Gestionnaire de conception.
2. En bas à droite, cliquez sur Settings, puis sélectionnez Open settings.
3. Pour ouvrir la recherche lorsque vous accédez au gestionnaire de conception, activez l’option Démarrer l’option Ouvrir le Finder . 
4. Pour mettre à jour automatiquement l’aperçu lors du basculement d’un fichier à l’autre, activez l’option Mettre à jour l’aperçu lors de la commutation de fichiers dans la section Au démarrage .
5. Pour activer les avertissements de pré-rendu, activez l’option Activer les avertissements de pré-rendu dans la section Linting HubL .

Personnaliser les paramètres de code

Personnalisez les paramètres de code pour contrôler l’affichage et la modification du code dans l’éditeur de code. Ces paramètres affectent la lisibilité, la cohérence et le comportement du formatage lorsque le code est écrit ou mis à jour.

1. Dans votre compte HubSpot, accédez à Contenu > Gestionnaire de conception.
2. En bas à droite, cliquez sur Settings, puis sélectionnez Open settings.
3. Cliquez sur le menu déroulant Paramètres : Général et sélectionnez Code.
4. Continuez à personnaliser les sections Apparence et Source .

Apparence

• Thème : le schéma de couleurs utilisé par les éditeurs de code.
• Font : la police primaire et la taille de la police utilisées par l'éditeur de code.

Source

• Taille de la tabulation : la largeur d'un caractère de tabulation lorsque l'on appuie sur la touche de tabulation dans l'éditeur de code.
• Unité d'indentation : le nombre d'espaces qu'un bloc de code doit être indenté par l'indentation intelligente.
• Tabulations douces : lorsqu'elle est activée, la touche de tabulation insère des caractères d'espacement égaux à Taille de la tabulation au lieu d'un caractère de tabulation.
• Indentation intelligente : Lorsque cette option est activée, les nouvelles lignes suivent l'indentation définie pour la ligne précédente.
• Indentation lors de la mise en forme de l'entrée : lorsque cette option est activée, indentation de la même ligne lors d'une entrée sensible au contexte. Par exemple, une case x: instruction ou une fermeture } sera correctement mise en retrait lors de son insertion.
• Indenter avec des tabulations : lorsque l'option est activée, l'indentation automatique causée par l'indentation intelligente ou la mise en forme des entrées utilise des tabulations.
• Line wrapping (enveloppement des lignes) : Lorsque cette option est activée, les lignes sont enveloppées au lieu de nécessiter un défilement horizontal.
• Fermeture automatique des crochets : lorsque cette option est activée, l’éditeur de code ferme automatiquement les crochets et les guillemets, tels que :
  () [] {} ’’ ””
• Fermeture automatique des balises : Lorsque cette option est activée, l'éditeur de code ferme automatiquement les balises XML.
• Correspondance des crochets : Lorsque cette option est activée, le fait de placer le curseur à côté d'un caractère de crochet met en évidence le crochet d'ouverture ou de fermeture correspondant.
• Correspondance des balises : lorsque cette option est activée, le placement du curseur à côté d’une balise met en surbrillance la balise d’ouverture ou de fermeture correspondante.
• Continuer les commentaires de bloc : Lorsque cette option est activée, l'éditeur de code continue automatiquement les commentaires de bloc lors de la création de nouvelles lignes.

Paramètres de linting JavaScript

1. Dans votre compte HubSpot, accédez à Contenu > Gestionnaire de conception.
2. En bas à droite, cliquez sur Settings, puis sélectionnez Open settings.
3. Cliquez sur le menu déroulant Paramètres : Général et sélectionnez JS Linter.
4. Cliquez pour activer ou désactiver l'interrupteur Enable ESLint. Lorsque cette option est activée, ESLint s’exécutera sur JavaScript lors de l’affichage du résultat dans des fichiers codés.
5. Dans le panneau de gauche, configurez vos paramètres ESLint. Pour en savoir plus sur la configuration d'ESLint.
6. Dans le panneau de droite, une démonstration JavaScript affichera les modifications que vous avez apportées sur la gauche.
7. Cliquez sur Restaurer eslintrc par défaut pour restaurer la configuration par défaut.