Ohje
Kirjaudu sisään

Teeman asetusten mukauttaminen

Voit mukauttaa verkkokauppasi yleisiä asetuksia, kuten typografiaa, värejä, sosiaalisen median linkkejä ja ostoskorisivua, teemaeditorin sivupalkin valikon Teeman asetukset -osiossa. Teeman asetukset -osiossa tekemäsi muutokset koskevat koko verkkokauppaasi.

Myös osioilla ja lohkoilla on omat asetuksensa, joilla voit mukauttaa teemasi yksittäisiä osioita. Lue lisää osioista ja lohkoista.

Tällä sivulla

Voit lisätä yrityksesi logon verkkokauppaasi. Logosi näkyy seuraavissa paikoissa:

  • ylätunnisteessa kaikilla sivuilla
  • salasanasivullasi

Logon mukauttaminen

Logokuvien enimmäisleveys on 300 px.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Klikkaa Logo.

  5. Lisää Logo-alueella kuvasi tai käytä ilmaista kuvaa:

    • Jos haluat lisätä kuvasi, klikkaa Valitse kuva, ja lisää sitten uusi tai olemassa oleva kuva:
      • Jos haluat käyttää kuvaa, jonka olet jo ladannut Shopifyn ohjausnäkymään, valitse kuva ja klikkaa sitten Valmis.
      • Jos haluat käyttää kuvaa paikalliselta tietokoneeltasi, klikkaa Lisää kuvia. Valitse ja lisää kuva ja klikkaa sitten Valmis.
    • Jos haluat käyttää ilmaista kuvaa, klikkaa Selaa ilmaisia kuvia. Etsi kuva, valitse se klikkaamalla sitä ja klikkaa sitten Valitse.

  6. Valinnainen: Lisää vaihtoehtoinen teksti logokuvaasi:

    1. Klikkaa Logo-alueella Muokkaa.
    2. Anna Vaihtoehtoinen teksti -kenttään lyhyt kuvaus kuvasta.
    3. Klikkaa Tallenna.

  7. Valinnainen: Säädä Tietokoneen logon leveys -alueella logon leveyttä pikseleinä liukusäätimellä.

  8. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Logo.

  7. Lisää Logo-alueella kuvasi tai käytä ilmaista kuvaa:

    • Jos haluat lisätä kuvasi, napauta Valitse kuva, ja lisää sitten uusi tai olemassa oleva kuva:
      • Jos haluat käyttää kuvaa, jonka olet jo ladannut Shopifyn ohjausnäkymään, valitse kuva ja napauta sitten Valmis.
      • Jos haluat käyttää kuvaa paikalliselta laitteeltasi, napauta Lisää kuvia. Valitse ja lisää kuva paikalliselta laitteeltasi, valitse se napauttamalla ja napauta sitten Valmis.
    • Jos haluat käyttää ilmaista kuvaa, napauta Selaa ilmaisia kuvia. Etsi kuva, valitse se napauttamalla ja napauta sitten Valmis.

  8. Valinnainen: Lisää vaihtoehtoinen teksti logokuvaasi:

    1. Napauta Logo-alueella Muokkaa.
    2. Anna Vaihtoehtoinen teksti -kenttään lyhyt kuvaus kuvasta.
    3. Napauta Tallenna tai ✓.

  9. Valinnainen: Säädä Tietokoneen logon leveys -alueella logon leveyttä pikseleinä liukusäätimellä.

  10. Napauta Tallenna tai ✓.

Faviconin lisääminen

Voit lisätä suosikkikuvakkeen eli faviconin, jota käytetään verkkokauppasi brändäyksessä. Favicon näkyy seuraavissa paikoissa:

  • verkkoselaimen välilehdellä
  • verkkoselaimen historiassa
  • kuvakkeita tietokoneellasi
  • verkkokauppasi nimen vieressä, kun verkkosivusi on lisätty kirjanmerkkeihin

