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.

Stile del tuo modulo incorporato su pagine esterne

Ultimo aggiornamento: giugno 28, 2023

Disponibile con uno qualsiasi dei seguenti abbonamenti, tranne dove indicato:

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, vai a 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, vai a 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, vai a 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.
L'articolo è stato utile?
Questo modulo viene utilizzato solo per il feedback della documentazione. Scopri come ottenere assistenza con HubSpot.