Teeman asetukset

Teeman asetuksilla voit tehdä muutoksia verkkokaupan typografiaan, väreihin, sosiaalisen median yhteyksiin ja kassan asetuksiin.

Teeman asetuksilla voit tehdä muutoksia verkkokaupan typografiaan, väreihin, sosiaalisen median yhteyksiin ja kassan asetuksiin. Kun teet muutoksia teema-asetuksiisi, muutokset koskevat koko verkkokauppaasi.

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

  • ylätunnisteessa kaikilla sivuilla
  • salasanasivulla

Logokuvien enimmäisleveys on 300 pikseliä.

Logon mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Logo.
  3. klikkaa Logo-kohdassa Valitse kuva ja tee jokin seuraavista:

    • Jos haluat käyttää kuvaa, jonka olet jo ladannut Shopify Adminiin, valitse kuva klikkaamalla ja klikkaa sen jälkeen Valitse.
    • Jos haluat käyttää kuvaa paikalliselta tietokoneelta, klikkaa Lataa. Valitse kuva tietokoneeltasi ja aloita lataus klikkaamalla Avaa. Kuva valitaan automaattisesti, kun lataus on valmis. Klikkaa Valitse.
    • Jos haluat valita ilmaisen kuvan, klikkaa Ilmaiset kuvat ja etsi kuvaa tai valitse klikkaamalla.
  4. Vaihtoehtoisen tekstin lisääminen logokuvaan:

    1. Klikkaa Muokkaa vaihtoehtoista tekstiä.
    2. Kirjoita Muokkaa kuvaa -ikkunassa lyhyt kuvan kuvaus.
    3. Klikkaa Tallenna.

Logon leveyden muuttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Logo.
  3. Valitse Logon leveys tietokoneella -alueella haluamasi pikselileveys liukusäätimen avulla.

Favicon

Voit lisätä suosikkikuvakkeen eli favicon-kuvakkeen, joka tukee verkkokauppasi brändin luomista. Favicon-kuvake näkyy seuraavissa paikoissa:

  • verkkoselaimen välilehti
  • verkkoselaimen historia
  • työpöydällä olevat kuvakkeet
  • verkkokaupan nimen vieressä, kun siitä on tuotettu kirjanmerkki

Lisätietoja faviconeista eli suosikkikuvakkeista.

Mukauta favicon-kuvaketta

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Logo.
  3. Klikkaa Faviconin kuvan alueessa Valitse kuvaja tee jokin seuraavista:

    • Jos haluat käyttää kuvaa, jonka olet jo ladannut Shopify Adminiin, valitse kuva klikkaamalla ja klikkaa sen jälkeen Valitse.
    • Jos haluat käyttää kuvaa paikalliselta tietokoneelta, klikkaa Lataa. Valitse kuva tietokoneeltasi ja aloita lataus klikkaamalla Avaa. Kuva valitaan automaattisesti, kun lataus on valmis. Klikkaa Valitse.
    • Jos haluat valita ilmaisen kuvan, klikkaa Ilmaiset kuvat ja etsi kuvaa tai valitse klikkaamalla.
  4. Vaihtoehtoisen tekstin lisääminen Faviconin kuvaan:

    1. Klikkaa Muokkaa vaihtoehtoista tekstiä.
    2. Kirjoita Muokkaa kuvaa -ikkunassa lyhyt kuvan kuvaus.
    3. Klikkaa Tallenna.

Bränditiedot

Voit kertoa tietoja brändistäsi. Voit lisätä bränditietojen lohkon alatunnisteeseen.

Brändin tietojen mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Brändin tiedot.
  3. Kirjoita otsikko.
  4. Kirjoita kuvaus.
  5. Klikkaa Valitse kuva ja tee sitten jokin seuraavista toimenpiteistä:

    • Jos haluat käyttää kuvaa, jonka olet jo ladannut Shopify Adminiin, valitse kuva klikkaamalla ja klikkaa sen jälkeen Valitse.
    • Jos haluat käyttää kuvaa paikalliselta tietokoneelta, klikkaa Lataa. Valitse kuva tietokoneeltasi ja aloita lataus klikkaamalla Avaa. Kuva valitaan automaattisesti, kun lataus on valmis. Klikkaa Valitse.
    • Jos haluat valita ilmaisen kuvan, klikkaa Ilmaiset kuvat ja etsi kuvaa tai valitse klikkaamalla.
  6. Valitse Kuvan leveys -alueella haluamasi pikselileveys liukusäätimen avulla.