Lue lisää faviconeista.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, johon haluat lisätä faviconin, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Teemasi versiosta riippuen klikkaa Logo tai Favicon.

  5. Favicon-kuva-osiossa klikkaa Valitse kuva ja lisää sitten uusi tai olemassa oleva kuva:

    • Voit valita kuvan, jonka olet jo ladannut Shopifyn ohjausnäkymään, hakemalla tai etsimällä kuvaa ja valitsemalla sen valintaruudulla.
    • Voit valita kuvan tietokoneeltasi klikkaamalla Lisää kuvia, avaamalla kuvan ja valitsemalla sen valintaruudulla.

  6. Klikkaa Valmis.

  7. Valinnainen: Lisää vaihtoehtoinen teksti favicon-kuvaasi:

    1. Favicon-kuva-osiossa klikkaa Muokkaa.
    2. Anna Vaihtoehtoinen teksti -kenttään lyhyt kuvaus kuvasta.
    3. Klikkaa Tallenna.

  8. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, johon haluat lisätä faviconin, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Teemasi versiosta riippuen napauta Logo tai Favicon.

  7. Favicon-kuva-osiossa napauta Valitse kuva ja lisää sitten uusi tai olemassa oleva kuva:

    • Voit valita kuvan, jonka olet jo ladannut Shopifyn ohjausnäkymään, hakemalla tai etsimällä kuvaa ja valitsemalla sen valintaruudulla.
    • Voit valita kuvan laitteeltasi napauttamalla Lisää kuvia, avaamalla kuvan ja valitsemalla sen valintaruudulla.

  8. Napauta Valmis.

  9. Lisää vaihtoehtoinen teksti favicon-kuvaasi:

    1. Favicon-kuva-osiossa napauta Muokkaa.
    2. Anna Vaihtoehtoinen teksti -kenttään lyhyt kuvaus kuvasta.
    3. Napauta Tallenna tai ✓.

  10. Napauta Tallenna tai ✓.

Värit

Voit määrittää teemasi asetuksissa erilaisia värimalleja ja ottaa ne käyttöön verkkokauppasi eri osioissa värimallin valitsimella. Värimalli on värien joukko. Teemassasi käytetään oletusarvoisia värimalleja, joita voit muuttaa milloin tahansa teemaeditorissa. Voit lisätä brändisi värit varmistaaksesi väripalettisi yhtenäisen käytön koko verkkokaupassasi.

Malleissa ei ole yksittäisiä väriasetuksia, jotta verkkokauppasi ulkoasu pysyy yhdenmukaisena koko verkkosivustollasi. Mallia pidetään kaupan pääsivuna tai pääsisältönä. Eri värimallien käyttö eri puolilla kauppaa voi heikentää käyttäjäkokemusta ja saada asiakkaat poistumaan kaupasta ostamatta tuotteita.

Voit luoda ja mukauttaa jopa 21 yksilöllistä värimallia ja ottaa ne käyttöön verkkokauppasi eri osioissa.

Värimallit

Värimallit ovat teeman asetus, joka ryhmittelee elementit ja niiden värit visuaalisesti edustavalla tavalla. Voit määrittää eri värejä eri elementeille yhtenäisessä värimallissa, jota voidaan käyttää kaikkialla teemassasi, missä värimallin valitsin on käytettävissä. Sinulla voi olla jopa 21 värimallia. Voit myös esikatsella, miltä värit näyttävät mallin esikatselussa.

Luettelo eri asetuksista, joita voit soveltaa värimalleihin teemaeditorissa.
AsetusKuvaus
TaustaVäriä käytetään joidenkin osioiden taustassa ja ääriviivapainikkeen taustassa.
Taustan liukuväriJoidenkin osioiden taustaan käytetään liukuväriä. Taustan liukuvärit korvaavat taustan aina, kun se on mahdollista.
TekstiVäriä käytetään osion tai lohkon tekstissä.
Yksivärisen painikkeen taustaVäriä käytetään ensisijaisen painikkeen taustassa.
Yksivärisen painikkeen tekstiVäriä käytetään ensisijaisen painikkeen tekstissä.
ÄäriviivapainikeVäriä käytetään toissijaisen painikkeen tekstissä ja reunassa.
VarjoVäriä käytetään varjoissa.

Värimallin hallinta

Kauppasi värimalli ja värivaihtoehdot määritetään teeman asetuksissa. Yksiväristen värien osalta voit valita uuden värin värinvalitsimella tai syöttää värin arvon tekstikenttään. Värikenttä hyväksyy seuraavat värien nimet ja arvot:

  • Värien nimet, kuten red, black tai blue.
  • RGB-värikoodit.
  • Heksadesimaaliset väriarvot.

