Lisää verkkokauppaan mukautettua CSS:ää tyylittelyyn, joka ei onnistu visuaalisilla asetuksilla.
Teemaeditori > Mukautettu CSS
Mukautetun CSS:n paneelissa on koodieditori, jolla lisäät verkkokauppaan vapaavalintaisia CSS-sääntöjä. Käytä sitä kaikkeen, mitä visuaaliset teema-asetukset eivät kata — mukautettuihin hover-efekteihin, yksittäisten elementtien piilottamiseen tai responsiivisen käyttäytymisen hienosäätöön.
Napsauta editorin yläpalkissa Tallenna, jolloin muutokset siirtyvät julkiseen verkkokauppaan.
CSS lisätään kaikkien teematyylien jälkeen, joten omat sääntösi menevät edelle. Editori on aluksi lukittu vahinkomuokkausten estämiseksi — avaa lukitus aina, kun haluat tehdä muutoksia.
Mukautettu CSS puhdistetaan palvelimella ennen tallennusta. @import- ja @charset-säännöt poistetaan, ja jokainen url(...)-lauseke korvataan arvolla none. Tämä tarkoittaa, että taustakuvat, @font-face-säännöllä ladatut verkkofontit ja content: url(...) -säännöt hajoavat huomaamatta. Käytä kuva- ja fonttiaineistoihin teema-asetuksia (esimerkiksi Typografia) tai lataa ne mukautetuilla skripteillä.
Jokainen teema-asetus on saatavilla CSS-muuttujana. Viittaa niihin mukautetussa CSS:ssä, jotta tyyli pysyy yhtenäisenä muun teeman kanssa — jos vaihdat myöhemmin värin Värit-paneelissa, mukautettu CSS ottaa muutoksen käyttöön automaattisesti.
Koko luettelo CSS-muuttujista löytyy Teematyyli-paneelista.
Mukautettu CSS vaikuttaa verkkokaupan jokaiseen sivuun, ja tallennetut muutokset tulevat voimaan välittömästi. Testaa muutokset useilla sivuilla ja eri näyttökoilla ennen tallennusta.
