Salta al contenuto
Nota bene: la traduzione in italiano 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.
Forms

Stile del tuo modulo incorporato su pagine esterne

Ultimo aggiornamento: gennaio 27, 2021

Si applica a:

Tutti i prodotti e i piani

Dai uno stile al tuo modulo incorporato HubSpot nelle tue pagine esterne in due modi: nell'editor dei moduli o con i CSS nel tuo foglio di stile esterno.


Nell'editor dei moduli

Tema

Se vuoi stilizzare i tuoi moduli senza scrivere alcun codice personalizzato, puoi applicare temi preimpostati al tuo modulo incorporato o alla pagina del modulo indipendente. I temi aggiungono più opzioni di personalizzazione ai tuoi moduli, oltre a qualsiasi impostazione globale dello stile del modulo.

  • Nel tuo account HubSpot, naviga su Marketing > Acquisizione lead > Form.
  • Fare clic sul nome di un modulo.
  • Nell'editor del modulo, clicca sulla scheda Stile e anteprima.
  • Nel pannello di sinistra, sezione Theme, deseleziona la casella di controllo Keepold theme .

Nota: deselezionando la casella Mantieni il vecchio tema , verrà rimosso lo stile predefinito precedente HubSpot applicato a questo modulo. Qualsiasi CSS o JavaScript personalizzato che hai aggiunto al modulo non funzionerà più. Questa casella di controllo è disponibile solo per i moduli precedenti e non sarà disponibile in nessun nuovo modulo creato nel tuo account.

  • Seleziona uno dei quattro temi.

Stile(solo Marketing HubStarter, Professional, Enterprise o Legacy Marketing Hub Basic)

Oltre ai temi, puoi dare uno stile ai moduli incorporati ad un livello più granulare.

  • Nel tuo account HubSpot, naviga su Marketing > Acquisizione lead > Form.
  • Fare clic sulnome di un modulo.
  • Nell'editor dei moduli, clicca sullascheda Style & Preview .
  • Nel pannello di sinistra, clicca sulla sezione > Style per espanderla. Qui puoi dare uno stile alla larghezza dei campi del modulo, alla famiglia dei caratteri, alle dimensioni dei caratteri, ai colori dei caratteri e al pulsante del modulo.

Questi stili sono impostati su una base individuale del modulo e sovrascrivono le impostazioni globali dello stile del modulo.

Per favore nota: i temi e gli stili impostati nell'editor dei moduli si applicano solo ai moduli incorporati o alle pagine dei moduli indipendenti. I moduli sulle tue pagine HubSpot possono essere stilizzati solo con le opzioni di stile del modulo modulo nell'editor dei contenuti.

Con i CSS nel tuo foglio di stile esterno (Marketing Hub Professional, Enterprise, o Legacy Marketing Hub solo Basic )

  • Nel tuo account HubSpot, naviga su Marketing > Acquisizione lead > Form.
  • Fai clic sul nome del modulo.
  • Nell'editor del modulo, clicca sulla scheda Stile e anteprima.
  • Clicca per attivare l'interruttore Imposta come modulo HTML grezzo . Il modulo verrà reso come un elemento HTML grezzo sulla tua pagina esterna invece che all'interno di un iframe, e qualsiasi stile predefinito HubSpot applicato al modulo verrà rimosso.

options-unstyled-form

  • In alto a destra, clicca su Share.
  • Nella finestra di dialogo, fai clic su Copy per copiare il codice embed del modulo.
  • Aggiungi il codice di incorporamento del modulo alla tua pagina esterna. Se hai già incorporato il tuo modulo, devi sostituire il codice incorporato esistente con questa nuova versione senza stile.
  • Dopo aver incorporato il tuo modulo, puoi stilizzare il modulo nel tuo foglio di stile esterno con i CSS.
  • In alternativa, è possibile modificare il codice incorporato del modulo per fare ulteriori personalizzazioni del modulo. Poiché i moduli HubSpot sono costruiti con JavaScript, non HTML,la personalizzazione del codice incorporato del modulo richiede l'aiuto di uno sviluppatore che sappia lavorare con JavaScript.
Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.