Päivitetty viimeksi: tammikuuta 20, 2023
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 upotatkuva-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-koonmuokkaaminen:
- 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