Karusellin asetukset
- Johanna Lintala
Karusellin (slider) asetukset
Karusellin yleiset asetukset
Autoplay: Jos haluat, että karuselli käynnistyy, kun sivu latautuu aseta Autoplay: Kyllä ja aseta Autoplay speed millisekunttien määrä diojen välisessä viiveessä.
Määrittele minimikorkeus karusellille
Autoplay speed: Oletuksena nopeus on 4000ms, mikä on 4 sekuntia. Jos määrität asetuksen Ei niin ensimmäinen dia tulee näkyviin oletusarvoisesti ja asiakkaan on napsautettava navigointia nähdäkseen seuraavat kuvat.
Fade: Tasoittaaksesi siirtymää kuvasta toiseen niin aseta Fade: kyllä. Häivytyksen myötä kuvat näyttävät pysyvän paikoillaan, mutta sisältä vaihtuu sujuvasti kuvasta toiseen. Ilman häivytystä näet vaakasuuntaisen liikkeen kuvasta toiseen.
Infinite loop: Jos haluat saada kuvaesityksen toistumaan loputtomasti, kun sivu on auki niin valitse: Kyllä.
Show arrows: Jos haluat näyttää Seuraava- ja Edellinen - nuolet jokaisen kuvan vasemmalla ja oikealla puolella niin valitse Kyllä.
Show dots: Jos haluat näyttää joukon navigointipisteitä kuvaesityksen alaosassa valitse Kyllä.
Margins and padding
Nämä määritykset tulevat samalla tavalla työpöytä- ja mobiilinäkymiin eikä niitä voi erikseen muuttaa per näkymä page builderin avulla.
Margins Sisällön osion kaikkien sivujen ulkoreunoihin lisätään tyhjää tilaa annetun määrän mukaan. Voit valita erikseen ylhäälle, oikealle, alas ja vasemmalle.
Padding Sisällön osion kaikkien sivujen sisäreunaan lisätään tyhjää tilaa annetun määrän mukaan. Voit valita erikseen ylhäälle, oikealle, alas ja vasemmalle.
Jokaisella karusellin kuvalla on omat asetukset. Ne näkyy, kun vie hiiren esimerkiksi karusellin alareunassa olevan pisteen päälle.
Appearance /ulkomuodon vaihtoehdot
Poster: keskittää dian sisällön liukusäätimeen. Jos peittokuvaa käytetään, se laajentaa liukusääätimen koko leveyteen.
Collage left: Sijoittaa dian sisällön määritellylle alueelle liukusäätimen osion vasemmalle puolelle. Jos peittokuva on käytössä, se kattaa vain määritellyn alueen.
Collage center: Sijoittaa dian sisällön määritellylle alueelle, joka on keskitetty liukusäätimen osioon. Jos peittokuva on käytössä, se kattaa vain määritellyn alueen.
Collage right: Sijoittaa dian sisällön määritellylle alueelle liukusäätimen oikealle puolelle. Jos peittokuva on käytössä, se kattaa vain määritellyn alueen.
Anna dian nimi. Kun työskentelet muokkaustilassa dian nimi näkyy navigointipisteen yläpuolella. Dian nimi ei näy asiakasnäkymässä.
Anna dialle vähimmäiskorkeus. Vähimmäiskorkeus voi olla luku millä tahansa kelvollisella CSS - yksiköllä (kuten 100px, 50%, 50em, 100vh tai laskelma kuten 100vh - 237px.) Voit asettaa dian vähimmäiskorkeuden peittämään sivun koko korkeuden ja sitten käyttää taustakuvia ja videoita houkutteleviin vaihtoehtoihin.
Backround /Tausta. Rivin taustaan voit määrittää monia vaihtoehtoja. Voit käyttää yksinkertaista väriä tai taustakuvaa ja lisätä muita tehosteita.
Backround color asetuksella määrität taustavärin riville. Mikäli et halua väriä voit jättää valinnan No color.
Napauttamalla värivalitsinta voit antaa värin nimen, tai heksadesimaaliarvon. Voit myös säätää värin peittävyyttä tässä kohtaa.
Eri arvoja on:
Ennalta määritetty värin nimi esim. white
Heksadesimaaliväriarvo esim. #ffffff
Värin rgba- arvo ja peittävyysprosentti esim. rgba (255,255,255,0,75)
Backround type kohdassa voit valita ladataanko taustalle kuva vaiko video.
Kuvan lisäämisen ohjeet.
Voit lisätä työpöytänäkymään ja mobiilinäkymään omat kuvat. Kuvan maksimikoko on 2mb. Ja tiedostomuoto JPG, GIF tai PNG.
Backround size: Valitse tästä miten taustakuva skaalataan suhteessa rivin leveyteen
Cover: Taustakuva peittää rivin koko leveyden
Contain: Taustakuva on rajoitettu sisällön leveyteen
Auto: Käyttää valitun tyylisivun kokoa
Backround position valinnat:
Top Left/Ylävasen, Top center/ Ylhäällä keskellä ja Top right/yläoikea.
Center left/keskitetty vasemmalle, Keskitetty, Center right/ keskitetty oikealle
Bottom left/alavasen, Bottom center/alhaalla keskellä ja bottom rigth/ alaoikea
Backround attachment: Aseta liitteen tyyppi määrittääksesi miten taustakuva liikkuu suhteessa vieritettävään sivuun.
Scroll: Liitteenä oleva taustakuva synkronoidaan siirtymään alaspäin sivun vieriessä. Käytä parallax backroundia vieritysnopeuden säätämiseen
Kiinteä: Taustakuva ei liiku, kun osio vierii kuvan päällä ja se on kiinnitetty määritettyyn taustakuvaan (ei saatavilla mobiililaitteille).
Backround repeat: Valitse kyllä, jos haluat toistaa taustakuvan rivin tyhjän tilan täyttämiseksi
Backround type Video
Tässä videon lisäämisen ohjeet Jos valitset videon sinun tulee lisätä video url - kohtaan missä osoitteesta video noudetaan.
Overlay color kohdasta voit halutessasi lisätä videoon läpinäkyvän sävyn.
Infinite loop kohdasta voit valita Ei, jos haluat, että video toistetaan kerran ja lopetetaan. Jos valitset kyllä (oletus) video toistuu koko ajan.
Lady load Aseta arvoksi Ei, jos haluat, että video latautuu sivulle vaikka se ei olisi näkyvissä. Kun asetus on kyllä (oletus) video latautuu url:n takaa vain, kun se valitaan.
Play only when visible Valitse Ei, jos haluat videon toistuvan heti latauksen jälkeen riippumatta siitä onko se näkyvissä. Kun asetus on kyllä (oletus) videon toisto alkaa vain, kun sen on näkyvissä.
Fallback Image voit määritellä kuvan, joka näytetään näytöllä ennen videon latautumista ja jos video ei jostain syystä lataudu.
Bannerin teksti. Voit lisätä ja muokata bannerin tekstiä, Helpointa se on tehdä työtilassa teksti editorin avulla.
Bannerin voit linkittää haluttuun paikkaan
Osoite: Haluamallesi verkkosivulle
Tuote: Haluamaasi tuotteeseen verkkokaupassa
Kategoria: Haluamaasi kategoriaan verkkokaupassa
Sivu: Haluamallesi sivulle verkkokaupassa
Voit määritellä näytetäänkö bannerissa painike.
Never show: Ei näytetä
On hover Kun viedään hiiri bannerin päälle
Aina: Painike on koko ajan näkyvissä
Button textiin voit kirjoittaa painikkeen tekstin, kun Show button valinta on "on show" tai "aina".
Button type:
Primary. Käyttää ensisijaiset nykyisen tyylisivun tyyliä
Secondary: Käytää toissijaista painiketyyliä nykyiselta tyylisivulta, jos mahdollista
Linkki: Luo hyperlinkin painikkeen sijaan
Show overlay: Näytä peittoväri
Aina: On aina näkyvissä
On hover: Näkyy vain, kun hiiri viedään painikkeen päälle
Never show: Ei näytetä
Overlay Color:
Voit käyttää peittokuvaa taustavärin lisäämiseen tekstialueelle.
Hakukoneoptimointiin
Alternative text: Vaihtoehtoinen tekstikuvaus
Title attribute: Kirjoita teksti, joka näytetään, kun hiiri viedään kuvan päälle.
Lisäasetukset
Aligment/Tasaus: Voit määrittää riville lisättyjen sisältöosioiden vaakasuoraa sijaintia .
Default: Käyttää oletusaseusta, joka on määritetty nykyisen teeman tyylisivulla
Left: Tasaa sisältöosiot riviosion vasempaan reunaan ottaen huomioon kaikki määritetyt sisällöt.
Center: Tasaa sisältöosiot riviosion keskelle määritetyn sisällön mukaan.
Right: Tasaa sisältöosiot oikeaan reunaan siten, että kaikki määritellyt sisällöt otetaan huomioon
Border: Aseta reunuksentyyli, jota käytetään riviosion ympärillä.
Default/ Oletus: Käyttää oletusreunustyyliä, joka on määritelty tyylisivuilla.
None/ Ei mikään: Ei ole reunusta näkyvillä
Dotted: Reunus näkyy katkoviivana
Dashed: Reunus näkyy katkoviivana
Solid: Reunus näkyy yhtenäisenä viivana
Double: Reunus näkyy kaksoisviivana
Groove: Reunus näkyy uritettuna viivana
Ridge: Reuna näkyy uurteisena viivana
Inset: Reunus näkyy upotettuna rivinä
Outset: Reunus näkyy aloitusviivana
Border color Jos valitset reunukselle tyyliksi muun kuin No Color niin täydennä reunuksen näyttöasetukset samoin, kuin taustan väriasetuksissa.
Border width Syötä reunaviivan leveys pikseleinä
Border radius Syötä pikselimäärä määrittääksesi koko, jota käytetään reunan jokaisen kulman pyöristämiseen
(ei pakollinen) Määritä nykyisen tyylisivun CSS - luokkien nimet, joita käytetään riviosiossa. Erota useat luokan nimet välilyönnillä.
Margins and padding
Nämä määritykset tulevat samalla tavalla työpöytä- ja mobiilinäkymiin eikä niitä voi erikseen muuttaa per näkymä page builderin avulla.
Margins Sisällön osion kaikkien sivujen ulkoreunoihin lisätään tyhjää tilaa annetun määrän mukaan. Voit valita erikseen ylhäälle, oikealle, alas ja vasemmalle.
Padding Sisällön osion kaikkien sivujen sisäreunaan lisätään tyhjää tilaa annetun määrän mukaan. Voit valita erikseen ylhäälle, oikealle, alas ja vasemmalle.