Doorgaan naar artikel
Let op: De Nederlandse vertaling van dit artikel is alleen bedoeld voor het gemak. De vertaling wordt automatisch gemaakt via een vertaalsoftware en is mogelijk niet proefgelezen. Daarom moet de Engelse versie van dit artikel worden beschouwd als de meest recente versie met de meest recente informatie. U kunt het hier raadplegen.
Design Manager

Bouw een aangepaste gecodeerde sjabloon

Laatst bijgewerkt: januari 10, 2022

Geldt voor:

Marketing Hub Professional, Enterprise
CMS Hub Professional, Enterprise
Legacy Marketing Hub Basic

Ontwikkelaars kunnen blog-, website-, landingspagina- en e-mailsjablonen vanaf nul bouwen met HTML. U kunt ook een sjabloonlay-out met slepen en neerzettenklonen naar HTML, en deze vervolgens aanpassen als een gecodeerde sjabloon.

De soorten inhoud die aangepaste gecodeerde sjablonen kunnen gebruiken, hangen af van uw Marketing Hub en CMS Hub abonnementen:

Geen Marketing Hub abonnement

OF

Marketing Hub Starter

Marketing Hub Professioneel/Onderneming

OF

Legacy Marketing Hub Basis

Geen CMS Hub abonnement

Aangepaste gecodeerde sjablonen niet beschikbaar

Op maat gemaakte sjablonen beschikbaar voor blogs, landingspagina's en e-mails

CMS Hub Starter

Aangepaste gecodeerde sjablonen beschikbaar voor blogs en website pagina's

Op maat gemaakte sjablonen beschikbaar voor blogs, landingspagina's,website pagina's, ene-mails

CMS Hub Professional/Enterprise

Op maat gecodeerde sjablonen beschikbaar voor blogs, landingspagina's en website pagina's

Op maat gemaakte sjablonen beschikbaar voor blogs, landingspagina's,website pagina's, ene-mails

Maak een nieuw HTML & HUBL bestand

  • Navigeer in uw HubSpot account naar Marketing > Bestanden en templates > Ontwerphulptools.
  • In de linker zijbalk, maak een nieuw bestand door te klikken opBestand>Nieuw bestand.Mogelijk moet u op demapklikken map-icoon om de zoeker uit te vouwen.
  • Klik in het dialoogvenster op het keuzemenuWhat would you like to build today?en selecteerHTML & HUBL.
design-manager-html-hubl
  • KlikVolgende
  • Voer de gegevens van uw nieuwe bestand in:
    • SelecteerSjabloonofSjabloon partieel. Een sjabloonpartieel is een sjabloon dat binnen andere sjablonen kan worden gebruikt.
    • In het dropdown menu, selecteer het type sjabloon dat je codeert (pagina, blog, of email).
    • Geef uw bestand een naam.
    • Om de locatie van het bestand bij te werken, klikt u in het gedeelteBestandslocatieopWijzigenen selecteert u de map waaraan u het bestand wilt toevoegen.
  • Klik opMaken.
  • Schrijf de HTML voor je pagina of email sjabloon.
  • Om te zien hoe uw HubL zal renderen, klik om de Toon uitvoer schakelaar aan te zetten. Een paneel opent aan de rechterkant met de gerenderde preview.


    design-manager-show-output
  • In de rechterbovenhoek, klik op Voorbeeld om te zien hoe uw sjabloon zal verschijnen en functioneren in de content editor. Dit voorbeeld wordt gesynchroniseerd met de editor en wordt automatisch vernieuwd terwijl u werkt.
  • Klik in de rechterbovenhoek opWijzigingen publiceren
Eventuele fouten in uw code zullen worden gemarkeerd in een foutmelding wanneer u wijzigingen probeert te publiceren. De foutenconsole onderaan de code-editor zal de details van de fout of waarschuwing weergeven, evenals suggesties over hoe u deze fouten en waarschuwingen kunt oplossen.

error-console

Voor aanvullende bronnen over aangepast ontwerp, kunt u deHubSpot designer documentatie raadplegen. Er is aanvullendedocumentatie over gecodeerde moduleoptieszoals filtertags en pictogrammen.

Voeg de vereiste HubL tags toe

Je krijgt een foutmelding te zien als je code vereiste HubL-tags mist als je het bestand zou proberen te publiceren.

Website, landingspagina en blog sjablonen vereisen de volgende tags:

  • {{standard_footer_includes}}
  • {{standard_header_includes}}
Email sjablonen vereisen de volgende tags om CAN-SPAM compliant te zijn. Ze kunnen op twee manieren worden toegevoegd:
  • Neem deze token op die de afmeldingssectie CAN-SPAM binnenhaalt: {{unsubscribe_section}}. Voeg vervolgens deze tokens individueel toe:
    • {{site_settings.company_street_address_1}}
    • {{site_settings.company_city}}
    • {{site_settings.company_state}}
    • {{site_settings.company_zip}}
    • Met deze methode heb je niet de mogelijkheid om de taal en stijl van de tekst en links op te maken.

  • Gebruik deze tokens afzonderlijk..:
    • {{site_settings.company_name}}
    • {{unsubscribe_link}} of {{unsubscribe_link_all}} (neem er minstens één op)
    • {{unsubscribe_anchor}}
    • {{site_settings.company_name}}
    • {{site_settings.company_street_address_1}}
    • {{site_settings.company_city}}{site_settings.company_state}}
    • {{site_settings.company_zip}}
    • Door de tokens individueel te gebruiken, heeft u de flexibiliteit om tekst toe te voegen rond de tokens en links en om ze op te maken in de gewenste stijl en taal.

Klonen naar HTML

Naast het maken van een template vanaf nul, kunt u ook een van HubSpot's templates klonen naar HTML. Het klonen van een sjabloon naar HTML geeft u toegang tot de HTML-inhoud van een sjabloon.

Om een gecodeerde versie van een bestaand sjabloon te maken:

  • Navigeer in uw HubSpot account naar Marketing > Bestanden en templates > Ontwerphulptools.
  • Klik opActies>Kopiëren naar HTML in de Finder. Het HTML-bestand wordt aangemaakt in dezelfde map als het originele bestand. De bestandsnaam zal overeenkomen met de naam van het originele sjabloon met dekopieer aan toegevoegd.
design-manager-clone-to-html

New call-to-action

Was this article helpful? *
This form is used for documentation feedback only. Learn how to get help with HubSpot.