Creare e modificare i moduli

Nello strumento di gestione del design, è possibile creare moduli personalizzati codificati per aggiungere funzioni avanzate al tuo blog, pagine o e-mail. I moduli personalizzati offrono una vasta gamma di funzionalità in modo che il contenuto possa essere completamente personalizzato all'interno dell'editor di pagine, e-mail o blog.. Puoi costruire moduli personalizzati da zero o aggiungere moduli pre-costruiti da HubSpot Marketplace.

Nota:la creazione di moduli richiede la conoscenza di HTML, CSS, HubL e del design manager di HubSpot. HubSpot raccomanda di lavorare con un designer per creare moduli codificati.

Creare un nuovo modulo

• Nel tuo account HubSpot, naviga su Marketing > File e Modelli > Strumenti di progettazione.
• Nella parte superiore del finder, clicca sul menua discesaFile e selezionaNuovo file.

• Nella finestra di dialogo, clicca sul menu a tendina Cosa vorresti costruire oggi? e seleziona Modulo.

• Fare clic su Avanti.
• Seleziona se questo modulo sarà usato neimodelli di pagina, nei modelli di bloge/o nei modelli di e-mail. I moduli usati nei modelli di e-mail non possono includere CSS o JavaScript.

• Seleziona se questo modulo sarà un modulo locale oglobale.Se crei un moduloglobale, la modifica del contenuto di questo modulo aggiornerà ogni luogo in cui il modulo è usato.
• Inserisci un nome di file per il tuo modulo, poi clicca suCreate.

Etichetta il tuo modulo

Per impostazione predefinita, l'editor di contenuti farà riferimento a un modulo usando il nome che gli è stato dato nel gestore del design. Se vuoi che il tuo modulo usi un nome diverso nell'editor di contenuti, puoi farlo inserendo un'etichetta.

Aggiungi campi al tuo modulo

Aggiungi campi al modulo per impostare il contenuto o lo stile del modulo e rendilo modificabile nell'editor dei contenuti. Scopri di più sui tipi di campi disponibili nella nostra documentazione per gli sviluppatori.

• Nell'ispettore del modulo sulla destra, clicca sulmenua discesa Aggiungicampo nellasezione Campi,quindi seleziona uncampo da aggiungere al tuo modulo.

• Modifica il nome del tuo campo cliccando sull'iconadella matitamodifica Per modificare ilnome della variabileHubL, fai le tue modifiche nel campo di testo del nomedella variabile HubL.

Aggiungere il contenuto predefinito del campo

Nellasezione Opzioni di contenuto,si può aggiungere il contenuto predefinito che appare quando il modulo è usato nei modelli e negli editor di contenuto. Le opzioni per il contenuto predefinito saranno diverse a seconda del tipo di campo.

Nell'esempio qui sotto, il tipo di campo è un campo immagine, quindi le opzioni per il contenuto predefinito sono la selezione di un'immagine predefinita e l'occultamento dei controlli di dimensione.

Impostare le opzioni dell'editor di campi

Nellasezione Editor Options,puoi abilitare le seguenti opzioni per come gli utenti possono modificare il modulo nell'editor di contenuti:

• Rendi questo campo obbligatorio: l'utente non potrà lasciare questo campo vuoto nell'editor di contenuti.
• Impedisci la modifica nell'editor dei contenuti: il contenuto del campo non può essere modificato nell'editor dei contenuti; è ancora modificabile a livello di template. Questa opzione non è disponibile per imoduli globali, che non possono essere modificati a livello di pagina.

• Tooltip help text: aggiungi un testo di aiuto al campo per dare agli utenti un contesto o delle istruzioni. Questo testo di aiuto apparirà in un tooltip quando un utente passa sopra il campo mentre lo modifica.
  
  
• Testo di aiuto in linea: aggiungi un testo di aiuto al campo per dare agli utenti un contesto o delle istruzioni. Questo testo di aiuto apparirà sotto il campo quando un utente sta modificando il modulo.

Impostare le condizioni di visualizzazione del campo

Si possono usare le condizioni di visualizzazione dei campi per impostare un campo del modulo in modo che appaia solo se un altro campo soddisfa determinati criteri.

• NelleCondizioni di visualizzazioneclicca sulmenua tendina della variabileHubLper selezionare un campo del modulo, poi clicca sul menu a tendina is not emptyper scegliere lacondizione per quel campo.
• Se selezioni la condizione èuguale a, inserisci un valore o unaregex .

Nell'esempio qui sotto, le condizioni di visualizzazione sono impostate per un campo immagine. La condizione è che il valore in un campo di testo chiamato image_title deve essere uguale a Headshot affinché il campo immagine appaia nel modulo.

Le condizioni di visualizzazione saranno automaticamente abilitate una volta che hai impostato una condizione. Per disabilitare le condizioni di visualizzazione, clicca sull'interruttorea destra diCondizioni di visualizzazione.

Impostare le opzioni del ripetitore di campo

Puoi impostare le opzioni di ripetizione per il tuo campo nella sezione Repeater Options . I ripetitori sono campi e gruppi che possono creare più oggetti e visualizzarli usando un ciclo for.

• Nelleopzionidel ripetitoreselezionate unminimo e/ounmassimonumero di istanze richieste di questo campo.
• Puoi anche scegliere di impostare unconteggio predefinito degli oggetti, che sarà il numero di istanze del campo che apparirà di default nel modulo.
  

Nell'esempio qui sotto, il campo immagine è stato impostato come un cursore di immagini. I limiti del numero di oggetti sono impostati in modo cheun minimodi 3 campi immagine appaiano nel modulo, fino a un massimo di 5 campi immagine. Un utente vedrà apparire 4 campiimmaginenel modulo per impostazione predefinita, e potrà scegliere di aggiungere un ulteriore campo immagine o rimuovere un campo immagine esistente.

Le opzioni del ripetitore saranno automaticamente abilitate una volta che hai modificato una delle opzioni. Per disabilitare le opzioni del ripetitore, clicca sull'interruttorea destra di RepeaterOptions.

Campi del modulo di gruppo

Dopo aver creato i campi, puoi raggruppare fino a 4 di essi per mantenere i tuoi campi organizzati per rilevanza. I gruppi di campi possono essere usati per costruire una logica di campo personalizzata. Per saperne di più sui gruppi di campi del modulo.

Per raggruppare i campi del modulo:

• Fai clic su Gruppo nella barra laterale destra dell'editor di moduli.
  
  
• Seleziona i campiche vuoi raggruppare.
• Fare clic suCrea gruppo.

Copia e incolla i tuoi frammenti di campo