VilkasVanilla -teema on selkeä responsiivinen teema ilman perinteisiä sivupalkkeja. Jos olet asentanut Vilkas Vanilla -teeman kauppaasi, niin alta löytyy sen kuvausta ja ohjeita.
Vilkas Vanilla -teema on poistunut käytöstä
Tämä teema ei enää täytä kaikkia nykyaikaisten teemojen vaatimuksia ja sitä ei saa enää otettua käyttöön. Alta löydät vielä sen ohjeita, jos teema on vielä käytössä kaupassasi.
Tämän teeman virallinen tuki on loppunut, joka tarkoittaa, että sen mahdollisia ongelmia ei enää korjata normaalina ylläpitotyönä tai tukena. Jos teemaan halutaan vielä muokkauksia tai korjauksia, niin tämä on mahdollista maksullisena kustomointityönä.Jos etsit uuttaa teemaa kauppaasi, niin täältä löydät kaikki Suite-kauppojen teemat
https://www.vilkas.fi/tuki/suite/tuki/teemakauppaJos haluat korjauksia tai muokkauksia tähän teemaan, niin ota yhteyttä asiantuntijoihimme.
Ylätunniste 2 -aluetta, jossa on kaupan logo, hakukenttä ja ostoskorin elementti ei kannata muokata kuin muokkaamalla logo-elementtiin oma logo esimerkin tilalle. Vaikka isolla näytöllä ylätunnisteissa näyttäisi olevan tyhjää tilaa, niin jos tälle alueelle lisää tai vaihtaa elementtejä, ne eivät välttämättä enää toimi responsiivisesti ja mahdu nätisti mobiililaitteen näytölle.
Mobiilinäkymässä ylaosa on kompakti ja tuoteryhmävalikko avautuu hampurilaiskuvakkeen alta. Päätuoteryhmää painamalla avautuu 2. ja 3. tason alstuoteryhmät näkyviin.
Käyttöönotto
Saat lisättyä teeman kauppaasi seuraavasti...
1) Lataa teema tästä omalle koneellesi
2) Kaupan hallinnassa kohdassa Ulkoasu > Omat teemat napsauta alareunasta "Tuo teema" -nappia ja valitse teematidosto.
3) Valitse "Korvaa etusivun sisältö" jos haluat, että teeman etusivun esimerkkisisältö tuodaan myös kauppaan. Huomaathan, että se korvaa kaupan etusivun sisällöt. (Kopioi tarvittaessa omat sisällöt turvaan kohdasta Sisältö/Tuoteryhmät > Lomakenäkymä > Yleinen.
Huom! Itse teema sisältää vain värit, fontit ja asettelun. Kaikki sisältö on samaa sisältöä kuin muillakin teemoilla. Poislukien ylä- ja alapalkkien sisällöt, niissä on esimerkkinä palvelulupauksia ja some-ikoneita yms. Vilkas Vanilla -teemassa etusivulle tulee sisältö seuraavasti:
- Banneri, joka muodostetaan taustakuvasta (Sisältö/Tuoteryhmät > Lomakenäkymä > Kuvat) sekä sen päälle tulevasta tekstistä (Etusivun ensimmäinen "Pitkä kuvaus" kenttä).
- Bannerin alla on "Pitkä kuvaus (2)" johon voi laittaa esimerkiksi otsikon tuotelistalle. Demokaupassa siinä on "suosituimmat tuotteet", mutta siinä voi lukea mitä vaan.
- Kolmantena on tuotelista, tuotteet lisätään Sisältö/Tuoteryhmät > Lomakenäkymä > Tuotteet -sivulla
- Tuotelistan alle tulee "Pitkä kuvaus (3)" kentän sisältö. Tähän on hyvä laittaa tekstiä, johon on sisällytetty tärkeimpiä avainsanoja hakukonenäkyvyyden parantamiseksi. Lisäksi siinä voi olla vaikka sosiaalisen median syötteitä upotettuna. Esimerkiksi instagramin syötteen saa mm. Lightwidget.com palvelun kautta.
- Viimeinen "Pitkä kuvaus (4)" saa jäädä tyhjäksi, sen sisältöä ei näytetä tämän teeman asettelulla.
Alatunnisteen linkit "Info" ja "Some" ovat yhdessä html-elementissä bullet-listana.
4) Kun teema on ladattu kauppaan, niin se löytyy kohdasta Ulkoasu > Omat teemat listasta alimmaisena. Siellä sitä voi tarkastella, muokata ja/tai ottaa käyttöön kaupan aktiiviseksi teemaksi.
Jos uutta teemaa halutaan testata vain kohdassa Ulkoasu > Omat teemat ottamatta sitä käyttöön kaupan asiakaspuolelle, niin tällöin kaupan Head-alueelta voidaan siirtää ulkoasukoodit nykyisen kaupan teeman ulkoasun elementtiin. Eli kaupan alatunnisteeseen voi lisätä "Testi(HTML)"-elementin ja kopioida kohdassa Asetukset > Yleiset asetukset > Lisäasetukset > HTML-koodin Head-alue olevat koodit sinne. Tällöin ne vaikuttavat vain kyseisen teeman ulkoasuun ja taustalla voi helpommin testata muita teemoja.
Suositellut asetukset
Tässä listattuna asetuksia sivujen ja tuotteiden asetteluihin. Teema on suunniteltu toimimaan tiettyjen asetuksien kanssa ja ei välttämättä näytä hyvältä kaikilla muilla asetteluilla.
1) Kohdassa Sisältö/Tuoteryhmät > Lomakenäkymä > Asettelu vaihda etusivun tekstin asetukseksi valinta, jossa on kuva ja kolme tekstikenttää:
2) Kohdassa Sisältö/Tuoteryhmät > Lomakenäkymä > Kuvat lataa toiseen kuvakenttään etusivun isoksi kuvaksi oma kuva. Saat ladattua kuvan ilman, että kauppa pienentää sitä automaattisesti ottamalla ensin pois ruksin kohdasta "Muuta kokoa latauksen yhteydessä". Suositeltu kuvakoko mitoiltaan on noin 1500x500px.
3) Etusivun sisällöistä "Pitkä kuvaus" kenttä on teemassa otettu kuvan päälle tulevan tekstin käyttöön. Otsikkotaso 2 muotoilulla teksti tulee ison bannerikuvan päälle esimerkin mukaisella erityismuotoilulla ja Pitkä kuvaus -kenttään lisätty linkki tulee näkyviin nappina. Pitkä kuvaus 2 kenttään laitettu sisältö näkyy sitten bannerikuvan alapuolella.
4) Kohdassa Asetukset > Yleiset asetukset aseta Mobiilinäkymä: Älä käytä. Koska teema on responsiivinen, niin erillistä mobiilinäkymää ei tarvita.
5) Tuotekuvien zoomaustoiminnallisuus kannattaa asettaa pois kohdassa Tuotteet > Tuoteasetukset > Käytä tuotekuvien zoomaustoimintoa: Ei
Ulkoasun viimeistely
Viimeistele ulkoasusi Ulkoasu > Ulkoasun yksityiskohtainen muokkaus -sivulla (ennemmin yksityiskohtainen muokkaus kuin pikamuokkaus). Lisää vasempaan yläkulmaan oma palvelulupauksesi teemassa olevan esimerkin "Ilmainen toimitus yli 100€ tilauksiin | Toimitukset 1-3 arkipäivässä" mukaisesti. Lisää alatunnisteeseen oikeat some- ja maksupalvelukuvakkeet ja tarvittavat linkit.
Säädä ylätunnisteen ja muiden alueiden taustavärit sekä tekstien ja linkkien värit sopimaan brändisi ilmeeseen. Huomaa, että ulkoasu ei näytä editorissa kaikilta osin samalta kuin asiakkaiden näkymässä, joten tarkista muutosten jälkeen miltä kauppa näyttää asiakkaiden näkymässä.
Muokkasin teemaa ja nyt se ei toimi enää responsiivisesti
Jos teet muutoksia teeman elementteihin, niin sitä ennen kannattaa tehdä varmuuskopio teemasta kohdassa Ulkoasu > Omat teemat. Jos muokatessa teeman responsiivisuus rikkoutuu, niin tällöin on helppo palata aina aiempaan tilanteeseen. Teematiedoston voi myös ladata uudelleen kauppaan.
Ulkoasun päivittäminen palveluna
Jos olet kasvattamassa kauppasi näkyvyyttä ja liiketoimintaa, niin ulkoasu kannattaa ehdottomasti myös muistaa osana kokonaisuutta. Se on asiakkaillesi näkyvä osa verkokkauppaasi ja brändiäsi. Vilkas Suite verkkokauppoihin on saatavilla juuri sinun tarpeittesi mukainen ulkoasu ammattilaisten toteuttamana.
Ole yhteydessä, niin laitetaan uudistus käyntiin. Vilkkaan suunnittelijoilla on vuosien kokemus ja näkemys mikä toimii ja myy.
Versio 1.6 - Tuotteen vaihtoehtojen esittäminen taulukkomuodossa mobiilissa nyt käytettävämpi. Taulukkoa pystyy vierittämään sivulle, että kaikki sarakket saa näkyviin hyvin. (10-2018)
Versio 1.61 - Klarna Checkout popup-ikkunan asettelu korjattu (02-2019)
Versio 1.62 - Teeman tyylitiedostot ladataan jatkossa keskitetysti Vilkkaan CDN-palvelimelta, eikä verkkokaupan tiedostonhallinnasta. Mahdollistaa teeman päivitysten asentamisen keskitetysti. (03-2019)
Versio 1.62 - Ale-merkintää ei lisätä tuotesivulla, jos vertailuhinta on sama tai pienempi kuin myyntihinta (05-2020)
Uudemman version päivittäminen kauppaan: Tuo päivitetty .theme tiedosto Ulkoasu > Omat teemat -sivulla. Tuonti päivittää teeman css & java script -tiedostot. Uutta teemaa ei siis tarvitse aktivoida, vaan päivitykset tulevat aiemmin asennettuihin versioihinkin.