Värit

Voit määrittää verkkokauppasi ensisijaiset ja toissijaiset värimallit.

Mukauta väriasetuksiasi

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Värit.
  3. Avaa värivalitsin klikkaamalla muutettavan sisältötyypin värin väriruutua.

  4. Klikkaa Tallenna.

Saat lisätietoja värivaihtoehdoista, kuten liukuvärien luomisesta, tutustumalla Värimalleihin.

Typografia

Voit määrittää verkkokaupassasi olevan tekstin fonttityylin ja -koon. Voit valita järjestelmän fontin tai mukautetun fontin.

On suositeltavaa, että käytät kaupassa järjestelmän fonttia. Järjestelmän fonttien käyttäminen estää uusien fonttien lataamisen asiakkaan tietokoneelle, mikä voi heikentää kaupan latausnopeutta. Asiakkaan tietokoneella näkyvä fontti riippuu asiakkaan käyttöjärjestelmästä.

Muokkaa typografia-asetuksia

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Typografia.
  3. Käytä fontinvalitsinta klikkaamalla kunkin tekstityypin kohdalla Muuta.
  4. Tutki hakukentän avulla käytettävissä olevia fontteja tai klikkaamalla Lataa lisää.
  5. Klikkaa haluamasi fontin nimeä ja klikkaa sitten Valitse.
  6. Klikkaa Tallenna.

Fonttikokojen mukauttaminen

Voit määrittää otsikon ja leipätekstin oletusfonttikoot teeman Typografia-asetuksissa.

Vaiheet:

  1. Klikkaa Teeman asetukset > Typografia.
  2. Jos vaihdat otsikon oletusarvoista fonttikokoa, käytä Fonttikoon skaalausta oletusarvoisen fonttikoon valitsemiseen. Fontin vähimmäiskoko on 100 %, ja fontin enimmäiskoko on 150 %. Jokainen skaalauksen lisäys kasvattaa fonttikokoa 5 %. Oletusasetus on 100 %.
  3. Jos vaihdat leipätekstin oletusarvoista fonttikokoa, käytä fonttikoon skaalaa oletusarvoisen fonttikoon valitsemiseksi. Fontin vähimmäiskoko on 100 %, ja fontin enimmäiskoko on 130 %. Jokainen skaalan lisäys kasvattaa fonttikokoa 5 %. Oletusasetus on 100 %.
  4. Klikkaa Tallenna.

Asettelu

Asettelun avulla voit määrittää enimmäisleveyden, jonka alueella verkkokauppasi näkyy.

  1. Klikkaa Teeman asetukset > Asettelu.
  2. Valitse alueen liukusäätimellä sivun leveydeksi 1 200 tai 1 600 pikseliä. Oletusasetus on 1 600 pikseliä.
  3. [Valinnainen] Lisää osioiden väliin pystysuuntaista tilaa liukusäätimellä. Voit lisätä osioiden väliin enintään 100 pikseliä tilaa.
  4. [Valinnainen] Jos käytössäsi on Ruudukko-asettelu, voit lisätä ruudukkosisällön väliin tilaa vaaka- ja pystysuuntaisen tilan liukusäätimellä. Kun lisäät tilaa vaakasuunnassa, rivien väliin lisätään enintään 40 pikseliä tilaa, ja jos lisäät tilaa pystysuunnassa, sarakkeiden väliin lisätään enintään 40 pikseliä tilaa.
  5. Klikkaa Tallenna.

Reunat ja varjot

Voit säätää joidenkin interaktiivisten sisältötyyppien, kuten laatikoiden, painikkeiden, versioiden tai määräsyötteiden, reunoja ja varjoja.

Reunoja voidaan mukauttaa seuraavilla tavoilla:

  • Paksuus: muuttaa kohteen ääriviivaa.
  • Peittävyys: määrittää kohteen ääriviivan läpinäkyvyyden.
  • Kulman säde: pyöristää kohteiden kulmat.

Varjojen asetuksia ovat:

  • Peittävyys: muuttaa kohteen varjon näkyvyyttä. Kun varjon peittävyys 0 prosenttia, tuotteen varjo poistuu kokonaan.
  • Vaaka- tai pystysuuntaiset siirtymäalueen liukusäätimet siirtävät varjon sijaintia tuotteen ympärillä.
  • Sumennus-liukusäätimen avulla on muuttaa tuotteen varjon peittävyyttä.

