Säädä CTA:n (legacy) 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 CTA:ta vielä enemmän, opettele lisäämään mukautettuja tyylejä CTA:han (legacy) CSS:n avulla. Jos lisäät CTA:n sähköpostiin tai malliin, opettele keskittämään CTA (legacy).
Muokkaa CTA:n (legacy) kokoa
Voit säätää CTA:n kokoa manuaalisesti tai käyttää mukautettua CSS:ää täyttämään automaattisesti CTA:n säiliön tai moduulin leveyden. Jos
upotat i
mage CTA: n muuhun kuin HubSpot-sivustoon, sinun on ehkä sovellettava ylimääräisiä CSS-ilmoituksia (kuten width: 100 %;) tyylitaulukkosi sisällä, jotta kuva-CTA:sta tulee responsiivinen.
Painikkeen CTA:n koon muokkaaminen:
- Napsauta vasemmassa yläkulmassa olevaa pudotusvalikkoa ja valitse CTA:t (Legacy).
- Vie hiiren kursori CTA:n päälle ja valitse Toiminnot > Muokkaa.
- Valitse liukupaneelissa Lisäasetukset.
- Voit muuttaa mukautetun CTA:n kokoa manuaalisesti:
- Poista valintaruudun Fit to text (Sovita tekstiin ) valintaruudun valinta. Tämä poistaa sovelletun automaattisen koonmuutoksen.
- Kirjoita painikkeen pehmuste-osioon painikkeen leveys- ja korkeus-kenttien kokoarvot.
- Napsauta Seuraava >.
- Napsauta Tallenna. Napsauta sitten Finish (Valmis).
- Jos haluat mukautetun CTA-painikkeen täyttävän koko säiliön tai moduulin leveyden:
- Poista valintaruudun Size automatically (Koko automaattisesti ) valintaruudun valinta.
- Kirjoita mukautettu CSS-kenttään mukautettu CSS.
- Aseta leveydeksi width: 100 %;
- Napsauta Seuraava >.
- Napsauta Tallenna. Napsauta sitten Finish (Valmis).
Mikä on verkkokalvo-optimointi?
Retina-optimointi tekee CTA-kuvasta terävämmän sivustosi sivuilla ja sähköpostiviesteissä, 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 CTA:n tarvitsema koko, samaan tapaan kuin retina-tuki toimii kaikkien internetin kuvien kohdalla. Huomaa myös seuraavat seikat:
- Jos luot CTA:n, 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 pikseliä x 100 pikseliä kokoinen kuva ladataan 400 x 100 pikseliä kokoista CTA:ta varten.