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.
CTAs

Modifica delle dimensioni di un pulsante CTA

Ultimo aggiornamento: gennaio 20, 2023

Si applica a:

Marketing Hub Professional, Enterprise
CMS Hub Professional, Enterprise
Legacy Marketing Hub Basic

Regolare le dimensioni del pulsante CTA utilizzando le opzioni di dimensionamento integrate e i CSS personalizzati. Quando si carica l'immagine per una CTA immagine, si può tenere conto dell'ottimizzazione retina

.

Per personalizzare ulteriormente la CTA del pulsante, imparare ad aggiungere stili personalizzati alla CTA con i CSS. Se state aggiungendo la CTA a un'e-mail o a un modello, imparate come centrare la CTA.

Modificare le dimensioni della CTA

È possibile regolare manualmente le dimensioni del pulsante CTA o utilizzare CSS personalizzati per riempire automaticamente la larghezza del contenitore o del modulo del pulsante CTA. Se si incorpora un'immagine CTA su un sito non HubSpot, potrebbe essere necessario applicare dichiarazioni CSS aggiuntive (come width: 100%;) nel foglio di stile per rendere la CTA reattiva.

Per
modificare le dimensioni del pulsante CTA:
  • Nell'account HubSpot, navigare in Marketing > Lead Capture > Pulsante CTA.
  • Passare il mouse su un pulsante CTA e fare clic su Azioni > Modifica.
  • Nel pannello a scorrimento, fare clic su Opzioni avanzate.
  • Per ridimensionare manualmente il pulsante CTA personalizzato:
    • Deselezionare la casella di controllo Adatta al testo. Questo rimuoverà il ridimensionamento automatico applicato.
    • Nella sezione Imbottitura pulsante, inserire i valori delle dimensioni per i campi Larghezza pulsante e Altezza pulsante.
    • Fare clic su Avanti >.
    • Fare clic su Salva. Quindi, fare clic su Fine.
  • Per far sì che il pulsante CTA personalizzato riempia l'intera larghezza del suo contenitore o modulo:
    • Deselezionare la casella di controllo Dimensione automatica .
    • Nel campo CSS personalizzato, inserireil CSS personalizzato.
    • Impostare la larghezza su width: 100%;
    • Fare clic su Avanti >.
    • Fare clic su Salva. Quindi, fare clic su Fine.

Che cos'è l'ottimizzazione retina?

L'ottimizzazione retina rende l'immagine del pulsante CTA più nitida quando viene visualizzata sulle pagine del sito e nelle e-mail se i destinatari visualizzano la CTA nelle versioni moderne di Apple Mail e iOS; non è supportata da Outlook o dai servizi di webmail come Gmail.

L'ottimizzazione retina è supportata quando si carica un'immagine di dimensioni almeno due volte superiori a quelle necessarie per la CTA del pulsante, analogamente a come il supporto retina funziona per tutte le immagini su Internet. Si noti anche quanto segue:

  • Se si sta creando una CTA di 400px per 100px, l'immagine caricata dovrà essere di 800px per 200px per supportare una visualizzazione con densità di pixel @2x.
  • Le CTA supportano l'aggiunta di una versione 4x. Ad esempio, se si sta creando una CTA di 400px per 100px, è possibile caricare un'immagine di 1600px per 400px.
  • La CTA sarà automaticamente resa sul sito web con un attributo srcset che servirà le versioni 1x, 2x, 3x e 4x, se disponibili.
  • Se l'immagine viene caricata alla dimensione in cui verrà resa la CTA, non avrà il supporto retina. Ad esempio, se viene caricata un'immagine di 400px per 100px per una CTA di 400px per 100px.
Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.