Salta al contenuto
Nota bene: la traduzione in olandese di questo articolo è fornita solo per comodità. La traduzione viene creata automaticamente tramite un software di traduzione e potrebbe non essere stata revisionata. Pertanto, la versione inglese di questo articolo deve essere considerata come la versione di governo contenente le informazioni più recenti. È possibile accedervi qui.
Design Manager

Costruire un modello codificato personalizzato

Ultimo aggiornamento: settembre 1, 2021

Si applica a:

Marketing Hub Professional, Enterprisee
CMS Hub Professional, Enterprisee
Legacy Marketing Hub Basic

I designer possono costruire siti web, landing page e modelli di blog da zero usando l'HTML. Marketing Hub Gli account professionali ed Enterprise sono in grado di costruire anche modelli di e-mail personalizzati e codificati. E' anche possibile clone un layout di un modello HubSpot in HTML, e personalizzarlo come un modello codificato.

Questo articolo include informazioni su come creare e risolvere i modelli codificati personalizzati, così come ciò che HubL è richiesto nei tuoi modelli. Se non ti senti a tuo agio a lavorare con il codice, usa uno dei template già pronti nel tuo account HubSpot o dai un'occhiata al mercato dei modelli a acquistare modelli pre-fatti.

Nota bene: un template codificato su misura non è responsivo di default. Lavora con un designer professionista per assicurarti che il tuo template sia reattivo per diverse dimensioni dello schermo.

Creare un nuovo file HTML & HUBL

  • Nel tuo account HubSpot, naviga su Marketing > File e Modelli > Strumenti di progettazione.
  • Nella barra laterale sinistra, crea un nuovo file cliccando suFile>New file.Potrebbe essere necessario fare clic sullacartella icona della cartella per espandere il finder.
  • Nella finestra di dialogo, fare clic sul menu a discesaCosa vorresti costruire oggi?e selezionareHTML & HUBL.
design-manager-html-hubl
  • Fare clic suAvanti
  • Inserisci i dettagli del tuo nuovo file:
    • SelezionareTemplateoTemplate Partial. Un template partial è un template che può essere usato all'interno di altri template.
    • Nel menu a discesa, selezionare il tipo di modello che si sta codificando (pagina, blog o email).
    • Dai un nome al tuo file.
    • Per aggiornare la posizione del file, nella sezioneFile location, cliccaChangee seleziona la cartella a cui aggiungere il file.
  • Clicca suCreate.
  • Scrivi l'HTML per la tua pagina o modello di e-mail.
  • Per vedere l'anteprima del rendering di HubL, clicca per attivare l'interruttore Show output. Si aprirà un pannello sulla destra con l'anteprima del rendering.


    design-manager-show-output
  • In alto a destra, clicca su Preview per vedere in anteprima come apparirà e funzionerà il tuo modello nell'editor di contenuti. Questa anteprima si sincronizza con l'editor e si aggiorna automaticamente mentre lavori.
  • In alto a destra, cliccaPublish changes
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.

error-console

Per ulteriori risorse sul design personalizzato, puoi fare riferimento alladocumentazione del designer di HubSpot. C'è unadocumentazioneaggiuntivasulle opzioni dei moduli codificaticome i tag dei filtri e le icone.

Aggiungere i tag HubL richiesti

Vedrai un messaggio di errore se il tuo codice manca di qualsiasi tag HubL richiesto se dovessi provare a pubblicare il file.

I template di siti web, landing page e blog richiedono i seguenti tag:

  • {{standard_footer_includes}}
  • {{standard_header_includes}}
I modelli di e-mail richiedono i seguenti tag per essere conformi alla normativa CAN-SPAM. Possono essere aggiunti in due modi:
  • Includi questo token che tira dentro la sezione CAN-SPAM di disiscrizione: {{unsubscribe_section}}. Poi, aggiungi questi token individualmente:
    • {{site_settings.company_street_address_1}}
    • {{sito_settings.company_city}}
    • {{sito_settings.company_state}}
    • {{sito_settings.company_zip}}
    • Con questo metodo, non avrai la possibilità di formattare la lingua e lo stile del testo e dei link.

  • Usa questi gettoni individualmente:
    • {{sito_settings.company_name}}
    • {{unsubscribe_link}} o {{unsubscribe_link_all}} (includerne almeno uno)
    • {{unsubscribe_anchor}}
    • {{sito_settings.company_name}}
    • {{sito_settings.company_street_address_1}}
    • {{sito_settings.company_city}}{{sito_settings.company_state}}
    • {{sito_settings.company_zip}}
    • Usare i token individualmente ti permetterà la flessibilità di aggiungere parole intorno ai token e ai link e di formattarli nello stile e nella lingua desiderati.

Clonare in HTML

Oltre a creare un template da zero, puoi anche clonare uno dei template di HubSpot in HTML. Clonare un template in HTML ti dà accesso al contenuto HTML di un template.

Per creare una versione codificata di un template esistente:

  • Nel tuo account HubSpot, naviga su Marketing > File e Modelli > Strumenti di progettazione.
  • Fare clic suActions>Clone to HTML nel finder. Il file HTML verrà creato nella stessa cartella del file originale. Il nome del file corrisponderà al nome del modello originale con l'aggiunta di unacopia.
design-manager-clone-to-html

New call-to-action