Modules maken en bewerken

In de design manager tool, kunt u aangepaste gecodeerde modules maken om geavanceerde functies toe te voegen aan uw blog, pagina's, of e-mails. Aangepaste modules bieden een breed scala aan functionaliteiten, zodat de inhoud kan worden volledig aangepast kan worden binnen de pagina-, e-mail-, of blog-editor. U kunt aangepaste modules bouwen vanuit het niets of vooraf gebouwde modules toevoegen uit de HubSpot Marketplace.

Let op:het maken van modules vereist kennis van HTML, CSS, HubL, en de HubSpot design manager. HubSpot raadt aan om met een ontwerper te werken om gecodeerde modules te maken.

Maak een nieuwe module

• Navigeer in uw HubSpot account naar Marketing > Bestanden en templates > Ontwerphulptools.
• Bovenaan in de Finder, klik op het Bestanddropdown menu en selecteerNieuw bestand.

• Klik in het dialoogvenster op het keuzemenu What would you like to build today? en selecteer Module.

• Klik op Volgende.
• Selecteer of deze module gebruikt zal worden in paginasjablonen, blog sjablonen, en/of email sjablonen. Modules die worden gebruikt in e-mail sjablonen kunnen geen CSS of JavaScript bevatten.

• Selecteer of deze module een lokale module ofeen globalemodule zal zijn.Indien u eenglobale module maakt, zal het wijzigen van de inhoud van deze module elke locatie waar de module gebruikt wordt updaten.
• Voer een bestandsnaam invoor uw module en klik opMaken.

Label uw module

Standaard zal de inhoudseditor naar een module verwijzen met de naam die deze heeft gekregen in de design manager. Als u wilt dat uw module een andere naam gebruikt in de inhoudseditor, kunt u dat doen door een label in te voeren.

Velden toevoegen aan uw module

Voeg velden toe aan de module om de inhoud of styling van de module in te stellen en bewerkbaar te maken in de inhoudseditor. Meer informatie over beschikbare veldtypes vindt u in onze documentatie voor ontwikkelaars.

• Klik in de module-inspector rechts op hetvervolgkeuzemenuVeld toevoegenin desectie Velden enselecteer vervolgens eenveld om aan uw module toe te voegen.

• Bewerk de naam van uw veld door te klikken op hetpotloodjebewerken naast de veldnaam. Om de HubL variabelenaam te bewerken, maak uw wijzigingen in het HubL variabele naam tekstveld.

Voeg veld standaard inhoud toe

In desectie Inhoudsoptieskunt u standaardinhoud toevoegen die verschijnt wanneer de module wordt gebruikt in sjablonen en inhoudseditors. De opties voor standaard inhoud zullen verschillen afhankelijk van het veldtype.

In het voorbeeld hieronder is het veldtype een afbeeldingsveld, dus de opties voor standaard inhoud zijn het selecteren van een standaard afbeelding en het verbergen van de afmetingen.

Veld editor opties instellen

In desectie Editor-optieskunt u de volgende opties inschakelen voor de manier waarop gebruikers de module kunnen bewerken in de inhoudseditor:

• Maak dit veld verplicht: degebruiker zal dit veld niet leeg kunnen laten in de inhoudseditor.
• Voorkom bewerken in inhoudseditors: de veldinhoud kan niet worden bewerkt in de inhoudseditor; het is nog steeds bewerkbaar op sjabloonniveau. Deze optie is niet beschikbaar voorglobale modules, die niet kunnen worden bewerkt op paginaniveau.

• Tooltip helptekst: voeg helptekst toe aan het veld om gebruikers context of instructies te geven. Deze helptekst zal verschijnen in een tooltip wanneer een gebruiker met de muis over het veld gaat tijdens het bewerken.
  
  
• Inline helptekst: voeg helptekst toe aan het veld om gebruikers context of instructies te geven. Deze helptekst zal onder het veld verschijnen wanneer een gebruiker de module bewerkt.

Instellen van voorwaarden voor veldweergave

U kunt veldweergavevoorwaarden gebruiken om een moduleveld zo in te stellen dat het alleen verschijnt als een ander veld aan bepaalde criteria voldoet.

• In deVoorwaarden weergevenklikt u op hetvervolgkeuzemenuHubL-variabeleom een moduleveld te selecteren, en vervolgens op de vervolgkeuzelijst is niet leegom devoorwaarde voor dat veld tekiezen.
• Als u de voorwaarde isgelijk aan selecteert, voert u een waarde ofregex in.

In het onderstaande voorbeeld worden weergavevoorwaarden ingesteld voor een beeldveld. De voorwaarde is dat de waarde in een tekstveld met de naam image_title gelijk moet zijn aan Headshot om het afbeeldingsveld in de module te laten verschijnen.

De weergavevoorwaarden worden automatisch ingeschakeld zodra u een voorwaarde hebt ingesteld. Om de displayvoorwaarden uit te schakelen, klikt u op detuimelschakelaarrechts vanDisplayvoorwaarden.

Instellen veldversterker opties

U kunt repeater-opties instellen voor uw veld in de sectie Repeater-opties . Repeaters zijn velden en groepen die meerdere objecten kunnen maken en weergeven met behulp van een for-lus.

• In deoptiesvan de repeatersectie, selecteer eenminimum en/ofmaximumaantal vereiste instanties van dit veld.
• U kunt er ook voor kiezen om eenstandaard objectaantal in te stellen, wat het aantal instanties van het veld zal zijn dat standaard in de module zal verschijnen.
  

In het voorbeeld hieronder wordt het afbeeldingsveld ingesteld als een afbeeldingsschuifregelaar. De limieten voor het aantal objecten zijn zoingesteld dat er minimaal3 afbeeldingsvelden in de moduleverschijnen, tot een maximum van 5 afbeeldingsvelden. Een gebruiker zal standaard 4afbeeldingsveldenin de module zien verschijnen, en kan kiezen om een extra afbeeldingsveld toe te voegen of een bestaand afbeeldingsveld te verwijderen.

De repeater-opties worden automatisch ingeschakeld zodra u een van de opties hebt gewijzigd. Om de repeater-opties uit te schakelen, klikt u op detuimelschakelaarrechts van RepeaterOptions.

Groep module velden

Nadat u velden hebt aangemaakt, kunt u er tot 4 groeperen om uw velden op relevantie te ordenen. Veldgroepen kunnen worden gebruikt om aangepaste veldlogica op te bouwen. Meer informatie over module veldgroepen.

Om modulevelden te groeperen:

• Klik op Groep in de rechter zijbalk van de module editor.
  
  
• Selecteer de veldendie u wilt groeperen.
• Klik op Groepmaken.

Kopieer en plak uw veld knipsels