Creare una pagina con un modello iniziale

Puoi usare un modello iniziale per costruire un semplice sito web o una pagina di destinazione. Questo articolo spiega come creare una nuova pagina, personalizzare il design della pagina e pubblicare la pagina utilizzando un modello iniziale.

Nota bene: i modelli di partenza non supportano i contenuti intelligenti, i moduli personalizzati, la personalizzazione, l'accesso al codice sorgente nei moduli rich text, le pagine protette da password, o opzioni avanzate come lo scambio di template e l'accesso all'HTML dell'intestazione.

Creare una pagina con un modello iniziale

Per creare una nuova pagina di destinazione con un modello iniziale:

• Nel tuo account HubSpot, vaialle tue pagine di destinazione o alle pagine del sito web.
• In alto a destra, clicca sul menu a tendina Createe seleziona Websitepage o Landing page.
• Nel menu laterale sinistro della schermata di selezione dei modelli, clicca su Tutti i tuoi modelli.
• Per visualizzare i tuoi modelli starter disponibili, clicca sul menu a tendina Filter by sourcee seleziona Starter.

• Passa il mouse su un modello, poi clicca su Anteprima in alto a destra.
• Per creare una pagina con questo modello, fare clic su Usa modello in alto a destra.
• Nella finestra di dialogo, clicca suContinua.
• Inserisci un nome interno per latua pagina, poi clicca su Createpage.

Modifica il contenuto della tua pagina

I modelli di avvio contengono blocchi di contenuto del sito web chiamati moduli. Puoi disporre questi moduli in righe orizzontali o colonne verticali.

Puoi raggruppare righe e colonne in sezioni di elementi. Raggruppando gli elementi, puoi applicare stili di sfondo a un'intera area della tua pagina. Puoi anche trascinare e rilasciare questi elementi per riorganizzare il layout della tua pagina. Per saperne di più sullamodifica del contenuto della pagina in un'area di trascinamento.

Per personalizzare l'aspetto della tua pagina sui dispositivi mobili, clicca sull'icona mobile ediEditfor mobile nell' editor della barra laterale.

Personalizzare i caratteri, i colori e i pulsanti

Per personalizzare gli stili predefiniti per il tuo modello di partenza, clicca sulla scheda Design nell'editor della barra laterale. Puoi anche personalizzare il colore di sfondo o l'immagine per una specifica riga, colonna o sezione

Tipografia

• Corpo del testo: personalizza il carattere, la dimensione del carattere e i colori del carattere per il corpo principale della tua pagina.
  • Clicca sul menu a discesa Testo corpo e seleziona un font

• • Fai clic sui tasti freccia
  per regolare la dimensione del carattere.
  • Clicca sul selezionatore di colori e seleziona un colore per il tuo font. Per impostare un colore personalizzato, clicca sulla scheda Advanced e inserisci un valore esadecimale
.
• Intestazioni: personalizza il carattere e il colore del testo nei moduli con un tag di intestazione.
  • Clicca sul menu a tendina Headings e seleziona un font
  .
  • Per impostare un colore personalizzato, clicca sulla scheda Advanced e inserisci un valore
esadecimale.
• Testo del link: personalizza i caratteri e i colori applicati ai link della tua pagina.
  • Clicca sul menu a discesa Link text e seleziona un carattere
  .
  • Clicca sul selezionatore di colori e seleziona un colore per il collegamento. Per impostare un colore personalizzato, clicca sulla scheda Avanzate e inserisci un valore
  esadecimale.
  • Fai clic sul menu a discesa e seleziona uno stile

• • Personalizza il colore e la trasparenza dei tuoi link quando ci passano sopra, vengono cliccati e sono già stati visitati:
    
    • Linkhover color: clicca sul selezionatore di colori e seleziona un colore per quando un visitatore passa sopra il link. Per cambiare la trasparenza del colore, inserisci un valore percentuale
    
    

• • • Colore attivo del link: clicca sul selezionatore di colori e seleziona un colore per quando il link viene cliccato. Per cambiare la trasparenza del colore, inserisci un valore percentuale

• • • Colore del link visitato: clicca sul selezionatore di colori e seleziona un colore di link per quando il link è già stato cliccato da un visitatore. Per cambiare la trasparenza del colore, inserisci un valore percentuale

Moduli e pulsanti

• Colore di sfondo dei pulsanti: personalizza il colore applicato allo sfondo dei tuoi pulsanti.
  • Inserisci un valore esadecimale o clicca sul selezionatore di colori e seleziona un colore
  .
  • Per impostare la trasparenza del colore di sfondo dei tuoi pulsanti, inserisci un valore percentuale nel
campo.
• Button text color: personalizza il colore applicato al testo dei pulsanti sulla tua pagina.
  • Inserisci un valore esadecimale o clicca sul selezionatore di colori
  per selezionare il colore del testo.
  • Per impostare la trasparenza del colore di sfondo dei pulsanti, inserisci un valore percentuale nel
campo.
• Raggio d'angolo dei pulsanti: personalizza il modo in cui i pulsanti della tua pagina appaiono rotondi o quadrati.
  • Inserisci un valorenel campoo clicca e trascina il cursore in unanuova posizione.
  • Un valore più alto significa che i pulsanti sulla tua pagina avranno bordi più rotondi, mentre un valore pari a zero significa che i tuoi pulsanti saranno rettangolari.

Nota: HubSpot raccomanda di mantenere coerenti colori, caratteri e stili in base alle impostazioni della scheda Design. Puoi sovrascrivere gli stili predefiniti per un singolo modulo nella scheda Opzioni

Anteprima e pubblicazione della pagina

Prima che la tua pagina venga pubblicata, clicca su Anteprima in alto a destra per testare come la tua pagina apparirà sui dispositivi desktop e mobili.Una volta che sei soddisfatto dell'anteprima della tua pagina, clicca su Pubblica in alto a destra.