Vind snel antwoorden en algemene informatie over de
design manager tool in HubSpot. Deze bron bevat ook links naar meer bronnen voor ontwerpers die werken aan het CMS.Om meer te leren over ontwerpen op HubSpot, bekijk deHubSpot Academy's Growth Driven Design certificering enHubSpot's CMS documentatie
.De Design certificering is een gratis certificering die een video training en een design practicum omvat.
HubSpot's CMS documentatie bevat:
De beste bron voor interactie met de HubSpot ontwerpersgemeenschap is hetHubSpot ontwerpforum
. Dit forum wordt gemonitord door HubSpot ontwerpers en HubSpot gebruikers met ontwerpexpertise.Voor vragen over HubSpot API ontwikkeling, kijk op hetDevelopers forum
.Met ingang van 27 mei 2020, werd FTP beëindigd en vervangen door de CMS CLI. Lees meer over deze aankondiging.
Terwijl globale modules kunnen wordenterug geconverteerd naar een lokale module
, kunnen globale groepen dat niet. Om een global group voor een enkel template aan te passen, kloon je de global group en voeg je de kloon toe aan je template.De HubSpot lay-out editor maakt gebruik van een 12-koloms rastersysteemgebaseerd opBootstrap 2.x om template ontwerpers in staat te stellen snel volledig responsive webpagina's te bouwen binnen hetHubSpot content platform
.Alle HubSpot drag and drop layouts bevattenautomatischlayout.css
om modules responsive te maken. Als u een ander of aangepast responsief raster zoals Bootstrap 3 wilt gebruiken, moet u ofwel de CSS in layout.css overschrijven of gecodeerde sjablonen gebruiken, waarbij layout.css niet is bijgevoegd.Met Blog content modules kunt ude opmaak van de post en de listing layoutaanpassen
om te bepalen waar de verschillende elementen van een post item renderen.Alle sjabloon lay-outs, gecodeerde bestanden enpagina's hebben een revisiegeschiedeniswaarmee u terug kunt gaan naar elke versie van een sjabloon of stuk inhoud. Voor sjablonen of gecodeerde bestanden klikt u op Acties>
Revisies weergeven om de revisiegeschiedenis te openen.Het v1 module raamwerk verwees naar module velden met . Het v2 raamwerk refereert naar module velden met .
Echter, het gebruik van in het v2 raamwerk zal blijven werken zoals verwacht. Het is niet nodig om uw aangepaste modules te updaten om naar "module" te verwijzen.
In plaats van het gebruik van "get_public_template_url"om JavaScript enCSS bestanden te openen, kunnen deze bestanden nu direct worden toegevoegd aan demodule sidebar editor in deGekoppelde bestandensectie.CSS en JS bestanden die hier worden toegevoegd zullen automatisch worden geladen op pagina's die gebruik maken van de module.
HTML en HubL modules zijn verwijderd. Deze modules boden een snelle manier voor ontwikkelaars om HTML en HubL snippets toe te voegen aan een template. Echter, ze kunnen sjablonen moeilijk te begrijpen en te bewerken maken. Om sjablonen meer voorspelbaar en onderhoudbaar te maken, zijn deze modules verwijderd ten gunste van het houden van alle code binnen de context van aangepaste modules.
Als u HTML moet toevoegen op paginaniveau op een website, kan de HTML-module worden gedownload in deHubSpot Marketplace.
Als u een script van een derde partij gebruikt, koppelt u het scriptbestand aan desectieGekoppelde bestandenin de module-editor. Dan kuntude plugin activeren in de JS sectie van de code editor. Als je parameters moet doorgeven aan de plugin, kun je data attributen gebruiken in de HTML + HubL sectie van de editor om deze waarden op te slaan.
Als je een aangepaste module gebruikt in een e-mail, zullen de CSS en JS secties niet verschijnen in de editor omdat stylesheets en JavaScript niet worden ondersteund in de meeste e-mail clients. Voor e-mail modules, kunt u nog steeds de nodige styling in <style> tags opnemen.
Als u een module gebruikt op uw pagina's of blog posts, zullen de JS en CSS secties verschijnen zoals verwacht.
Modules in v2 van de design manager zijn verpakt in <div> tags, maar modules in de oude design manager waren verpakt in <span> tags. Deze verandering heeft alleen invloed op uw module als u refereert aan de module span in een stylesheet. De volgende verklaring is bijvoorbeeld niet van toepassing in de nieuwe design manager:
span #hs_cos_wrapper_widget_5038393204 {{
Kleur: blauw;
}
Je kunt de <span> tag vervangen door een <div> tag.Het is echter niet aan te raden om te vertrouwen op standaard HubSpot wrappers om je CSS te schrijven. Het is beter om in plaats daarvan aangepaste CSS klassen te gebruiken, zoals "my-custom-module".
Meer informatieover hoe u een fout met geneste modules kunt identificeren en oplossen.Voor geneste modules die in een aantal sjablonen worden gebruikt, kunt u de modulehet beste eerstklonen om te voorkomen dat de inhoud op paginaniveau verloren gaat. Los vervolgens de fouten in de gekloonde module op, en gebruik die kloon in uw sjablonen om verder te gaan.
In plaats van te gebruiken in uw aangepaste module om een globale groep toe te voegen, kunt u een menu veld toevoegen aan uw module of de globale inhoud van de module bewerken.
Ja,u kunt alle oude modules bewerken in de module editor. U zult validatie waarschuwingen en suggesties zien voor code die niet wordt ondersteund in het v2 module framework, maar u zult in staat zijn om deze modules te blijven bewerken en gebruiken in HubSpot.
Terwijl u al uw bestaande aangepaste modules kunt behouden, zult u niet in staat zijn om nieuwe modules te maken met behulp van het oude framework. Als u een legacy module kloont, zal de gekloonde module worden aangemaakt in het nieuwe module framework.