Hitta svar och allmän information snabbt
om designhanteringsverktyget i HubSpot. Den här resursen innehåller också länkar till fler resurser för designers som arbetar med CMS.Om du vill lära dig mer om design i HubSpot kan du kolla inHubSpot Academys Growth Driven Design-certifiering ochHubSpot CMS-dokumentation
.Designcertifieringen är en kostnadsfri certifiering som innehåller videoutbildning och ett designpraktikum.
HubSpot's CMS-dokumentation innehåller bland annat följande:
Den bästa resursen för att interagera med HubSpot-designergemenskapen ärHubSpot-designforumet
. Detta forum övervakas av HubSpot-designers och HubSpot-användare med designkunskap.Om du har frågor om HubSpot API-utveckling kan du gå tillforumet för utvecklare
.Från och med den 27 maj 2020 upphörde FTP och ersattes av CMS CLI. Läs mer om detta tillkännagivande.
Medan globala moduler kankonverteras tillbaka till en lokal modul
kan globala grupper inte göra det. Om du vill redigera en global grupp för en enskild mall klonar du den globala gruppen och lägger sedan till klonen i din mall.HubSpot-layoutredigeraren använder ett 12-kolonners rutnätssystembaserat påBootstrap 2.x för att mallkonstruktörer snabbt ska kunna bygga helt responsiva webbsidor inomHubSpot-innehållsplattformen
.Alla HubSpot-drag-och-släpp-layouter innehållerautomatisktlayout.css
för att göra modulerna responsiva. Om du vill använda ett annat eller anpassat responsivt rutnät, till exempel Bootstrap 3, måste du antingen åsidosätta CSS i layout.css eller använda kodade mallar där layout.css inte är bifogad.Med blogginnehållsmoduler kan duredigera inläggets och listningslayouten
för att styra var de olika elementen i ett inläggsobjekt återges.Alla malllayouter, kodade filer ochsidor har en revideringshistoriksom gör att du kan återgå till vilken version som helst av en mall eller ett innehållsobjekt. För mallar eller kodade filer klickar du på Åtgärder>Visa revisioner
för att komma åt revisionshistoriken.Modulramverket i v1 hänvisade till modulfält med hjälp av . Ramverket v2 hänvisar till modulfält med .
Användning av i v2-ramverket kommer dock att fortsätta att fungera som förväntat. Det är inte nödvändigt att uppdatera dina anpassade moduler så att de hänvisar till "module".
I stället för att använda "get_public_template_url"för att få tillgång till JavaScript- ochCSS-filer kan dessa filer nu bifogas direkt tillmodulens sidobarredigerare iavsnittetLänkade filer.CSS- och JS-filer som inkluderas här kommer automatiskt att laddas på sidor som använder modulen.
Modulerna HTML och HubL har tagits bort.. Dessa moduler var ett snabbt sätt för utvecklare att lägga till HTML- och HubL-utdrag i en mall. De kan dock göra mallar svåra att förstå och redigera. För att göra mallar mer förutsägbara och underhållbara togs dessa moduler bort till förmån för att all kod hålls inom ramen för anpassade moduler.
Om du behöver lägga till HTML på sidnivå på en webbplats kan HTML-modulen laddas ner påHubSpot Marketplace.
Om du använder ett skript från tredje part länkar du skriptfilen till avsnittetLänkade filer imodulredigeraren. Därefter kanduutlösa insticksprogrammet i avsnittet JS i kodredigeraren. Om du behöver skicka parametrar till insticksprogrammet kan du använda dataattribut i avsnittet HTML + HubL i redigeraren för att lagra dessa värden.
Om du använder en anpassad modul i ett e-postmeddelande kommer CSS- och JS-avsnitten inte att visas i redigeraren eftersom formatmallar och JavaScript inte stöds i de flesta e-postklienter. För e-postmoduler kan du fortfarande inkludera nödvändig styling i <style>-taggar.
Om du använder en modul på dina sidor eller blogginlägg visas JS- och CSS-sektionerna som förväntat.
Moduler i v2 av designhanteraren är inplacerade i <div>-taggar, men moduler i den gamla designhanteraren var inplacerade i <span>-taggar. Den här ändringen påverkar bara din modul om du hänvisar till modulens span i ett formatmallblad. Följande deklaration kommer till exempel inte att gälla i den nya designhanteraren:
span #hs_cos_wrapper_widget_5038393204 { Färg: blå; }
Du kan ersätta <span>-taggen med en <div>-tag. Det rekommenderas dock inte att förlita sig på HubSpot-omslagsformatet för att skriva din CSS. Det är bättre att använda anpassade CSS-klasser, till exempel "my-custom-module", i stället.
Läs mer om hur du identifierar och löser ett fel i en inbäddad modul.För nästlade moduler som används på ett antal mallar är det bäst att klona modulen förstför att förhindra att innehåll på sidnivå går förlorat. Lös sedan felen i den klonade modulen och använd klonen i dina mallar framöver.
I stället för att använda i din anpassade modul för att lägga till en global grupp kan du lägga till ett menyfält i din modul eller redigera modulens globala innehåll.
Ja,du kan redigera alla äldre moduler i modulredigeraren. Du kommer att se valideringsvarningar och förslag för kod som inte stöds i v2-modulramverket, men du kommer att kunna fortsätta redigera och använda dessa moduler i HubSpot.
Du kan behålla alla dina befintliga anpassade moduler, men du kan inte skapa nya moduler med hjälp av det gamla ramverket. Om du klonar en äldre modul kommer den klonade modulen att skapas i det nya modulramverket.