Ulkoasun muokkaus

Kun olet luonut itsellesi kotisivut, voit aloittaa ulkoasun yksityiskohtaisemman räätälöimisen. Kotisivukone tarjoaa helppokäyttöisen tavan muokata ulkoasua, jonka avulla saat sivujen ulkoasusta mieleisesi. Lisäksi kokeneemmat käyttäjät voivat muokata sivujen ulkoasua suoraan CSS –tyylimäärittelyiden avulla.

Avaa ulkoasun muokkaus klikkaamalla ylläpitosivuilla yläreunasta ”Muokkaa ulkoasua” –linkkiä. Pääset muokkaamaan ulkoasua myös viemällä hiiren yläpalkin päälle ja klikkaamalla vasemman yläkulman ikonia. 

Ulkoasun muokkaus avautuu alareunaan avaten oman työkalupalkin. Tästä palkista voit valita mitä ulkoasuelementtejä kulloinkin muokataan. 

Pikalinkit:

Sivupohjan valinta
Yläpalkki
Tekstityylit
Taustakuva ja -väri
Sivun asetukset
Lisäasetukset

Sivupohjan valinta

Jos haluat vaihtaa sivupohjaa, sinun tulee ottaa käyttöön uusi ulkoasun muokkaus.

Yläpalkki

Voit valita yläpalkkikirjastosta haluamasi yläpalkkikuvan. Näet välittömästi kuinka uusi yläpalkki vaikuttaa sivujesi ulkoasuun.

Yläpalkkia voit vaihtaa avaamalla ”Yläpalkki” –työkalun. Voit poistaa yläpalkkikuvan kokonaan tai valita uuden yläpalkkikirjastosta. Voit myös lähettää oman yläpalkkikuvan tietokoneeltasi.

Kuvan toisto
Jos valitsemasi yläpalkkikuva on kapeampi kuin kotisivujesi leveys, voit asettaa kuvalle toiston. Näin yläpalkkikuva toistuu joko pysty, vaaka tai molemmissa suunnissa koko yläpalkin leveydeltä ja korkeudelta. Sopivalla kuvalla toisto –toiminnolla saa toteutettua tyylikkäitä yläpalkkeja.

Voit määritellä myös yläpalkin korkeuden, jolloin ohjelma automaattisesti piilottaa ylisuuren yläpalkkikuvan. Voit myös halutessasi piilottaa koko yläpalkin pois näkyvistä.

Yläpalkin valinta kuvakirjastosta
Kotisivukone tarjoaa laajan valikoiman erilaisia yläpalkkeja eri aihealueista. Voit valita haluamasi yläpalkkikuvan kuvakirjastosta klikkaamalla ”Valitse kuva kirjastosta” –linkkiä. Nyt auenneesta kuvakirjastosta voit valita haluamasi yläpalkin ja voit heti esikatsella miltä kyseinen yläpalkkikuva näyttää omilla kotisivuillasi. Hyväksy valinta sivun alareunan painikkeella.

Oman yläpalkin lisääminen
Voit myös lisätä sivuille oman yläpalkin klikkaamalla ”Lisää oma yläpalkki” –linkkiä. Nyt ruudulle aukeaa Kotisivukoneen tiedostoselain, josta voit valita haluamasi kuvan yläpalkiksi. Tiedostoselaimeen voit lähettää kuvia omalta tietokoneeltasi.

Oman yläpalkkikuvan lisäämisessä tulee huomioida, että yläpalkkikuva täyttää seuraavat kriteerit:

• kuvan tulee olla .jpg .gif tai .png muodossa. Vältä .bmp muotoisia kuvia
• tiedoston tai kansion nimessä ei saa olla internetiin sopimattomia merkkejä, esimerkiksi ä, ö, pilkku tai tyhjä väli.
• yläpalkkikuvan tiedostokokoon kannattaa kiinnittää huomiota. Liian raskaat kuvat latautuvat hitaasti. Yli 100 kt kokoiset yläpalkkikuvat ovat jo pääsääntöisesti varsin raskaita.
• yläpalkin tulee normaalitapauksissa olla suhteellisen matala ja leveä kuva. Kuva pitää käsitellä oikean kokoiseksi. Kotisivukoneen tarjoamat yläpalkkikuvat ovat 900x230 pikselin kokoisia (leveys 900 ja korkeus 230). Koko voi tosin olla muutakin. Jos kuva on kapeampi kuin kotisivujen leveys, tulee käyttää ”Toista” –toimintoa, joka toistaa kuvaa vaaka- ja/tai pystysuunnassa.

Kuinka saan yrityksen nimen ja logon yläpalkin päälle?
Jos haluat lisätä esimerkiksi yrityksesi nimen yläpalkin päälle, se onnistuu helposti kotisivujen ylläpitotilassa yläpalkin kulmaan ilmestyvän plus -ikonin kautta.

Logon lisääminen yläpalkkiin
Valitse yläpalkkiin haluttu kuva tiedostoselaimesta. Logon tulisi olla valmiiksi pienennetty oikeaan kokoon. Suositeltu koko on noin 200x100 pikseliä. Logon lisäämisen jälkeen voit siirtää sen haluamaasi paikkaan raahaamalla sitä hiiren nappi pohjassa nuoli-ikonin kohdalta.

Tekstin lisääminen yläpalkkiin
Kirjoita haluamasi teksti tekstikenttään. Voit muokata tekstin kokoa ja väriä. Myös tekstin sijaintia voi siirtää raahaamalla sitä hiiren nappi pohjassa nuoli-ikonin kohdalta. Vahvista lopuksi tekemäsi muutokset Tallenna painikkeesta.

