Instellingen ontwerpmanager aanpassen

Pas de ervaring van je ontwikkelaar aan met de instellingen van design manager. De instellingen voor design manager omvatten het standaard opstartgedrag van design manager, code-instellingen voor aangepaste bestanden en JavaScript linting.

Algemene instellingen aanpassen

1. Ga in je HubSpot-account naar Inhoud > Design Manager.
2. Klik rechtsonder op Instellingen en selecteer vervolgens Instellingen openen.
3. Om de vinder te openen wanneer u de ontwerpmanager opent, schakelt u de optie Vinder openen bij starten in.
4. Als u de previewer automatisch wilt bijwerken wanneer u tussen bestanden schakelt, schakelt u de optie Previewer bijwerken bij wisselen van bestanden in in het gedeelte Bij opstarten.
5. Om pre-rendering waarschuwingen in te schakelen, zet je de schakelaar Enable Pre-Rendering Warnings aan in het HubL Linting gedeelte.

Code-instellingen aanpassen

Pas code-instellingen aan om te bepalen hoe code wordt weergegeven en bewerkt in de code-editor. Deze instellingen beïnvloeden de leesbaarheid, consistentie en de manier waarop opmaak zich gedraagt als code wordt geschreven of bijgewerkt.

1. Ga in je HubSpot-account naar Inhoud > Design Manager.
2. Klik rechtsonder op Instellingen en selecteer vervolgens Instellingen openen.
3. Klik op het vervolgkeuzemenu Instellingen: Algemeen en selecteer Code.
4. Ga verder met het aanpassen van de onderdelen Uiterlijk en Bron.

Uiterlijk

• Thema: het kleurenschema dat wordt gebruikt door code-editors.
• Lettertype: het primaire lettertype en de lettergrootte die worden gebruikt door de code-editor.

Bron

• Tabgrootte: de breedte van een tab-teken wanneer u op de tab-toets drukt in de code-editor.
• Inspringeenheid: het aantal spaties dat een codeblok moet inspringen door middel van slimme inspringing.
• Soft tabs: indien ingeschakeld voegt de tab-toets spaties in die gelijk zijn aan de grootte van de tab in plaats van een tab-teken.
• Slim inspringen: indien ingeschakeld, volgen nieuwe regels de inspringing van de vorige regel.
• Inspringen bij opmaakinvoer: indien ingeschakeld, springt dezelfde regel in bij contextgevoelige invoer. Bijvoorbeeld, een case x: statement, of een afsluitende } zal correct inspringen bij het invoegen.
• Inspringen met tabs: indien ingeschakeld, zal automatisch inspringen veroorzaakt door slim inspringen of opmaakinvoer tabs gebruiken.
• Regels omwikkelen: indien ingeschakeld, worden regels omwikkeld in plaats van dat horizontaal scrollen nodig is.
• Haakjes automatisch sluiten: indien ingeschakeld, sluit de code-editor automatisch haakjes en aanhalingstekens, zoals:
  () [] {} ’’ ””
• Tags automatisch sluiten: indien ingeschakeld, sluit de code-editor automatisch XML-tags.
• Overeenkomende haakjes: indien ingeschakeld, markeert het plaatsen van de cursor naast een haakjesteken het overeenkomstige openende of sluitende haakje.
• Tags matchen: als deze optie is ingeschakeld, wordt de bijbehorende openings- of sluitingstag gemarkeerd als de cursor naast een tag wordt geplaatst.
• Doorgaan met blokcommentaar: indien ingeschakeld, gaat de code-editor automatisch door met blokcommentaar bij het maken van nieuwe regels.

JavaScript linting instellingen

1. Ga in je HubSpot-account naar Inhoud > Design Manager.
2. Klik rechtsonder op Instellingen en selecteer vervolgens Instellingen openen.
3. Klik op het vervolgkeuzemenu Instellingen: General dropdown menu en selecteer JS Linter.
4. Klik om de schakelaar ESLint inschakelen aan of uit te zetten. Als deze aan staat, zal ESLint JavaScript overslaan bij het bekijken van uitvoer in gecodeerde bestanden.
5. Configureer je ESLint-instellingen in het linkerpaneel. Meer informatie over het configureren van ESLint.
6. In het rechterpaneel toont een JavaScript-demo de wijzigingen die u links hebt gemaakt.
7. Klik op Standaard eslintrc herstellen om de standaardconfiguratie te herstellen.