Painikkeet

Voit mukauttaa toimintokutsupainikkeiden asetuksia verkkokaupassasi lisäämällä varjoja, muuttamalla riviväliä tai peittävyyttä ja säätämällä painikkeiden muotoa.

Esimerkki verkkokaupasta, jossa on toimintokutsupainike

Painikkeiden mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Painikkeet.
  3. Voit muuttaa painikkeen reunan ulkonäköä liukuvien asteikkojen avulla.
  4. Voit muuttaa painikkeen varjostusta liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  5. Klikkaa Tallenna.

Versioiden pillerikuvakkeet

Versioiden pillerikuvakkeiden avulla voit näyttää tuotteen versiot tuotesivulla tai esittelyssä olevan tuotteen osiossa. Asiakkaat voivat valita haluamansa tuoteversion ja lisätä tuotteen tuotekoriinsa ilman, että heidän tarvitsee vaihtaa tuotesivuja.

Esimerkki verkkokaupasta, jossa on valittavien versioiden pillerikuvakkeita

Versioiden pillerikuvakkeiden mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Versioiden pillerikuvakkeet.
  3. Voit muuttaa versioiden pillerikuvakkeiden reunan ulkonäköä liukuvien asteikkojen avulla.
  4. Voit muuttaa versioiden pillerikuvakkeiden varjoa liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  5. Klikkaa Tallenna.

Syötteet

Syötteet ovat interaktiivisia alueita, joihin asiakkaan täytyy syöttää jokin arvo tai tieto. Näitä ovat esimerkiksi määrän valitsin, sähköpostitilauksen rekisteröitymislomake tai ostoskorin kommentti. Voit säätää verkkokaupan syötteiden ulkoasua teeman asetuksissa.

Esimerkki verkkokaupasta, jossa on määräsyöte

Syötteiden mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Syötteet.
  3. Voit muuttaa syötteen reunan ulkonäköä liukuvien asteikkojen avulla.
  4. Voit muuttaa syötteen varjostusta liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  5. Klikkaa Tallenna.

Kortit

Kortit ovat osioiden erillisiä alueita, joiden avulla voit esitellä useita tuotteita, kuten tuotekortteja, blogikortteja, kokoelmakortteja tai kollaasikortteja. Voit mukauttaa osion korttien muotoa, tyyliä, väriä, tasausta ja kuvan täyttöä.

Korttien mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Kortit.
  3. Valitse kortin tyyli pudotusvalikosta.
  4. Lisää Kuvan täyttö liukuvien asteikkojen avulla. Tämä lisää tilaa ostoskorin kuvien ympärille.
  5. Määritä korttien Tekstin tasaus pudotusvalikossa. Valitse joko vasen, keskellä (oletus) tai oikea.
  6. Valitse korttien värimalli pudotusvalikosta.
  7. Voit muuttaa kortin reunan ulkonäköä liukuvien asteikkojen avulla.
  8. Voit muuttaa kortin varjostusta liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  9. Klikkaa Tallenna.

Sisältösäiliöt

Säilöt ovat sisältöosioiden tekstiosa, kuten diaesityksen tai kuvabannerin tekstiruutu, tai useita sarakkeita sisältävien osioiden sarakkeet. Voit mukauttaa verkkokauppasi sisältösäilöjen ulkoasua.

Sisältösäilöjen mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Sisältösäilöt.
  3. Voit muuttaa sisältösäilön reunan ulkonäköä liukuvien asteikkojen avulla.
  4. Voit muuttaa sisältökokonaisuuden varjostusta liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  5. Klikkaa Tallenna.

Media

Media on osioiden visuaalinen osa, kuten tuotemedia tai Kuva tekstillä -osioiden kuva. Voit lisätä mediaan reunoja ja varjoja.

Median mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Media.
  3. Voit muuttaa median reunan ulkonäköä liukuvien asteikkojen avulla.
  4. Voit muuttaa median varjostusta liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  5. Klikkaa Tallenna.

Alasvetovalikot ja ponnahdusikkunat

Muokkaa navigoinnin alasvetovalikoiden, modaalisten ponnahdusikkunoiden ja ostoskorien ulkoasua.