Vaiheet:

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Klikkaa Muokkaa teemaa sen teeman vieressä, jota haluat mukauttaa.

  3. Klikkaa asetukset -kuvaketta ja klikkaa sitten Värit.

  4. Mallit-osiossa klikkaa olemassa olevaa mallia tai lisää uusi värimalli klikkaamalla Lisää malli.

  5. Klikkaa sen sisältötyypin väriruutua, jonka väriä haluat muuttaa.

  6. Voit asettaa värin syöttämällä heksadesimaalisen värikoodin tai valitsemalla värin värinvalitsimesta. Voit asettaa väriksi läpinäkyvän poistamalla heksakoodin tekstikentästä.

  7. Klikkaa Tallenna.

Värimallin käyttöönotto

Kun olet määrittänyt värimallisi teeman asetuksissa, voit määrittää värimallin teemasi osioissa ja lohkoissa värimallin valitsimella. Värimallin valitsin on käytettävissä vain tietyissä osioissa, lohkoissa ja yleisissä teeman asetuksissa.

Värimallin valitsin

Liukuvärit

Voit määrittää joissakin teemoissa liukuvärin luodaksesi visuaalisesti mielenkiintoisia taustavaihtoehtoja. color_background-asetusta käytetään CSS-taustaominaisuuden mukauttamiseen.

Liukuvärin valitsimella voit valita liukuvärin värit, tyylin, kulman, sijainnin ja peittävyyden. Liukuvärin valitsimessa valitut asetukset esikatsellaan reaaliaikaisesti teemaeditorissa. Voit myös luoda liukuväritaustan CSS-koodilla, joka sisältää tarkistustyökalun.

Liukuvärien määrittäminen

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Klikkaa Muokkaa teemaa sen teeman vieressä, jota haluat mukauttaa.

  3. Klikkaa asetukset -kuvaketta ja klikkaa sitten Värit.

  4. Mallit-osiossa klikkaa olemassa olevaa mallia, jota haluat muokata.

  5. Klikkaa liukuvärin väriruudun vaihtoehtoa, kuten Taustan liukuväri.

  6. Jos et ole aiemmin määrittänyt liukuväriä, näkyviin tulee esiasetettuja vaihtoehtoja. Avaa asetuspaneeli valitsemalla mikä tahansa esiasetettu liukuväri.

  7. Valitse liukuvärin asetukset:

  • Valitse lineaarinen tai säteittäinen liukuväri. Valitse haluamasi liukuvärityyli painikkeilla.
  • Määritä liukuvärin kulma ylä- ja alanuolilla. Napsauttamalla ylä- tai alanuolta voit suurentaa tai pienentää kulmaprosenttia viidellä.
  • Valitse liukuvärin sijainti liukusäätimellä tai syötä kenttään numeerinen arvo.
  • Syötä tietty värin heksakoodi tai valitse sävy väriliukusäätimellä. Äskettäin valitut värit näkyvät liukuväriasetuspaneelin alaosassa.
  • Voit säätää liukuvärin läpinäkyvyyttä oikealla olevalla liukusäätimellä. Voit myös syöttää prosenttiluvun heksavärikoodin vieressä olevaan kenttään.
  1. Klikkaa Tallenna.

Liukuvärin valitsin teemaeditorissa

Määritä liukuvärit CSS:n avulla

