Siirry sisältöön
Huomaa: Tämän artikkelin käännös on tarkoitettu vain tiedoksi. Käännös on luotu automaattisesti käännösohjelmiston avulla, eikä sitä ole välttämättä tarkistettu. Näin ollen tämän artikkelin englanninkielistä versiota on pidettävä hallitsevana versiona, joka sisältää uusimmat tiedot. Voit tutustua siihen täällä.

Muokkaa painikkeen CTA-kokoa

Päivitetty viimeksi: toukokuuta 22, 2023

Saatavilla minkä tahansa seuraavan Tilauksen kanssa, paitsi jos toisin mainitaan:

Marketing Hub   Professional , Enterprise
Content Hub   Professional , Enterprise
Vanhentunut Marketing Hub Basic-versio

Säädä painikkeen CTA:n kokoa käyttämällä sisäänrakennettuja kokovaihtoehtoja ja mukautettua CSS:ää. Kun lataat kuvaa kuva-CTA:ta varten, voit ottaa huomioon verkkokalvo-optimoinnin

.

Jos haluat mukauttaa painikkeen CTA:ta vielä enemmän, opettele lisäämään mukautettuja tyylejä CTA:lle CSS:n avulla. Jos lisäät painikkeen CTA:n sähköpostiin tai malliin, opettele keskittämään CTA:si

.

Muokkaa CTA-kokoasi

Voit säätää painikkeen CTA:n kokoa manuaalisesti tai käyttää mukautettua CSS:ää täyttämään automaattisesti painikkeen CTA:n säiliön tai moduulin leveyden. Jos upotat kuva-CTA: n muulle kuin HubSpot-sivustolle , sinun on ehkä käytettävä ylimääräisiä CSS-ilmoituksia (kuten width: 100 %;) tyylitaulukkosi sisällä, jotta kuva-CTA:sta tulee responsiivinen.

Painikkeen CTA-koon
muokkaaminen:
  • Siirry HubSpot-tililläsi kohtaan Markkinointi > Lead Capture > Painike CTA:t.
  • Vie hiiren kursori painikkeen CTA:n päälle ja valitse Toiminnot > Muokkaa.
  • Valitse liukupaneelissa Lisäasetukset.
  • Voit muuttaa mukautetun painikkeen CTA:n kokoa manuaalisesti:
    • Poista valintaruudun Sovita tekstiin valintaruutu. Tämä poistaa sovelletun automaattisen koonmuutoksen.
    • Syötä painikkeen pehmuste-osioon painikkeen leveys- ja korkeus-kenttien kokoarvot.
    • Napsauta Seuraava >.
    • Napsauta Tallenna. Napsauta sitten Finish (Valmis).
  • Jos haluat, että mukautettu painike CTA täyttää säiliön tai moduulin koko leveyden:
    • Poista Size automatically (Koko automaattisesti ) -valintaruudun valinta.
    • KirjoitaCustom CSS (Mukautettu CSS )-kenttään mukautettu CSS.
    • Aseta leveydeksi width: 100 %;
    • Napsauta Seuraava >.
    • Napsauta Tallenna. Napsauta sitten Finish (Valmis).

Mitä on verkkokalvooptimointi?

Retina-optimointi tekee painikkeesi CTA:n kuvasta terävämmän, kun sitä katsotaan sivustosi sivuilla ja sähköposteissa, jos vastaanottajasi katsovat CTA:ta Apple Mailin ja iOS-mailin nykyaikaisissa versioissa; Outlook tai webmail-palvelut, kuten Gmail, eivät tue tätä.

Retina-optimointia tuetaan, kun lataat kuvan, jonka koko on vähintään kaksi kertaa suurempi kuin painikkeen CTA:n tarvitsema koko, samalla tavalla kuin retina-tuki toimii kaikkien internetin kuvien kohdalla. Huomaa myös seuraavat seikat:

  • Jos luot CTA-painikkeen, jonka koko on 400 x 100 pikseliä, ladatun kuvan on oltava 800 x 200 pikseliä, jotta se tukee @2x pikselitiheyden näyttöä.
  • CTA:t tukevat jopa 4x-version lisäämistä. Jos esimerkiksi luot CTA:n, jonka koko on 400 x 100 pikseliä, voit ladata kuvan, jonka koko on 1600 x 400 pikseliä.
  • CTA renderöidään automaattisesti verkkosivustollasi srcset-attribuutilla, joka palvelee 1x-, 2x-, 3x- ja 4x-versiota, jos se on käytettävissä.
  • Jos kuva ladataan CTA:n renderöitävän kuvan kokoisena, siinä ei ole retina-tukea. Jos esimerkiksi 400 x 100 px 100 px kokoinen kuva ladataan 400 x 100 px kokoista CTA-taulukkoa varten
Oliko tästä artikkelista apua?
Tätä lomaketta käytetään vain dokumentaation palautteeseen. Lue, miten saat apua HubSpotin kanssa.