Ultimo aggiornamento: marzo 22, 2021
Nel tuo strumento di gestione del design, i designer possono costruire modelli con HTML da zero. Per Marketing Hub gli account Professional ed Enterprise, questo include modelli di email personalizzati codificati. E' anche possibile clonare il layout di un modello HubSpot in HTML, e personalizzarlo come un modello codificato.
Questo articolo include come creare e risolvere i modelli personalizzati codificati, così come ciò che HubL è richiesto nei vostri modelli. Se non sei a tuo agio a lavorare con il codice, usa uno dei template già pronti nel tuo account HubSpot o controlla ilmarketplace dei template per acquistare template già pronti.
Nota: un template codificato su misura non sarà responsive di default. Lavora con un designer professionista per assicurarti che il tuo template sia reattivo per le diverse dimensioni dello schermo.
Creare un nuovo file HTML e HUBL
- Nel tuo account HubSpot, naviga su Marketing > File e Modelli > Strumenti di progettazione.
- Crea un nuovo file cliccando File > Newfile.Potrebbe essere necessario fare clic sull'icona della cartella per espandere il finder.
- Nella finestra di dialogo, clicca su HTML & HUBL.
- Inserisci i dettagli del tuo nuovo file:
- Seleziona Template o Template Partial.
- Seleziona il tipo di template che stai codificando (pagina, blog o email).
Nota: un abbonamento Marketing Hub Professional o Enterprise
è richiesto per costruire un modello di email codificato personalizzato.-
- Dai un nome al tuo file.
- Clicca Create.
- Scrivi l'HTML per la tua pagina o il tuo modello di email.
- Per vedere in anteprima come il tuo HubL sarà reso, clicca per attivare l'interruttore Show output. Si aprirà un pannello sulla destra con l'anteprima del rendering.
- Qualsiasi errore nel tuo codice sarà segnalato in un messaggio di errore quando proverai a pubblicare le modifiche. La console degli errori nella parte inferiore dell'editor di codice mostrerà i dettagli dell'errore o dell'avvertimento, così come i suggerimenti su come puoi correggere questi errori e avvertimenti.
Per ulteriori risorse sul design personalizzato, si può fare riferimento a HubSpot documentazione del designer. C'è ulterioredocumentazione sulle opzioni del modulo codificato come i tag dei filtri e le icone.
Quando hai finito, clicca su Publish changes per pubblicare il template o il file HTML.
Aggiungere i tag HubL necessari
Una volta che hai scritto il tuo HTML strutturale, vedrai un messaggio di errore se il tuo codice manca di qualche tag HubL richiesto se dovessi provare a pubblicare il tuo file. I tag HubL connettono il tuo codice alle impostazioni e all'editor di contenuti di HubSpot.
Per i modelli di e-mail, è necessario includere i token richiesti per l'e-mail e CAN-SPAM
. Questi token possono essere aggiunti in due modi: 1. Includere un token che tira dentro la sezione CAN-SPAM di cancellazione: {{unsubscribe_section}}. Quando si usa questo token, non si avrà la possibilità di formattare la lingua e lo stile del testo e dei link. Ecco un esempio di come sarebbe l'{{unsubscribe_section}}:
È quindi necessario aggiungere i seguenti token individualmente:
{{site_settings.company_street_address_1}}
{{site_settings.company_city}}
{{site_settings.company_state}}
{{site_settings.company_zip}}
Usare i token individualmente vi permetterà la flessibilità di aggiungere parole intorno ai token e ai link e di formattarli nello stile e nella lingua desiderati.
Clonare in HTML
Un'alternativa alla codifica da zero è la clonazione di uno dei modelli di HubSpot in HTML. Clonare un modello in HTML ti dà accesso all'HTML/HubL di un modello ed è un ottimo modo per fare reverse engineering di un modello HubSpot che hai costruito.
Per creare una versione codificata di un modello esistente:
- {{ local.navDesignManager }}
- Clicca su Actions > Clone to HTML nel finder. Il file HTML si aprirà in una nuova scheda del tuo gestore di design. Il nome del file corrisponderà al nome del modello originale con copia aggiunta ad esso.