Huom! Muutokset astuvat voimaan vasta kun klikkaat “Tallenna” -painiketta. Jos muutokset eivät näy heti, paina Ulkoasueditorista poistumisen jälkeen F5 –näppäintä, jotta selaimesi päivittää sivun uudelleen. 

Tekstityylit

Tekstityylien muokkaus.

Voit muokata sivun tekstityylejä avaamalla ”Tekstityylit” –työkalun. Valitse ensin muokattava tekstityyli, esimerkiksi ”Päävalikko” tai ”Sisältöalueen otsikot”. Kirjasimen tyyppi –valikosta voit määritellä haluamasi kirjasimen. Internet-sivuilla ei useinkaan käytetä erikoiskirjasimia, sillä sivujen lukijan koneessa on oltava samat kirjasimet asennettuina. Siksi kannattaakin pitäytyä oletuskirjasimissa. Voit myös muokata kirjasimen kokoa ja väriä.

Näet reaaliaikaisesti kuinka tekemäsi muutokset vaikuttavat sivujen ulkoasuun.

Lisäasetukset –linkistä saat vielä käyttöösi harvemmin tarvittuja tehostuskeinoja, kuten lihavoinnit ja tekstin korostuksen.

Huom! Muutokset astuvat voimaan vasta kun klikkaat “Tallenna” -painiketta. Jos muutokset eivät näy heti, paina Ulkoasueditorista poistumisen jälkeen F5 –näppäintä, jotta selaimesi päivittää sivun uudelleen. 

Taustakuva ja -väri

Taustakuvan vaihtaminen.

Taustakuvaa voit vaihtaa avaamalla ”Taustakuva ja –väri” –työkalun. Taustakuva koostuu joko pelkästä taustaväristä, taustakuvasta tai näistä molemmista.

Valitse haluamasi taustakuva kuvakirjastosta klikkaamalla ”Valitse kuva kirjastosta” –linkkiä. Ruudulle aukeaa Kotisivukoneen taustakuvakirjasto, josta voit valita haluamasi kuvan tai kuvion. Voit heti esikatsella kuinka taustakuva tai –kuvio vaikuttaa omien kotisivujesi ulkoasuun.

Jos valitsit taustakuvion, tulee sille asettaa toistoasetus. Voit toistaa kuviota joko vaakasuunnassa, pystysuunnassa tai molemmissa suunnissa. Käytännössä taustakuviot tulee toistaa molemmissa suunnissa, jolloin kuvio kopioituu ja täyttää koko sivujesi taustan yhtenäisellä kuviolla.

Voit myös määritellä taustalle vain tietyn värin. Tämän värin voit valita ”Sivun taustaväri” –kohdan ”Vaihda” –painikkeesta ja valitsemalla värikartasta haluamasi värisävyn. Näet muutoksen heti omilla kotisivuillasi.

Halutessasi voit myös valita taustakuvan tai –kuvion omalta koneeltasi klikkaamalla ”Lisää oma taustakuva” –linkkiä ja valitsemalla tiedostoselaimesta haluamasi kuvatiedoston.

Oman taustakuvan lisäämisessä tulee huomioida, että taustakuva täyttää seuraavat kriteerit:

• kuvan tulee olla .jpg .gif tai .png muodossa. Vältä .bmp muotoisia kuvia
• tiedoston tai kansion nimessä ei saa olla internetiin sopimattomia merkkejä, esimerkiksi ä, ö, pilkku tai tyhjä väli.
• yläpalkkikuvan tiedostokokoon kannattaa kiinnittää huomiota. Liian raskaat kuvat latautuvat hitaasti. Yli 100 kt kokoiset taustakuvat ovat jo pääsääntöisesti varsin raskaita.
• jos käytät valokuvaa, kannattaa huomioida, että isommilla näyttöresoluutioilla kuvan toisto näkyy eri tavalla kuin pienellä näyttöresoluutiolla.

Sivun asetukset

Sivun muita asetuksia voit muokata avaamalla ”Sivun asetukset” –työkalun. Voit määritellä sivujen asemoinnin (keskitetty tai vasen laita) ja sivun sisältöalueen taustavärin. Avaamalla lisäasetukset, voit myös määritellä sivujen leveyden ja marginaalit.

Voit määritellä ovatko vasen ja oikea palsta käytössä sivuillasi "Sivupalstojen näkyvyys" -kohdasta. Jos kytket palstan pois käytöstä, levennetään sivun sisältöalue kattamaan palstan jättämä tyhjä tila. Sivupalstoilla voi olla näkyvissä erilaisten ominaisuuksien nostolaatikoita, kuten esimerkiksi tapahtumakalenterin kalenterinäkymä, kuva-albumin uusimmat kuvat tai bannereita.

Sivun asetukset -välilehdeltä voit myös lisätä sivuillesi sisältölaatikoita. Tyhjien laatikoiden sisältöä pääset muokkaamaan "Sisällön muokkaus" -näkymässä.

Huom! Muutokset astuvat voimaan vasta kun klikkaat “Tallenna” -painiketta. Jos muutokset eivät näy heti, paina Ulkoasueditorista poistumisen jälkeen F5 –näppäintä, jotta selaimesi päivittää sivun uudelleen.

Lisäasetukset

Historia-työkalun avulla löydät viimeisimmät tekemäsi muutokset tallennuspäivämäärän mukaan ja pääset palaamaan aiemmin tallentamiisi versioihin.

CSS -editorilla voi muokata sivujen CSS -tyylimäärittelyjä ja tehdä sivujensa ulkoasusta minkälaiset tahansa. Suosittelemme CSS -tiedoston muokkaamista vain edistyneille käyttäjille, sillä vääränlaiset muutokset voivat sekoittaa sivut tai jopa estää niiden toimimisen kokonaan.

Lisätietoa sivun ulkoasun muokkaamisesta:
» Usein kysytyt kysymykset