Teeman koodin muokkaaminen

Voit tehdä yksityiskohtaisia muutoksia verkkokauppaasi muokkaamalla teeman koodia. Suurin osa teeman muodostavista tiedostoista sisältää Shopifyn Liquid-mallinnuskieltä. Teematiedostot sisältävät myös HTML-, CSS-, JSON- ja JavaScript-elementtejä. Muokkaa teeman koodia vain, jos HTML ja CSS ovat sinulle tuttuja ja sinulla on perustiedot Liquidista.

Ennen kuin mukautat teemaa

Voit valmistautua teeman mukauttamiseen suorittamalla seuraavat suositellut tehtävät:

Teeman koodin muokkaaminen

Voit muokata teemasi koodia.

Vaiheet:

Tietokone
  1. Siirry Shopify Adminissa kohtaan Verkkosivu > Teemat.
  2. Klikkaa ... > Muokkaa koodia.
iPhone
  1. Napauta Shopify-sovelluksessa -painiketta.
  2. Napauta myyntikanavat -osiossa Verkkokauppa.
  3. Napauta Hallitse teemoja.
  4. Klikkaa ... > Muokkaa koodia.
Android
  1. Napauta Shopify-sovelluksessa -painiketta.
  2. Napauta myyntikanavat -osiossa Verkkokauppa.
  3. Napauta Hallitse teemoja.
  4. Klikkaa ... > Muokkaa koodia.

Koodieditorissa teematiedostojen hakemisto näkyy vasemmalla ja tiedostojen tarkastelu- ja muokkausosio oikealla.

Kun napsautat vasemmalla olevassa hakemistossa olevaa tiedostoa, se avautuu koodieditoriin. Voit avata ja muokata useita tiedostoja samanaikaisesti. Muokattujen tiedostojen nimen vieressä näkyy piste:

Teematiedostojen hakemisto, jossa näkyy piste muokattujen tiedostojen vieressä

Näin voit seurata, mihin olet tehnyt muutoksia.

Siirtyminen takaisin teemasi vanhempaan versioon

Jos olet muuttanut teematiedostoja ja haluat palauttaa ne, voit palauttaa .liquid- ja .json-tiedostot yksitellen kellonaikaan ja päivämäärään ennen muutosten tekemistä.

Voit palauttaa teematiedostoja kaikissa muissa hakemiston kansioissa paitsi assets-kansiossa. Assets-kansion tiedostoista, mukaan lukien theme.scss.liquid- ja theme.js-tiedostot, ei tallenneta aiempia muokattuja versioita. Jos teet muutoksia assets-kansiossa oleviin tiedostoihin, sinun on ehkä otettava yhteyttä teematukeen tai palkattava Shopify Partner -kumppani.

Vaiheet:

Tietokone
  1. Siirry Shopify Adminissa kohtaan Verkkosivu > Teemat.
  2. Etsi teema, jota haluat muokata, avaa toimintovalikko klikkaamalla ...-painiketta ja klikkaa sitten Muokkaa koodia.
  3. Klikkaa teematiedostojen hakemistossa jotain äskettäin muokkaamaasi .liquid- tai .json-tiedostoa.
  4. Klikkaa koodieditorin yläosasta Nykyinen.
  5. Valitse vanhempi versio pudotusvalikosta. Päivämääräleiman valitseminen palauttaa koodin kyseiseen tallennettuun versioon.
  6. Valinnainen: Klikkaa Esikatsele kauppaa varmistaaksesi, että virhe on korjattu.
  7. Jos haluat palata vanhempaan versioon, klikkaa Tallenna.
iPhone
  1. Napauta Shopify-sovelluksessa -painiketta.
  2. Napauta myyntikanavat -osiossa Verkkokauppa.
  3. Napauta Hallinnoi kaikkia teemoja.
  4. Etsi teema, jota haluat muokata, avaa toimintovalikko napauttamalla -painiketta ja napauta sitten Muokkaa koodia.
  5. Napauta teematiedostojen hakemistossa jotain äskettäin muokkaamaasi .liquid- tai .json-tiedostoa.
  6. Napauta koodieditorin yläosasta Nykyinen.
  7. Valitse vanhempi versio pudotusvalikosta. Päivämääräleiman valitseminen palauttaa koodin kyseiseen tallennettuun versioon.
  8. Valinnainen: napauta Esikatsele kauppaa ja tarkista, että virhe on korjattu.
  9. Jos haluat palata vanhempaan versioon, napauta Tallenna.
Android
  1. Napauta Shopify-sovelluksessa -painiketta.
  2. Napauta myyntikanavat -osiossa Verkkokauppa.
  3. Napauta Hallitse teemoja.
  4. Etsi teema, jota haluat muokata, avaa toimintovalikko napauttamalla ...-painiketta ja napauta sitten Muokkaa koodia.
  5. Napauta teematiedostojen hakemistossa jotain äskettäin muokkaamaasi .liquid- tai .json-tiedostoa.
  6. Napauta koodieditorin yläosasta Nykyinen.
  7. Valitse vanhempi versio pudotusvalikosta. Päivämääräleiman valitseminen palauttaa koodin kyseiseen tallennettuun versioon.
  8. Valinnainen: napauta Esikatsele kauppaa ja tarkista, että virhe on korjattu.
  9. Jos haluat palata vanhempaan versioon, napauta Tallenna.

Theme Check

Koodieditorin Theme Check -työkalu on ominaisuus, joka auttaa ehkäisemään virheitä antamalla palautetta välittömästi koodin kirjoittamisen aikana sen sijaan, että se löytäisi koodissa olevat virheet vasta julkaistusta teemasta.

Koodieditorin Theme Check -työkalu voi tunnistaa seuraavat virheet muokatussa koodissa:

  • Jäsennyksen estävät komentosarjat, jotka voivat hidastaa myyntipaikkaa:
  • Käännöstiedostojen väliset epäjohdonmukaisuudet, kuten puuttuvat käännösavaimet tai käännökset, jotka eivät täsmää paikkatiedostossa
  • Puuttuvat mallit

Virheet merkitään koodin alla olevalla punaisella viivalla. Jos haluat tarkastella virhettä, vie hiiren osoitin kirkkaan viivan päälle.

Esimerkki Theme Check -työkalun havaitsemasta koodivirheestä

Teeman koodin mukauttamista koskevat tutoriaalit

Teeman koodin mukauttamista koskevien tutoriaalien avulla voit tehdä muutoksia verkkokauppaasi. Tutoriaalit on järjestetty muokattavan sivutyypin tai ominaisuuden mukaan.

Teeman mukauttamisen tutoriaalit jaetaan teema-arkkitehtuurin käyttämien versioiden mukaan. Opettele tunnistamaan teema-arkkitehtuurin version.

Hanki apua mukautuksia varten

Jos tarvitset tukea teeman muuttamiseen, voit ottaa yhteyttä teeman kehittäjään.

Voit myös katsoa muita tukivaihtoehtoja teemojen mukautusta varten kohdasta Teemojen tuen lisävaihtoehtoja.

Etkö löydä hakemaasi vastausta? Autamme mielellämme.