Ultimo aggiornamento: aprile 15, 2021
Impara come impostare e personalizzare il tuo modello drag and drop esistente, e lavorare con moduli, gruppi e colonne come elementi costitutivi del tuo modello.
Struttura il tuo modello
Utilizzando l'editor di layout nel design manager, puoi costruire rapidamente il tuo layout di contenuto senza dover scrivere alcun HTML.
- Nel tuo account HubSpot, naviga su Marketing > File e Modelli > Strumenti di progettazione.
- Nel finder, clicca su un modello per modificarlo.
Aggiungere e trascinare i moduli
Per aggiungere un modulo a un layout, fai clic su + Add nella parte superiore dell'ispettore del layout. Cerca o seleziona unmodulo , quindi trascinalo nella posizione in cui vuoi che il modulo sia reso nel layout. Trascinando i moduli sopra altri moduli si creano colonne o si raggruppano i moduli.
Cambiare la larghezza delle colonne
Per cambiare la larghezza di una colonna, passate tra i moduli e cliccate e trascinate orizzontalmente.
Moduli di gruppo
I gruppi di moduli sono unità di moduli che compongono diverse sezioni di una pagina.
Per raggruppare due moduli, clicca sul primo modulo, poi tieni premuto il tasto Control/Command e seleziona il secondo modulo. Ripetete questo passo se state raggruppando più di due moduli. Poi, clicca sull'icona del gruppo nell'ispettore dei moduli.
Attenzione: i gruppi di moduli non possono attraversare un separatore di sezione o contenere un gruppo di moduli parzialmente selezionato.
Dividere i moduli orizzontalmente
Dividere un modulo rompe il modulo a metà, creando due moduli. Per dividere un modulo, cliccate sul modulo, poi cliccate sull'icona del modulo diviso nell'ispettore moduli. In alternativa, è possibile fare clic con il tasto destro del mouse sul modulo nel layout e selezionare Dividi modulo.
Moduli centrali
Con i distanziatori orizzontali, puoi centrare moduli e gruppi sulla pagina, o aggiungere spazio vuoto su entrambi i lati di essi. Per aggiungere un distanziatore orizzontale, fai clic su + Add nella parte superiore dell'ispettore del layout. Individua Horizontal Spacer, quindi trascinalo e rilascialo nel modello.
Per cambiare la dimensione di un distanziatore orizzontale, cambia la larghezza della colonna che lo separa dagli altri moduli. Per centrare un modulo o un gruppo, aggiungi distanziatori orizzontali su ogni lato.
Aggiungere una colonna flessibile
Le colonne flessibili sono progettate per rendere la gestione dei contenuti a livello di pagina più facile per i creatori di contenuti. Quando una colonna flessibile viene aggiunta a un modello di pagina HubSpot, gli utenti avranno la possibilità di aggiungere, rimuovere e riordinare i moduli all'interno dell'editor della singola pagina. Questa caratteristica permette ai designer di creare un minor numero di modelli, pur consentendo ai marketer la flessibilità di personalizzare ogni pagina per soddisfare le loro esigenze.
Per aggiungere una colonna flessibile, fare clic su + Add nella parte superiore dell'ispettore del layout. Individua Colonna flessibile, poi trascinala nel modello.
Si prega di notare: colonne flessibili possono essere aggiunte solo ai modelli di pagina, e non possono essere aggiunte ai modelli di email o blog.
Personalizza il tuo modello
Una volta che hai strutturato il layout generale del tuo modello, puoi scambiare i moduli e fare altre personalizzazioni del modello.
Modifica delle opzioni del modulo
Puoi modificare le opzioni di un modulo cliccando sulmodulo nell'editor di layout. Nell'ispettore del modulo sulla destra, vedrai le opzioni modificabili del modulo. Queste opzioni generalmente includono lo stile, il contenuto predefinito e le opzioni dell'editor, e possono variare a seconda del tipo specifico di modulo. Per saperne di più sulla modifica del CSS del modulo e del contenuto e delle impostazioni predefinite.
Modulo di scambio
Dopo aver aggiunto un modulo al tuo template, puoi scegliere di sostituirlo con un altro modulo. Fai clic con il tasto destro del mouse sul modulo nell'editor di layout, quindi fai clic su Swap module. Nel menu a discesa che appare, seleziona il modulo con cui sostituire il modulo originale.
Convertire in modulo globale
Puoi convertire un modulo nel tuo template in un modulo globale, che può essere usato in più template. Questo è utile quando hai stilizzato il modulo in un certo modo, e/o hai contenuti predefiniti nel modulo che vorresti riutilizzare in altri template.
- Fai clic sul modulo nell'editor di layout.
- Nell'ispettore dei moduli, cliccate sul menu a discesa More e selezionate Convert to global module.
- Nella finestra di dialogo, inserite il nome del modulo globale, poi cliccate su Create.
Cancellare il modulo
Per eliminare un modulo, fai clic sul modulo nell'editor di layout, quindi fai clic sull'icona del cestino nell'ispettore dei moduli. In alternativa, è possibile fare clic con il tasto destro del mouse sul modulo e selezionare Elimina modulo.
Gestisci il tuo modello nel finder
Oltre alle opzioni del tuo modulo, ci sono diverse azioni che puoi intraprendere in modo specifico per il tuo modello.
- In alto a destra del modello, cliccate sull'icona della .
- Fare clic con il tasto destro del mouse sulnome del modello. Nel menu a discesa, è possibile personalizzare le seguenti opzioni:
- Copia su portali: copia il modello su un altro portale dove sei anche utente. I modelli acquistati dal Marketplace non potranno essere copiati su altri portali.
- Clona modello: questo crea un esatto duplicato del tuo modello, ed è utile quando vuoi creare una variazione di un modello esistente.
- Clone to HTML: questo crea una versione HTML separata del tuo template. Questo è utile se hai bisogno di più controllo sul tuo markup, o se vuoi imparare di più su come i template sono codificati.
- View template source: visualizza il codice sorgente HTML del template. A differenza dell'opzione Clone to HTML , questo non crea una versione HTML separata del tuo template.
- Rename template: modifica il nome interno del tuo template.
- Show dependents: visualizza tutte le pagine, emails, o blogs che attualmente usano il template.
- Show revision history: visualizza la storia di revisione del tuo template e scegli di riportare il tuo template ad una versione precedentemente pubblicata.
- Crea email/pagina: crea un'email o una landing page/pagina del sito web direttamente dal template.
- Elimina modello: elimina il modello. Una volta cancellato, un template rimarrà disponibile per 30 giorni, dopodiché sarà cancellato definitivamente. Per ripristinare il modello, sarà necessario contattare l'assistenza clienti.
- Queste opzioni sono accessibili anche daimenu a discesa File e Actions sopra.
