Ultimo aggiornamento: marzo 8, 2023
Se si utilizzano modelli di layout creati nello strumento Design Manager, è possibile centrare un'immagine, un pulsante CTA o un modulo logo sulla pagina, sul blog o sull'e-mail, aggiungendo uno stile in linea al modello.
Se si utilizza un modello che include un'area di trascinamento, è possibile centrare l'allineamento dei moduli nell'editor dei contenuti. È anche possibile centrare i moduli nell'editor di pagina utilizzando i distanziatori orizzontali.
Centrare un'immagine, un pulsante CTA o un logo con lo stile in linea
Attenzione:
- Questo metodo richiede una conoscenza di base dell'HTML.
- Se la pagina o il modello hanno un foglio di stile allegato o uno stile aggiuntivo, è possibile che il CSS esistente influenzi l'immagine, la CTA o il logo. HubSpot consiglia di collaborare con un designer per identificare l'origine dello stile e apportare le modifiche necessarie per centrare le risorse.
Per centrare un'immagine, un pulsante CTA o un logo in un modello di email o di pagina:
- Nel vostro account HubSpot, andate sulle vostre landing page, sulla pagina del sito web, sul post del blog o sulla dashboard delle e-mail.
- Passare il mouse sulla pagina, sul post del blog o sull'e-mail, quindi fare clic su Modifica.
- Nella parte superiore dell'editor di contenuti, fate clic sulla scheda Impostazioni.
- Nella scheda Impostazioni, scorrere verso il basso e fare clic suOpzioni avanzate.
- Nella sezione Modello, fare clic suModifica questo modello. Questa azione aprirà il modello nell'editor di layout in una nuova scheda o finestra.
- All'interno del modello di layout, fare clic sul logo, sull' invito all'azione o sul modulo immagine per selezionarlo nell'ispettore.
- Nel campo Stile in linea , aggiungere il CSS text-align: center;
- In alto a destra, fare clic su Pubblica modifiche per applicare le modifiche a questo modello.
- Quindi, tornare all'editor di contenuti e aggiornare il browser web per visualizzare le modifiche apportate al modello. Il contenuto di questo modulo sarà ora centrato nella pagina, nel blog o nell'e-mail.
Centrare un'immagine, un pulsante CTA o un logo dalle opzioni di stile del modulo
Se si utilizza un modello con un'area di trascinamento, in alcuni moduli o sezioni è possibile scegliere di impostare direttamente l'allineamento. Si noti tuttavia che questa opzione di stile potrebbe non essere disponibile in tutti i modelli o moduli.
- Per centrare i moduli della pagina:
- Nel vostro account HubSpot, navigate verso le vostre landing page, la pagina del sito web o il post del blog.
- Passare il mouse sulla pagina o sul post del blog, quindi fare clic su Modifica.
- Nell'editor della pagina, fate clic sul modulo che desiderate centrare.
- Nel pannello di sinistra, fare clic sulla scheda Stili .
- Fare clic per espandere la sezione Allineamento e spaziatura.
- In Allineamento, selezionare l'allineamento Centro .
- Per centrare i moduli e-mail:
- Nel vostro account HubSpot, andate suMarketing > Email.
- Passare il mouse sulla pagina o sul post del blog, quindi fare clic su Modifica.
- Fate clic sul modulo che desiderate centrare.
- Nel pannello di sinistra, fate clic sul menu a discesa Allineamento e selezionate Centra.
Centrare un'immagine, un pulsante CTA o un logo utilizzando i distanziatori orizzontali
Se il modulo che si sta utilizzando non dispone di opzioni di allineamento, dall'editor di pagina è possibile aggiungere distanziatori orizzontali alla pagina per centrare i moduli.
Nota bene: il modulo distanziatore orizzontale non è disponibile con i modelli Starter.
Per centrare il modulo utilizzando un distanziatore orizzontale:
- Nel vostro account HubSpot, navigate nelle vostre landing page, pagine web o blog post.
- Nella barra di ricerca, cercate il distanziatore orizzontale.
- Fate clic e trascinate i distanziatori orizzontali su ciascun lato del modulo che volete centrare. Quindi, regolare la larghezza del distanziatore per centrare l'elemento.