Useimpia CSS:n background-ominaisuuden arvoja voidaan käyttää taustavärin määrittämiseen. Voit käyttää tätä kenttää tasaisille väreille (esimerkiksi #000000, black, rgb(0,0,0,0), rgba(0,0,0,0), hsl(0, 0%, 0%) ja hsla(0, 0%, 0%, 1) tuottavat kaikki tasaisen mustan taustan) tai liukuväreille (esimerkiksi linear-gradient(red, green), radial-gradient(red, green) tai conic-gradient(red, green)). Liukuvärejä voidaan myös toistaa.

Vaiheet:

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Klikkaa Muokkaa teemaa sen teeman vieressä, jota haluat mukauttaa.

  3. Klikkaa asetukset -kuvaketta ja klikkaa sitten Värit.

  4. Mallit-osiossa klikkaa olemassa olevaa mallia, jota haluat muokata.

  5. Napsauta liukuväriä, jota haluat muokata.

  6. Napsauta Liukuväri-kohdan vieressä olevaa nuolta ja valitse sitten CSS.

  7. Kirjoita tai liitä liukuvärikoodisi CSS-koodi-kenttään. Teemaeditorin esikatselu näyttää liukuvärin oikeassa sijainnissa.

  8. Klikkaa Tallenna.

Liukuvärin CSS-koodikenttä teemaeditorissa

Liukuvärin poistaminen

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Klikkaa Muokkaa teemaa sen teeman vieressä, jota haluat mukauttaa.

  3. Klikkaa asetukset -kuvaketta ja klikkaa sitten Värit.

  4. Mallit-osiossa klikkaa olemassa olevaa mallia, jota haluat muokata.

  5. Napsauta liukuväriä, jonka haluat poistaa.

  6. Napsauta Poista liukuväri.

  7. Klikkaa Tallenna.

Typografia

Voit määrittää verkkokauppasi tekstin fonttityylin ja -koon. Voit valita järjestelmäfontin tai lisätä mukautetun fontin. Teemassasi käytettävissä olevat fontit riippuvat teeman kehittäjästä. Kaikki Shopifyn ilmaiset teemat käyttävät fontteja Shopifyn fonttikirjastosta.

Harkitse järjestelmäfonttien käyttämistä kaupassasi, koska ne on jo asennettu käyttäjän tietokoneeseen. Järjestelmäfonttien käyttäminen estää uusien fonttien lataamisen asiakkaan tietokoneelle, mikä voi vaikuttaa negatiivisesti kauppasi latausnopeuteen. Asiakkaasi tietokoneella näkyvä fontti riippuu hänen käyttöjärjestelmästään.

Mukauta fonttityyppejä

Luettelo käytettävissä olevista fonteista on Shopifyn fonttikirjastossa.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Napsauta Typografia.

  5. Jos haluat vaihtaa kauppasi otsikoiden tai leipätekstin fonttityypin, napsauta Vaihda Otsikot- tai Leipäteksti-osiossa.

  6. Napsauta sen fontin nimeä, jota haluat käyttää, ja napsauta sitten Valitse.

  7. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Typografia.

  7. Jos haluat vaihtaa kauppasi otsikoiden tai leipätekstin fonttityypin, napauta Vaihda Otsikot- tai Leipäteksti-osiossa.

  8. Napauta sen fontin nimeä, jota haluat käyttää, ja napauta sitten Valmis.

  9. Napauta Tallenna tai ✓.

Mukauta fonttikokoja

Voit määrittää otsikoiden ja leipätekstin oletusfonttikoot Typografia-teema-asetuksella.

Pienin fonttikoko on 100 % ja suurin 150 %. Jokainen asteikon porras suurentaa fonttikokoa 5 %. Oletusasetus on 100 %.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Napsauta Typografia.

  5. Jos haluat muuttaa Otsikot-tekstin oletusfonttikokoa, valitse oletusfonttikoko Fonttikoon asteikko -liukusäätimellä.

  6. Jos haluat muuttaa Leipäteksti-tekstin oletusfonttikokoa, valitse oletusfonttikoko Fonttikoon asteikko -liukusäätimellä.

  7. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Typografia.

  7. Jos haluat muuttaa Otsikot-tekstin oletusfonttikokoa, valitse oletusfonttikoko Fonttikoon asteikko -liukusäätimellä.

  8. Jos haluat muuttaa Leipäteksti-tekstin oletusfonttikokoa, valitse oletusfonttikoko Fonttikoon asteikko -liukusäätimellä.

  9. Napauta Tallenna tai ✓.

Asettelu

Voit määrittää enimmäisleveyden, jolla verkkokauppasi näytetään, sekä osioiden välisen pysty- ja vaakasuuntaisen tilan.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Napsauta Asettelu.

  5. Valitse Sivun leveys -liukusäätimellä sivun leveys väliltä 1 000 px – 1 600 px. Oletusasetus on 1 600 px.

  6. Valinnainen: Lisää sivuillesi pystysuuntaista tilaa mallin osioiden välille liukusäätimellä. Voit lisätä osioiden väliin enintään 100 px.

  7. Valinnainen: Jos käytössäsi on Ruudukko-asettelu, lisää tilaa ruudukon sisällön väliin sivuillasi Vaakatila- ja Pystytila-liukusäätimillä. Vaakatilan lisääminen lisää enintään 40 px tilaa sisältöriveille, kun taas pystytilan lisääminen lisää enintään 40 px tilaa sisältösarakkeille sivuillasi.

  8. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Asettelu.

  7. Valitse Sivun leveys -liukusäätimellä sivun leveys väliltä 1 000 px – 1 600 px. Oletusasetus on 1 600 px.

  8. Valinnainen: Lisää sivuillesi pystysuuntaista tilaa mallin osioiden välille liukusäätimellä. Voit lisätä osioiden väliin enintään 100 px.

  9. Valinnainen: Jos käytössäsi on Ruudukko-asettelu, lisää tilaa ruudukon sisällön väliin sivuillasi Vaakatila- ja Pystytila-liukusäätimillä. Vaakatilan lisääminen lisää enintään 40 px tilaa sisältöriveille, kun taas pystytilan lisääminen lisää enintään 40 px tilaa sisältösarakkeille sivuillasi.

  10. Napauta Tallenna tai ✓.

Animaatiot

Animaatioiden avulla voit lisätä liikettä ja visuaalista mielenkiintoa verkkokauppaasi. Voit aktivoida häivytysanimaation, joka paljastaa kauppasi osiot vieritettäessä, sekä kohdistustehosteen korteillesi ja painikkeillesi.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Napsauta Animaatiot.

  5. Valinnainen: Jos haluat aktivoida animaation, joka paljastaa verkkokauppasi osiot vieritettäessä, valitse Paljasta osiot vieritettäessä.

  6. Valinnainen: Jos haluat lisätä kohdistustehosteanimaation korteillesi ja painikkeillesi, valitse jokin seuraavista vaihtoehdoista Kohdistustehoste-asetuksesta:

    • Pystysuuntainen nosto: Kun asiakas vie hiiren kortin tai painikkeen päälle, elementti siirtyy ylöspäin.
    • 3D-nosto: Kun asiakas vie hiiren kortin tai painikkeen päälle, elementti siirtyy eteenpäin, mikä antaa sille 3D-tehosteen. Siinä on myös hienovarainen kiilto, joka liikkuu elementin poikki, mikä antaa sille uuden ulottuvuuden.

  7. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Animaatiot.

  7. Valinnainen: Jos haluat aktivoida animaation, joka paljastaa verkkokauppasi osiot vieritettäessä, valitse Paljasta osiot vieritettäessä.

  8. Valinnainen: Jos haluat lisätä kohdistustehosteanimaation korteillesi ja painikkeillesi, valitse jokin seuraavista vaihtoehdoista Kohdistustehoste-asetuksesta:

    • Pystysuuntainen nosto: Kun asiakas vie hiiren kortin tai painikkeen päälle, elementti siirtyy ylöspäin.
    • 3D-nosto: Kun asiakas vie hiiren kortin tai painikkeen päälle, elementti siirtyy eteenpäin, mikä antaa sille 3D-tehosteen. Siinä on myös hienovarainen kiilto, joka liikkuu elementin poikki, mikä antaa sille uuden ulottuvuuden.

  9. Napauta Tallenna tai ✓.

Visuaalisten elementtien mukautusasetukset

Voit säätää teemasi elementtien, kuten painikkeiden, tuotekorttien ja versioiden, ulkoasua Teeman asetukset -sivulla. Jokainen vaihtoehto sisältää kyseisen elementin olennaiset asetukset.

Voit säätää seuraavien teemasi elementtien asetuksia:

  • Painikkeet: Painikkeita ovat muun muassa osioiden, kuten diaesityksen tai kuva ja teksti -osion, toimintakehotuspainikkeet sekä yhteydenottolomakkeen, tuotesivujen ja ostoskorisivujen painikkeet.
  • Versiopainikkeet: Versiopainikkeiden avulla voit näyttää tuotteen versiot tuotesivulla tai esittelytuoteosiossa. Asiakkaat voivat valita haluamansa version ja lisätä tuotteen ostoskoriin ilman, että heidän tarvitsee siirtyä pois tuotesivulta. Voit mukauttaa versiopainikkeiden näkymää verkkokaupassasi.
  • Syöttökentät: Syöttökentät ovat vuorovaikutteisia alueita, jotka edellyttävät asiakkaalta syötettä, kuten määrän valitsin, sähköpostitilauslomake tai tilauskommentit. Voit muokata verkkokauppasi syöttökenttien ulkoasua.
  • Tuote-, kokoelma- ja blogikorttien asetusten avulla voit mukauttaa kunkin korttityypin tyyliä, kun ne näytetään sivuosiossa.
    • Tuotekortit: Tuotekortit näyttävät tietoja tuotteistasi teemasi alueilla, joissa on lueteltu useita tuotteita, kuten kokoelmamalleissa, kokoelmaosioissa ja hakutuloksissa.
    • Kokoelmakortit: Kokoelmakortit näyttävät tietoja kokoelmistasi teemasi alueilla, joissa on lueteltu kokoelmia, kuten kokoelmaluettelomallissa tai -osiossa.
    • Blogikortit: Blogikortit näyttävät tietoja blogipostauksistasi teemasi alueilla, joissa on lueteltu useita tuotteita, kuten blogimalleissa, blogiosioissa ja hakutuloksissa.
  • Sisältösäiliöt: Säiliöitä käytetään sisältöosioiden tekstielementissä, esimerkiksi diaesityksen tekstiruudussa, kuvabannerissa tai monisarakkeisten osioiden sarakkeissa. Voit mukauttaa verkkokauppasi sisältösäiliöiden ulkoasua.
  • Media: Media on osioiden visuaalinen komponentti, esimerkiksi tuotemedia tai kuva Kuva ja teksti -osiossa. Voit lisätä mediaan reunuksia ja varjoja.
  • Pudotusvalikot ja ponnahdusikkunat: Voit muokata verkkokauppasi pudotusvalikoiden, modaalisten ponnahdusikkunoiden ja ostoskorin ponnahdusilmoitusten ulkoasua.
  • Vetolaatikot: Vetolaatikot ovat piilotettuja, vuorovaikutteisia säilöjä, jotka tulevat näkyviin napautettaessa tai klikattaessa. Tällaisia ovat esimerkiksi kokoontaitettavat valikot tai kokoelman suodatusvaihtoehdot. Voit mukauttaa verkkokauppasi vetolaatikoiden reunusta ja varjoa.
  • Tunnukset: Ale- ja Loppuunmyyty-tunnukset lisätään automaattisesti tuotekuviin, kun alennat hintaa tai kun varastomäärä on 0. Voit muokata Ale- ja Loppuunmyyty-tunnusten sijaintia, muotoa ja väriä erikseen teemasi asetuksissa. Sivu- ja Blogi-tunnukset näkyvät relevanteissa hakutuloksissa. Voit mukauttaa näiden tunnusten sijaintia ja muotoa, mutta et voi muuttaa Sivu- ja Blogi-tunnusten väriä.
  • Bränditiedot: Voit sisällyttää brändiäsi koskevia tietoja verkkokauppaasi. Kun olet suorittanut seuraavat vaiheet, voit lisätä Bränditiedot-lohkon verkkokauppasi alatunnisteeseen.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Klikkaa muokattavan teeman vierestä Muokkaa teemaa.

  3. Klikkaa asetukset-kuvaketta.

  4. Klikkaa elementtiä avataksesi asetukset.

  5. Säädä mitä tahansa käytettävissä olevista asetuksista. Voit tarkastella muutoksia siirtymällä teemasi eri alueille esikatseluikkunassa.

  6. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta muokattavan teeman vierestä Muokkaa teemaa.

  4. Napauta asetukset-kuvaketta.

  5. Napauta elementtiä avataksesi asetukset.

  6. Säädä mitä tahansa käytettävissä olevista asetuksista. Voit tarkastella muutoksia siirtymällä teemasi eri alueille esikatseluikkunassa.

  7. Napauta Tallenna tai ✓.

Sosiaalinen media

Voit lisätä linkkejä sosiaalisen median tileillesi, jotka näkyvät verkkokauppasi alatunnisteessa.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Klikkaa Sosiaalinen media.

  5. Lisää linkit sosiaalisen median tileillesi syöttämällä tiliesi verkkosivujen osoitteet asianmukaisiin Sometilit-kenttiin. Sinun on annettava kokonaiset linkit, kuten https://instagram.com/shopify tai https://tiktok.com/@shopify.

  6. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Sosiaalinen media.

  7. Lisää linkit sosiaalisen median tileillesi syöttämällä tiliesi verkkosivujen osoitteet asianmukaisiin Sometilit-kenttiin. Sinun on annettava kokonaiset linkit, kuten https://instagram.com/shopify tai https://tiktok.com/@shopify.

  8. Napauta Tallenna tai ✓.

Haun toiminta

Verkkokaupassasi on ennakoiva haku, joka näyttää ehdotuksia, kun asiakkaat alkavat kirjoittaa hakukenttään. Hakuehdotukset voivat auttaa asiakkaita muotoilemaan ja tarkentamaan hakukyselyjään ja tarjota heille uusia tapoja tutustua verkkokauppaasi. Hakuehdotusten avulla asiakkaat voivat myös nopeasti selata osumia poistumatta nykyiseltä sivultaan erilliseen hakutulosten luetteloon.

Lue lisää hakuehdotusten toiminnasta kohdasta Ennakoiva haku.

Voit mukauttaa, miten hakuehdotukset näytetään asiakkaillesi.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Klikkaa Haun toiminta.

  5. Ota hakuehdotukset käyttöön tai poista ne käytöstä valitsemalla Ota hakuehdotukset käyttöön tai poistamalla sen valinta.

  6. Valinnainen: Jos haluat näyttää tai piilottaa tuotteen myyjän hakuehdotuksissa, valitse Näytä tuotteen myyjä tai poista sen valinta.

  7. Valinnainen: Jos haluat näyttää tai piilottaa tuotteen hinnan hakuehdotuksissa, valitse Näytä tuotteen hinta tai poista sen valinta.

  8. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Haun toiminta.

  7. Ota hakuehdotukset käyttöön tai poista ne käytöstä valitsemalla Ota hakuehdotukset käyttöön tai poistamalla sen valinta.

  8. Valinnainen: Jos haluat näyttää tai piilottaa tuotteen myyjän hakuehdotuksissa, valitse Näytä tuotteen myyjä tai poista sen valinta.

  9. Valinnainen: Jos haluat näyttää tai piilottaa tuotteen hinnan hakuehdotuksissa, valitse Näytä tuotteen hinta tai poista sen valinta.

  10. Napauta Tallenna tai ✓.

Valuutan muoto

Voit valita, näytetäänkö tuotteidesi hintojen yhteydessä valuuttakoodi.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Klikkaa Valuutan muoto.

  5. Näytä valuuttakoodit valitsemalla Näytä valuuttakoodit.

  6. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Valuutan muoto.

  7. Näytä valuuttakoodit valitsemalla Näytä valuuttakoodit.

  8. Napauta Tallenna tai ✓.

Ostoskori

Voit muuttaa verkkokauppasi ostoskorin tyyliä. Kun asiakas lisää tuotteen kaupastasi ostoskoriinsa, ostoskori voidaan näyttää vetolaatikkona, sivuna tai ponnahdusilmoituksena. Jos haluat pitää asiakkaan tuotesivulla, käytä vetolaatikko- tai ponnahdusilmoitusvaihtoehtoa. Jos haluat viedä asiakkaan ostoskorisivulle, käytä sivuvaihtoehtoa. Kun asiakkaan ostoskori on tyhjä, voit näyttää esittelykokoelman veto-ostoskorissa.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Klikkaa Ostoskori.

  5. Valitse ostoskorin tyyliksi Vetolaatikko, Sivu tai Ponnahdusilmoitus Ostoskorin tyyppi -pudotusvalikosta.

  6. Valinnainen: Jos haluat näyttää asiakkaan ostoskorissa olevien tuotteiden myyjät, valitse Näytä myyjä.

  7. Valinnainen: Jos haluat antaa asiakkaille tekstiruudun, johon he voivat kirjoittaa erikoistoiveita tai lisätä ylimääräisiä tilaustietoja, valitse Ota tilauskommentti käyttöön.

  8. Valinnainen: Jos valitset Ostoskorin tyypiksi Vetolaatikko, voit näyttää kokoelman tyhjässä veto-ostoskorissa:

    1. Klikkaa Veto-ostoskori-alueella Valitse kokoelma.
    2. Klikkaa sen kokoelman nimeä, jonka haluat näyttää, ja klikkaa sitten Valitse.

  9. Valinnainen: Jos valitset Ostoskorin tyypiksi Vetolaatikko, voit muuttaa veto-ostoskorisi värimallia seuraavasti:

    1. Napsauta Vaihda-painiketta Veto-ostoskori > Värimalli -osiossa.
    2. Valitse veto-ostoskorissa käytettävä värimalli.

  10. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Ostoskori.

  7. Valitse Ostoskorin tyyppi vaihtoehdoista Veto, Sivu tai Ponnahdusilmoitus.

  8. Valinnainen: Jos haluat näyttää asiakkaan ostoskorissa olevien tuotteiden myyjät, valitse Näytä myyjä.

  9. Valinnainen: Jos haluat antaa asiakkaille tekstiruudun, johon he voivat kirjoittaa erikoistoiveita tai lisätä ylimääräisiä tilaustietoja, valitse Ota tilauskommentti käyttöön.

  10. Valinnainen: Jos valitset Ostoskorin tyypiksi Vetolaatikko, voit näyttää kokoelman tyhjässä veto-ostoskorissa:

    1. Napauta Veto-ostoskori-alueella Valitse kokoelma -painiketta.
    2. Napauta sen kokoelman nimeä, jonka haluat näyttää, ja napauta sitten Valmis.

  11. Valinnainen: Jos valitset Ostoskorin tyypiksi Vetolaatikko, voit muuttaa veto-ostoskorisi värimallia seuraavasti:

    1. Napauta Vaihda-painiketta Veto-ostoskori > Värimalli -osiossa.
    2. Valitse veto-ostoskorissa käytettävä värimalli ja napauta sitten Valmis.

  12. Napauta Tallenna tai ✓.

Mukautettu CSS

Mukautettu CSS -osion avulla voit syöttää omaa CSS-koodiasi, jolla voit esimerkiksi mukauttaa verkkokauppasi painikkeiden ulkoasua käytettävissä olevia oletusasetuksia pidemmälle tai lisätä yksilöllisen tyylin tietyille tekstielementeille.

Teemasi asetuksissa oleva mukautettu CSS vaikuttaa kaikkiin verkkokauppasi sivuihin kassaasi lukuun ottamatta.

Lue lisää aiheesta Mukautetun CSS:n lisääminen teemaan.

Teeman tyyli

Teeman tyyli on teeman suunnittelijan valitsema asetuskokonaisuus. Voit soveltaa teeman tyyliä kauppaasi antaaksesi sille viimeistellyn käyttötuntuman. Kaikissa teemoissa on oletusarvoisesti käytössä teeman tyyli. Muut käytettävissäsi olevat teeman tyylin vaihtoehdot riippuvat käyttämästäsi teemasta.

Kun mukautat teemaa, korvaat teeman tyylin asetukset omillasi. Kun sovellat teeman tyyliä teemaasi, muutat nykyisiä asetuksiasi, kuten värejä ja typografiaa.

Vaiheet:

Tietokone

  1. Siirry Shopifyn ohjausnäkymässä kohtaan Verkkokauppa > Teemat.

  2. Etsi teema, jota haluat muokata, ja klikkaa sitten Muokkaa teemaa.

  3. Klikkaa Teeman asetukset -kuvaketta settings.

  4. Napsauta Teeman tyyli.

  5. Valitse teeman tyyli, jota haluat käyttää, ja napsauta sitten Vaihda tyyli.

  6. Klikkaa Tallenna.

Mobiili

  1. Napauta Shopify-sovelluksessa kuvaketta Menu.

  2. Napauta Myyntikanavat-osiossa Verkkokauppa.

  3. Napauta Hallinnoi kaikkia teemoja.

  4. Etsi teema, jota haluat muokata, ja napauta sitten Muokkaa teemaa.

  5. Napauta … tai ⋮ ja napauta sitten Teeman asetukset.

  6. Napauta Teeman tyyli.

  7. Valitse teeman tyyli, jota haluat käyttää, ja napauta sitten Valmis.

  8. Napauta Tallenna tai ✓.