Pudotusvalikoiden ja ponnahdusikkunoiden mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Pudotusvalikot ja ponnahdusikkunat.
  3. Voit muuttaa reunan ulkonäköä liukuvien asteikkojen avulla.
  4. Voit muuttaa varjostusta liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  5. Klikkaa Tallenna.

Vetolaatikot

Laatikot ovat piilotettuja, interaktiivisia säilöjä, jotka tulevat näkyviin ja katoavat, kun niitä klikataan tai napautetaan. Tällaisia ovat esimerkiksi pienennettävä navigointivalikko tai suodatinvaihtoehdot.

Laatikkojen mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Veto-ostoskorit.
  3. Voit muuttaa reunan ulkonäköä liukuvien asteikkojen avulla.
  4. Voit muuttaa varjostusta liukuvien asteikkojen avulla. Jos varjon peittävyydeksi asetetaan 0 %, varjo poistuu.
  5. Klikkaa Tallenna.

Tunnukset

Alennusmyynti- ja Loppuunmyyty-tunnukset lisätään tuotekuviin automaattisesti, kun tuotteen hinta laskee tai kun varastomäärä on 0. Voit säätää tunnusten sijaintia, muotoa ja väriä.

Esimerkki verkkokaupasta, jossa alennusmyynti- ja loppuunmyyty-tunnukset

Sivu- ja Blogi-tunnukset näkyvät osuvissa hakutuloksissa. Voit mukauttaa näiden tunnusten sijaintia ja muotoa, mutta et väriä.

Tunnusten muokkaaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Tunnukset.
  3. Valitse tuotekorttien tunnuksen sijainti pudotusvalikosta. Valitse vasen yläkulma, oikea yläkulma, vasen alakulma (oletus) tai oikea alakulma.
  4. Lisää pyöristetyt kulmat kulman säteen liukuvien asteikkojen avulla. Kulman säteen asettaminen 0 pikseliin tekee tunnusten reunoista neliönmuotoiset ja säteen kasvattaminen pyöristää tunnusten reunoja.
  5. Valitse tunnustesi värimalli. Voit määrittää toisen värimallin loppuunmyytyjä tuotteita varten.
  6. Klikkaa Tallenna.

Kuvakkeet

Kuvakkeet ovat pieniä kuvia, joita voidaan lisätä tiettyihin osioihin tai lohkoihin. Määritä kuvakkeiden väri teema-asetuksissa.

Esimerkki verkkokaupasta, jossa on kuvakkeita pienennettävissä riveissä

Kuvakkeiden mukauttaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Kuvakkeet.
  3. Valitse kuvakkeiden oletusväri pudotusvalikosta. Valitse kauppasi kuvakkeille joko korostus 1, korostus 2, ääriviivapainike tai tekstin väri.
  4. Klikkaa Tallenna.

Sosiaalinen media

Voit lisätä tuotteisiin ja blogipostauksiin sosiaalisen median jakamispainikkeita, ja voit myös lisätä linkkejä sosiaalisen median tileillesi. Linkit sosiaalisen median tileihin näkyvät verkkokaupan alatunnisteessa.

Mukauta sosiaalisen median asetuksia

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Sosiaalinen media
  3. Jos haluat lisätä linkkejä sosiaalisen median tileillesi, syötä tilien linkit Tilit-kohdassa oleviin kenttiin. Syötä linkit kokonaisuudessaan, esimerkiksi https://instagram.com/shopify tai https://twitter.com/shopify.
  4. Klikkaa Tallenna.

Hakukäyttäytyminen

Verkkokauppa sisältää ennakoivan haun, joka näyttää ehdotuksia, kun asiakkaat alkavat kirjoittaa jotain hakukenttään. Hakuehdotukset auttavat asiakkaita muotoilemaan ja tarkentamaan hakukyselyjään, ja se on uudenlainen tapa tutustua verkkokauppaan. Ehdotusten avulla asiakkaat voivat myös selata osumia nopeasti ilman, että heidän tarvitsee poistua nykyiseltä sivulta nähdäkseen erillisen hakutulosluettelon.

Voit mukauttaa seuraavia haun asetuksia:

  • Ota hakuehdotukset käyttöön - Ota hakuehdotukset käyttöön tai poista ne käytöstä.
  • Näytä tuotteen myyjä - Näytä tai piilota tuotteiden myyjät hakuehdotuksissa.
  • Näytä tuotteen hinta - Näytä tai piilota tuotteiden hinnat hakuehdotuksissa.

