{"id":607,"date":"2019-03-03T17:09:00","date_gmt":"2019-03-03T15:09:00","guid":{"rendered":"https:\/\/www.zoner.fi\/tuki\/?page_id=607"},"modified":"2025-11-12T14:43:39","modified_gmt":"2025-11-12T12:43:39","slug":"miten-otan-kayttoon-helppokayttoisen-kotisivukoneen","status":"publish","type":"page","link":"https:\/\/www.zoner.fi\/tuki\/kotisivukone\/legacy\/miten-otan-kayttoon-helppokayttoisen-kotisivukoneen\/","title":{"rendered":"Helppok\u00e4ytt\u00f6inen kotisivueditori -kotisivukoneen k\u00e4ytt\u00f6\u00f6notto"},"content":{"rendered":"\n

Ohje tarkistettu: 11.6.2021<\/em><\/p>\n\n\n\n

Zonerin webhotelliin sis\u00e4ltyy helppok\u00e4ytt\u00f6inen kotisivukone<\/a>, jonka avulla on helppoa ja nopeaa valmistaa ja julkaista n\u00e4ytt\u00e4v\u00e4 nettisivusto. Kotisivueditori sis\u00e4lt\u00e4\u00e4 lukuisia valmiita mallipohjia ja laajat muokkausmahdollisuudet. Voit tehd\u00e4 editorilla yksinkertaiset sivut tai laajemman kokonaisuuden, perustaa blogin tai vaikka verkkokaupan.<\/p>\n\n\n\n

Kotisivukoneen k\u00e4yt\u00f6n aloitus<\/h2>\n\n\n\n

Kirjaudu sis\u00e4\u00e4n webhotellin DirectAdmin-hallintapaneeliin.<\/p>\n\n\n\n

Jos sinulla on kauttamme useampi domain, valitse ensin se domain, jota k\u00e4ytet\u00e4\u00e4n kotisivueditorin avulla luotavan sivuston osoitteena (my\u00f6s alidomainit). Ohje muokattavan domainin valintaan l\u00f6ytyy t\u00e4\u00e4lt\u00e4<\/a>.<\/p>\n\n\n\n

Valitse p\u00e4\u00e4valikosta Lis\u00e4toiminnot \u2013 Zoner Kotisivukone.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Jos ole luonut alidomaineja, valitse domain, jota k\u00e4ytet\u00e4\u00e4n sivuston osoitteena.<\/p>\n\n\n\n

Kotisivueditori sis\u00e4lt\u00e4\u00e4 runsaasti valmiita ulkoasupohjia<\/h3>\n\n\n\n

Kotisivukone sis\u00e4lt\u00e4\u00e4 kymmeni\u00e4 valmiiksi suunniteltuja sivupohjia, joita voit k\u00e4ytt\u00e4\u00e4 avuksi oman sivustosi suunnittelussa. Valittua sivupohjaa voi muokata kotisivueditorilla, joten ihan kaikkien elementtien ei tarvitse olla mieluisia. On kuitenkin hyv\u00e4 valita pohja, jossa on valmiiksi tarpeisiisi sopiva asettelu, niin p\u00e4\u00e4set itse v\u00e4hemm\u00e4ll\u00e4.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Vie hiiri sivupohjan esittelykuvan p\u00e4\u00e4lle, niin saat esiin valikon, jonka kautta voit esikatsella pohjaa tai valita kyseisen sivupohjan oman sivustosi pohjaksi.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Kiinnit\u00e4 huomiota esim. valikon asetteluun, sivun sarakkeiden jaotteluun, erilaisiin osioihin, painikkeisiin ja taustoihin.<\/p>\n\n\n\n

Olemassaolevan nettisivuston tuominen sivupohjaksi<\/h3>\n\n\n\n

Kotisivueditori sis\u00e4lt\u00e4\u00e4 my\u00f6s mahdollisuuden tuoda jo olemassa oleva sivusto ty\u00f6stett\u00e4v\u00e4ksi versioksi ohjelmaan. Kirjoita tuotavan sivuston osoite Import any website -valinnan kentt\u00e4\u00e4n ja klikkaa Tuo. Tuominen voi kest\u00e4\u00e4 jonkin aikaa rippuen jonotilanteesta.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Huomaa, ett\u00e4 lopputulos riippuu eritt\u00e4in paljon tuotavan materiaalin alkuper\u00e4st\u00e4. Jos tuot sivuston, joka on tehty alun perin toisenlaisella julkaisuj\u00e4rjestelm\u00e4ll\u00e4, on eritt\u00e4in todenn\u00e4k\u00f6ist\u00e4, ett\u00e4 joudut tekem\u00e4\u00e4n muokkauksia saadaksesi sivuston julkaisukuntoon. Jos taas tuot sivuston, joka on tehty vastaavalla kotisivueditorilla, on muokkaustarve yleens\u00e4 huomattasti pienempi.<\/p>\n\n\n\n

Kotisivueditori ja elementtien muokkaaminen<\/h3>\n\n\n\n

Voit muokata sivulla n\u00e4kyvi\u00e4 elementtej\u00e4 viem\u00e4ll\u00e4 hiiren ko. kohteen p\u00e4\u00e4lle ja klikkaamalla oikean yl\u00e4kulman kyn\u00e4-kuvaketta tai klikkaamalla elementti\u00e4 hiiren oikealla painikkeella. Siirr\u00e4 elementtej\u00e4 klikkaamalla elementti\u00e4 ja vet\u00e4m\u00e4ll\u00e4. Muuta elementin kokoa vet\u00e4m\u00e4ll\u00e4 reunuksesta.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Lis\u00e4\u00e4 elementtej\u00e4 vet\u00e4m\u00e4ll\u00e4 niit\u00e4 yl\u00e4reunan valikkopalkista sivulle. Jokaisella elementill\u00e4 on runsaasti muokkausvaihtoehtoja editorissa, joihin kannattaa tutustua elementin asetusten kautta.<\/p>\n\n\n\n

Taustakuvan\/-v\u00e4rin muokkaaminen<\/h3>\n\n\n\n

L\u00f6yd\u00e4t taustakuvan asetukset yl\u00e4reunan valikkopalkista ratas-kuvaketta klikkaamalla tai klikkaamalla hiiren oikealla painikkella taustakuvan kohdalta.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Alasivun lis\u00e4\u00e4minen\/poistaminen<\/h3>\n\n\n\n

Klikkaa yl\u00e4reunan valikkopalkissa n\u00e4kyv\u00e4\u00e4 sivun nime\u00e4 ja valitse alasvetovalikosta Muokkaa.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Valitse Uusi kohde, anna uudelle sivulle otsikko ja lis\u00e4\u00e4 se valikkoon. Poista sivu klikkaamalla otsikon vieress\u00e4 n\u00e4kyv\u00e4\u00e4 rastia.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Monikielinen sivusto<\/h3>\n\n\n\n

Kotisivukoneen avulla on helppoa rakentaa my\u00f6s monikielinen sivusto. Ved\u00e4 yl\u00e4reunan valikosta Kielet-elementti esim. yl\u00e4valikkoon. Lis\u00e4\u00e4 kaikki haluamasi kielet elementin valikon kautta, muista lis\u00e4t\u00e4 my\u00f6s oletuskieli.<\/p>\n\n\n\n

Nyt voit valita muokattavan kielen Teksti-elementin alasvetovalikosta ja kirjoittaa kaikki sivuston tekstit kieliversioon sopiviksi.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Mobiilioptimointi<\/h3>\n\n\n\n

Nykyaikana on t\u00e4rke\u00e4\u00e4, ett\u00e4 sivusto n\u00e4ytt\u00e4\u00e4 hyv\u00e4lt\u00e4 laitteesta riippumatta. Oletusarvoisesti Kotisivukoneen sivupohjat eiv\u00e4t ole mobiilioptimoituja, mutta mobiilioptimointi on helppo tehd\u00e4 yl\u00e4reunan valikkopalkista l\u00f6ytyvien toimintojen avulla. Voit asemoida kaikki sivuston elementit k\u00e4sin eri ruuduille sopiviksi klikkaamalla eri laitetyyppien valikkokohtia tai voit luottaa automaatioon, joka ainakin omien testaustemme perusteella toimii loistavasti.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Uudemmassa Zoner Kotisivukoneversiossa automaattista asetteluvaihtoehtoa ei ole, vaan kaikki laiteversiot sivustoista luodaan automaattisesti ty\u00f6p\u00f6yt\u00e4versiosta. Eri laitteille optimoituja versioita p\u00e4\u00e4see kuitenkin muokkaamaan sivun yl\u00e4palkista valitsemalla halutun laitetyypin.
<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Lomake-elementin SMTP-asetukset<\/h3>\n\n\n\n

Kotisivukone k\u00e4ytt\u00e4\u00e4 viestien l\u00e4hett\u00e4miseen oletuksena PHP mail -toimintoa, joka on estetty webhotelleissamme, joten voidaksesi hy\u00f6dynt\u00e4\u00e4 Kotisivukoneen lomake-elementin toimintoja sinun pit\u00e4\u00e4 aktivoida SMTP k\u00e4ytt\u00f6\u00f6n.<\/p>\n\n\n\n

Luo ensin uusi s\u00e4hk\u00f6postilaatikko. Voit my\u00f6s k\u00e4ytt\u00e4\u00e4 vanhaa olemassa olevaa laatikkoa, mutta suosittelemme uuden luontia.<\/p>\n\n\n\n

Ohje s\u00e4hk\u00f6postin luomiseen<\/a>.<\/p>\n\n\n\n

Avaa lomake-elementin asetukset ja SMTP-v\u00e4lilehti.<\/p>\n\n\n\n

SMTP is\u00e4nt\u00e4 = localhost<\/p>\n\n\n\n

SMTRP portti = 587<\/p>\n\n\n\n

K\u00e4ytt\u00e4j\u00e4tunnus ja salasana = luomasi s\u00e4hk\u00f6postilaatikon tunnukset<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Sivuston julkaiseminen kotisivueditorilla<\/h3>\n\n\n\n

Kun olet tyytyv\u00e4inen editorilla ty\u00f6stetyn sivuston ulkoasuun ja rakenteeseen ja olet tarkistanut esikatselun avulla, milt\u00e4 sivusto n\u00e4ytt\u00e4\u00e4 eri laitteilla, voit julkaista sivuston.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Kotisivueditori – p\u00e4\u00e4toiminnot valikossa<\/h2>\n\n\n\n
\"\"<\/figure>\n\n\n\n

1. Julkaise. <\/strong>Sivuston julkaiseminen, tallentaminen ilman julkaisemista, varmuuskopiointitoiminnot.<\/p>\n\n\n\n

2. Esikatselu.<\/strong> Katso milt\u00e4 sivusto n\u00e4ytt\u00e4isi julkaistuna. Vaihda ruudun kokoa alasvetovalikosta, niin n\u00e4et sivuston mobiilioptimoinnin tilan.<\/p>\n\n\n\n

3. Peru\/tee uudelleen.<\/strong> Peru edellinen tehty muutos tai tee perumasi muutos uudelleen.<\/p>\n\n\n\n

4. Uusi\/palauta.<\/strong> Vaihda oletussivupohjaa tai peru kaikki sivupohjaan tekem\u00e4si muutokset resetoimalla.<\/p>\n\n\n\n

5. Mobiilioptimointi.<\/strong> Valitse kuvaruudun koko ja muokkaa sivuston n\u00e4kym\u00e4 siihen sopivaksi. Automaattinen layout muokkaa n\u00e4kym\u00e4n automaattisesti mobiililaitteille sopivaksi.<\/p>\n\n\n\n

6. Lista sivuista.<\/strong> Alasvetovalikossa on lista kaikista sivustosi sivuista. Voit siirty\u00e4 sivulle klikkaamalla sen nime\u00e4. Muokkaa ja lis\u00e4\u00e4 uusia sivuja klikkaamalla Muokkaa.<\/p>\n\n\n\n

7. Asetukset.<\/strong> Asetukset-valikosta l\u00f6yd\u00e4t kaiken tarpeellisen liittyen siihen, miten sivusto n\u00e4ytt\u00e4ytyy k\u00e4ytt\u00e4jille ja hakukoneille (fontit, taustakuvat, favicon<\/a>, SEO-m\u00e4\u00e4ritykset jne.).<\/p>\n\n\n\n

8. Kieli.<\/strong> Voit vaihtaa hallintapaneelin kielt\u00e4.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

1. Teksti.<\/strong> Teksi\u00e4 sis\u00e4lt\u00e4v\u00e4 elementti. Muokkaa tekstin kokoa, asettelua, jne.<\/p>\n\n\n\n

2. Kuva.<\/strong> Elementti, jonka avulla voit lis\u00e4t\u00e4 sivustolle yksitt\u00e4isen kuvan.<\/p>\n\n\n\n

3. Galleria.<\/strong> Elementti, jonka avulla voit lis\u00e4t\u00e4 sivustolle useampia kuvia sis\u00e4lt\u00e4v\u00e4n kuvagallerian.<\/p>\n\n\n\n

4. YouTube.<\/strong> Lis\u00e4\u00e4 YouTube-video.<\/p>\n\n\n\n

5. Kartat.<\/strong> Lis\u00e4\u00e4 Google-kartta. Huomaa, ett\u00e4 sinun pit\u00e4\u00e4 hakea API-avain ohjeiden mukaan n\u00e4ytt\u00e4\u00e4ksesi Googlen kartan sivustollasi.<\/p>\n\n\n\n

6. Muoto.<\/strong> Lis\u00e4\u00e4 tehostelaatikko esim. tekstin taustalle.<\/p>\n\n\n\n

7. Rivi.<\/strong> Lis\u00e4\u00e4 jakaja rivien tai sarakkeiden v\u00e4lille.<\/p>\n\n\n\n

8. Painike.<\/strong> Lis\u00e4\u00e4 sivustolle painike esim. ohjaamaan k\u00e4vij\u00e4 yhteydenottolomakkeelle.<\/p>\n\n\n\n

9. Lomake.<\/strong> Lis\u00e4\u00e4 sivustolle lomake. Muista m\u00e4\u00e4ritt\u00e4\u00e4 my\u00f6s s\u00e4hk\u00f6postiasetukset ja aktivoi SMTP k\u00e4ytt\u00f6\u00f6n.<\/p>\n\n\n\n

10. Valikko.<\/strong> Lis\u00e4\u00e4 uusi valikko.<\/p>\n\n\n\n

11. Kielet.<\/strong> Lis\u00e4\u00e4 kielivalinnan mahdollistavat painikkeet esim. p\u00e4\u00e4valikkoon.<\/p>\n\n\n\n

12. Elementti.<\/strong> Sis\u00e4lt\u00e4\u00e4 valmiita layouteja kuvien, muiden elementtien ja tekstien yhdist\u00e4miseksi.<\/p>\n\n\n\n

13. Some.<\/strong> Lis\u00e4\u00e4 erilaisia sosiaalisen median palveluita ja sy\u00f6tteit\u00e4 sivustolle.<\/p>\n\n\n\n

14. Lis\u00e4\u00e4 elementtej\u00e4.<\/strong> Lista extra-elementeist\u00e4 lis\u00e4tt\u00e4v\u00e4ksi: Skype, musiikki, Banneri, AdSense-koodi, kalenteri, html-koodi, taulukko, Vimeo, Youku, Zendesk, Olark, Tawk.to chat-sovellus, Effect.<\/p>\n\n\n\n

15. Kaupank\u00e4ynti.<\/strong>\u00a0Verkkokaupan toiminnot. Lue lis\u00e4\u00e4 Kotisivukoneen kauppa-osiosta\u00a0t\u00e4\u00e4lt\u00e4<\/a>.<\/p>\n\n\n\n

16. Kartta.<\/strong> Lis\u00e4\u00e4 Bing maps tai Baidu kartat -elementti.<\/p>\n\n\n\n


<\/p>\n","protected":false},"excerpt":{"rendered":"

Kotisivueditori sis\u00e4lt\u00e4\u00e4 lukuisia valmiita mallipohjia ja laajat muokkausmahdollisuudet. Voit tehd\u00e4 editorilla yksinkertaiset sivut tai laajemman kokonaisuuden, perustaa blogin tai vaikka verkkokaupan.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":137590,"menu_order":17,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_relevanssi_hide_post":"","_relevanssi_hide_content":"","_relevanssi_pin_for_all":"","_relevanssi_pin_keywords":"","_relevanssi_unpin_keywords":"","_relevanssi_related_keywords":"","_relevanssi_related_include_ids":"","_relevanssi_related_exclude_ids":"","_relevanssi_related_no_append":"","_relevanssi_related_not_related":"","_relevanssi_related_posts":"1076,1066,1063","_relevanssi_noindex_reason":"","footnotes":""},"categories":[69],"tags":[87],"wf_page_folders":[],"class_list":{"0":"post-607","1":"page","2":"type-page","3":"status-publish","5":"category-legacy-kotisivukone","6":"tag-kotisivukone"},"_links":{"self":[{"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/pages\/607","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/comments?post=607"}],"version-history":[{"count":7,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/pages\/607\/revisions"}],"predecessor-version":[{"id":138024,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/pages\/607\/revisions\/138024"}],"up":[{"embeddable":true,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/pages\/137590"}],"wp:attachment":[{"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/media?parent=607"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/categories?post=607"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/tags?post=607"},{"taxonomy":"wf_page_folders","embeddable":true,"href":"https:\/\/www.zoner.fi\/tuki\/wp-json\/wp\/v2\/wf_page_folders?post=607"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}