Page builder sivun tekeminen

Perussivun tekeminen page builderilla

Luo sivu kohdasta Sisältö - > Elementit → Sivut → Lisää uusi sivu

Anna sivulle otsikko ja avaa page builder sisältä osion alta, joko klikkaamalla sisältöosiota tai oikean reunan Edit with page builder - painiketta

Siirrä ensin rivi työkaluosiosta tyhjälle mallisivulle

Rivin asetuksia voit muokata, kun viet pop-upin rivin päälle saat rivin pop-up ikkunan ja rattaaan kuvasta pääset muokkaamaan asetuksia. Rivin asetuksien muokkauksen ohjeet täällä (tähän tulee linkki)

Vedä banneri Media- työkalusoiosta rivin sisään

Vie hiiri vetämäsi banner elementin päälle, jolloin näet työkalurivi pop-upin. Rattaan kuvasta pääset muokkaamaan bannerin asetuksia mieleiseksi. Asetuksista ohjeet voit katsoa täältä Bannerin asetukset.

Jos valitset esimerkiksi Ulkoasu-kohdasta Collage Right, niin se  sijoittaa sisällön bannerin oikealle puolelle.

Asetusten muokkauksen jälkeen tallenna asetukset ja palaat työtilaan.

Valitsemasi banneri näkyy työtilassa ja valitsemiesi asetusten mukaisesti esim. koko rivin leveydeltä.

Bannerissa valittiin ulkoasu asetuksista Collage right joten bannerin teksti näkyy rivin oikeassa reunassa. 

Napsauta kyseistä kohtaa niin pääset kirjoittamaan siihen haluamasi tekstin. Tekstiä voit muokata tekstieditor -työkalulla suoraan työtilassa tai vaihtoehtoisesti bannerin asetuksista.

Lisätään seuraavaksi kaksi kuvaa bannerin alle.
Lisätään taas rivi vasemmalta työkalulaatikosta ja rivin lisäämisen jälkeen vedetään sarakkeet rivin päälle. Rivi jaetaan kolumnilla
kahteen eri sarakkeeseen, joita molempia voi muokata sarakkeen asetuksista



Lisää kuva sarakkeeseen vasemman puolen työkaluriviltä median alta.


Kun viet hiiren kuvaosion päälle tulee esiin myös kuvalle omat asetukset

Kuvan asetuksista voit esim. linkittää kuvan haluamaasi paikkaan. Muita asetuksia voit katsoa täältä: Kuva elementin asetukset.


Voit lisätä sivulle myös tuotenoston lisäämällä ensin rivin ja vetämällä Add content osiosta Products elementin rivin päälle.




Products osioon on myös omat asetukset, jotka löydät täältä: Tuotenoston asetukset.
(pop-upin saa esiin viemällä hiiren osion päälle) jotka löydät täältä. Asetuksissa voit valita miten tuotteet näytetään, paljonko niitä näytetään yms.

Voit myös lisätä vielä erillisen tekstiosion sivun loppuun. 

Kun sivu on valmis niin tallenna se Save as template ja anna sille nimi ja tallenna.

Työtilan oikeasta yläkulmasta kohdasta voit sulkea työtilan. Sivua voit esikatsella View Frontend näkymästä.

Jos sivu ei miellytä niin voit palata muokkaamaan asetuksia Edit with page builder - kohdasta. Muutoksen jälkeen tallenna ja ja odota, että tallennus on tehty ennenkuin päivität tekemääsi sivua asiakasnäkymässä.