Hakusyötteen asetusten muokkaaminen

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Hakusyöte
  3. Mukauta kauppasi hakukäyttäytymistä käyttämällä asetuksia.
  4. Klikkaa Tallenna.

Lisätietoja siitä, miten hakuehdotukset toimivat, saat tutustumalla kohtaan Ennakoiva haku.

Valuutan muoto

Voit valita, näytetäänkö tuotteissa, ostoskorissa ja kassan hinnoissa aina valuuttakoodit.

  1. Klikkaa teeman asetuksia.
  2. Klikkaa Valuutan muoto.
  3. Voit ottaa valuuttakoodit käyttöön klikkaamalla Näytä valuuttakoodit -valintaruutua.
  4. Klikkaa Tallenna.

Ostoskori

Voit muuttaa verkkokaupassasi ostoskorin tyyliä. Kun asiakas lisää tuotteen ostoskoriin verkkokaupassasi, ostoskori voi näkyä veto-ostoskorina, ostoskorisivuna tai ponnahdusikkunailmoituksena. Kun asiakkaan ostoskori on tyhjä, voit esitellä kokoelmia veto-ostoskorissa.

Vaiheet:

  1. Klikkaa Teeman asetukset > Kortti.
  2. Valitse ostoskorin tyyli pudotusvalikosta: veto-ostoskori, ostoskorisivu tai ponnahdusikkunailmoitus.
  3. Valinnainen: Jos haluat näyttää asiakkaan ostokorissa olevien tuotteiden myyjän, klikkaa Näytä myyjä.
  4. Valinnainen: Jos haluat, että asiakkaasi voivat esittää erikoispyyntöjä tai lisätä ylimääräisiä tilaustietoja, valitse Ota tilauskommentti käyttöön -vaihtoehto.

Jos ostoskorin tyypiksi on valittu Veto-ostoskori, voit näyttää kokoelman veto-ostoskorissa. Valittu kokoelma näkyy vain silloin, kun ostoskori on tyhjä.

Jos haluat lisätä tyhjään veto-ostoskoriin kokoelman, klikkaa Valitse kokoelma. Kun kokoelma on valittu, klikkaa Vaihda valitaksesi toisen kokoelman tai poistaaksesi kokoelman veto-ostoskorista. Voit myös luoda uuden kokoelman klikkaamalla Luo kokoelma. Tämä painike ohjaa sinut teeman asetuksista Shopify adminin Kokoelmat-alueelle.

Kassa

Tässä osassa voit mukauttaa kaupan kassaa. Lisätietoja kaupan kassasivusta on Shopify Checkout -paneelissa.

Vaihda teematyylit

Teeman tyyli on kokoelma teemojen suunnittelijan valitsemia asetuksia. Voit käyttää teeman tyylejä kaupassasi, jolloin kauppasi ilme ja tyyli on viimeistelty. Teeman tyyliä käytetään oletuksena kaikissa teemoissa. Kun mukautat teemaa, korvaat teeman tyyliasetukset omilla asetuksillasi. Jos käytät teemassa teeman tyyliä, nykyiset asetukset, kuten värit ja typografia, muuttuvat.

Vaiheet:

  1. Klikkaa Teeman asetukset > Tyylit.

  2. Valitse teeman tyylivaihtoehdot pudotusvalikkojen avulla. Käytettävissä olevat vaihtoehdot riippuvat siitä, mitä teemaa käytät.

  3. Klikkaa Tallenna.

Kumoa muutokset ja tee ne uudelleen

Kumoa-painike peruuttaa viimeisimmän muutoksen, ja Tee uudestaan ‑painike palauttaa kumoamasi muutoksen. Kun klikkaat Kumoa-painiketta useammin kuin kerran, tekemäsi muutokset kumotaan yksi kerrallaan. Kumoa- ja Tee uudestaan -painikkeet sijaitsevat teemaeditorin työkalupalkissa.

Teemaeditorin työkalupalkin Kumoa- ja Toista-painikkeet

Klikkaa Kumoa-painiketta, kun haluat peruuttaa seuraavat muutokset:

  • osioiden lisääminen, uudelleenjärjestäminen ja poistaminen
  • värien, fonttien ja muiden asetusten muuttaminen Teeman asetukset -välilehdellä
  • teeman tyylin nollaaminen.

Valmiina aloittamaan Shopifyssa?

Kokeile ilmaiseksi