Air teemaan on tuotu raikasta ulkonäköä, vaihtoehtoja asetteluun ja pieniä korjauksia aiemmissa teemoissa ilmenneisiin haasteisiin. Myös verkkokaupan sisäinen blogi on saanut kasvojenkohotuksen!
Raikas ulkonäkö
Vilkas Air on nimensä mukaisesti ilmava ja kevyen tyylikäs ulkoasuteema, jonka avulla luot helposti modernin ilmeen kauppaasi. Yksityiskohdat on hiottu nykyaikaisiksi, ja näytöllä paljon tilaa vievät elementit on pyritty piilottamaan esimerkiksi kuvaavien ikonien taakse.
- MODERNIT IKONIT - Uusimmat Font Awesome -ikonit ovat kevyen tyylikkäitä. Uusia ikoneita voi teemassa bongata esimerkiksi ostoskorin ja hakupalkin kuvakkeista.
- HAKUPALKKI - Aiemmissa teemoissa hakupalkki on ollut koko ajan näkyvillä kaupan ylä- tai alareunassa. Vilkas Airissa hakupalkki aukeaa ikonia klikattaessa eikä suotta vie tilaa ruudulta silloin, kun sitä ei tarvita.
- TUOTESIVU - Tuotteen pitkä kuvaus näkyy teemassa tuotesivulla siististi hinnan alapuolella, tuotekuvan vieressä. Monessa aiemmassa teemassa pitkä kuvaus näkyy koko sivun levyisenä tuotekuvan alapuolella.
- BLOGI - Verkkokaupan sisäisen blogin ulkomuotoa on paranneltu roimasti. Nyt blogi oikeasti näyttää blogilta ja tekstien selaileminen on helpompaa.
Vaihtoehtoiset asettelut
Joskus suunnitelma kaupan ulkoasusta muuttuu teeman valitsemisen jälkeen. Tai ehkä haluat vain kokeilla, miltä erilaiset asettelut näyttäisivät käytännössä. Myös tuotekategorioiden lisääntyessä saattaa tulla ajankohtaiseksi tarkastella uudelleen verkkokaupan asettelua. Tällöin on kätevää, että suurehkojakin rakenteellisia muutoksia voi tehdä verkkokauppaan teemaa vaihtamatta.
- SIVUPALKIT - Vilkas Airissa sivupalkit saa näkyviin joko sivun vasemmassa tai oikeassa reunassa, kummassakin tai ei kummassakaan. Pienellä näytöllä, kuten älypuhelimessa, esille asetetut sivupalkit piiloutuvat ikonin taakse.
- VALIKKO - Verkkokaupan valikon eli menun voi Vilkas Airissa siirtää mihin tahansa kohtaan headerissa eli ylätunnisteessa verkkokaupan yläreunassa. Mobiilissa menu asettuu hampurilaisvalikon taakse. Jos kaupassa on paljon kategorioita, voi megamenun laittaa erilliseen logon alapuolella olevaan ylätunnisteeseen. Jos kaupassa taas on vain muutama kategoria, megamenu voidaan sijoittaa esimerkiksi logon ja hakuikonin väliin samaan ylätunnisteeseen.
Parannuksia vanhaan
Lisäksi Vilkas Airissa on paranneltu ja korjailtu elementtejä, jotka joissain aiemmissa teemoissa esimerkiksi asettuvat tietyissä yhdistelmissä hassusti.
- TUOTELISTAUS - Tuotelistausta on korjattu niin, ettei asettelu rikkoonnu, vaikka kuvia ei olisi rajannut keskenään saman kokoisiksi. Tuotteet siis pysyvät nätissä rivissä kaikilla kuvako’oilla.
- HAKUPALKKI - Hakupalkki sisältöineen pysyy nyt paikoillaan myös mobiilissa eikä hypi muiden elementtien päälle.
Air on responsiivinen teema verkkokaupalle, joka on asennettavissa verkkokaupan ylläpidosta. Air-teemaa voidaan muokata muita teemoja vapaammin joissa on oletettu tiettyjä asettelumalleja.
Air-teema on helppo asentaa verkkokaupan ylläpidosta Ulkoasu > Omat teemat -sivun alalaidasta valitsemalla "Lisää uusi teema"
Kun teema on asennettu, sitä voidaan muokata taustalla "Ulkoasun yksityiskohtainen muokkaus" toiminnolla. Voit muuttaa värejä, taustakuvia ja luoda uusia sivuelementtejä. Huomaa, että muokkauksessa asettelu saattaa poiketa hieman siitä, miltä se tulee näyttämään asiakaspuolella. Kannattaa siis tarkistaa lopputulos esikatselupainikkeella.
Jos kauppaan on lisätty edellisen teeman aikana CSS- tai Java script -koodia, ne voivat vaikuttaa uuden teeman toimintaan. Tarkista Asetukset > Yleiset asetukset > Lisäasetukset -sivun kenttä "HTML-koodin Head-alue" ja poista tarvittaessa tarpeeton koodi. Vanha muotoilukoodi voidaan myös siirtää vanhan teeman alle HTML-elementtiin ulkoasun yksityiskohtaisessa muokkauksessa, jolloin se säilyy tallessa eikä haittaa uuden teeman toimintaa.
Responsiivisuus ja mobiilinäkymä
Vilkas Air teema on responsiivinen teema, joten se mukautuu eri kokoisiin näyttöihin automaattisesti.
Jotta teema on käytössä myös mobiililaitteilla, ota erillinen mobiilinäkymä pois päältä asetuksella Asetukset > Yleiset asetukset > Mobiilinäkymä: Älä käytä.
Huomaathan, että responsiivisuus on teemassa rakennettu sen suunnitellulle rakenteelle, joten jos muokkaat ulkoasun sivujen rakennetta tai vaihdat eri elementtien kuten hakukentän ja ostoskori-elementin paikkaa, niin muista testata sivujen toiminta myös mobiilissa. Jos haluat muokata sivujen rakennetta siten, että teeman responsiivisuus kärsii, niin voit ottaa erillisen mobiilinäkymän käyttöön asettamalla Asetukset > Yleiset asetukset > Mobiilinäkymä: Optimoitu mobiilikaupalle.
Ulkoasun päivittäminen palveluna
Ulkoasu on näkyvä osa verkokkauppaasi ja brändiäsi. Vilkkaan suunnittelijoilla on vuosien kokemus ja näkemys mikä toimii ja myy.