Kotisivukoneemme on "vedä ja pudota" -editori, jolla voit muokata kotisivujesi ulkoasua lähes rajattomasti. Tässä ohjeessa käymme läpi kotisivukoneen elementtien editointitoimintoja sekä responsiivisuutta.
- Siirto-ikoniin
hiirellä tarttumalla siirrät elementtiä (esimerkissä painiketta ”Ota yhteyttä”) haluamaasi lohkoon. - Kynä-ikonia
Hiirellä klikkaamalla pääset kunkin elementin toimintovalikkoon, josta voit valita mitä elementille tehdään (esim. Monista elementti, kopioi, liitä tai lukitse)
- Valitse vanhempi -valinnalla voit aktivoida elementin sisältävän ylemmän tason elementin, eli ”Vanhemman”. Tämä toiminto on kätevä esimerkiksi silloin, kun haluat tietää, missä rakenteessa elementti sijaitsee
- Kopioi- ja liitä -valinnoilla voit kopioida haluamasi elementin sivulle. Tällä monistat helposti esimerkiksi painikkeet ja muut graafiset elementit sivuillesi, joiden muotoilu yksittäin olisi työlästä.
- Lukitse -valinnalla voit lukita elementin nykyiseen sijaintiin, jotta siihen ei voida tarttua vahingossa. Tämä voi olla tarpeen sivualueissa, joissa on paljon pällekkäisiä elementtejä.
- Poista -valinta tuhoaa valitun elementin
- Muokkaa tekstiä -valikon kohta aktivoi elementin tekstisisällön muokattavaksi ja tällöin käytettävissäsi on myös muotoilutyökaluja.
- Horisontaalisesti
- Vertikaalisesti, jos lohko on elementtiä suurempi
- Venyttää elementin sisällön koko leveydelle tai asetella sisällön keskitetysti
- Lisäksi voit järjestää elementin sisällä olevat osat joko vierekkäin tai allekain
Aktiivista elementtiä pääset muokkaamaan sivun oikeaan laitaan avautuvista valikoista.
Elementeillä on Asettelu, Koko, Väli, Näytettävät elementit, Animaatio ja Edistynyt -välilehdet, jotka löytyvät Sivun rakenne välilehden alta oikean reunan valikosta.
Asettelu-välilehdellä voit muokata elementin taustakuvaa sekä reunaa ja sitä, kuinka esimerkiksi elementin sisällä oleva kuva on aseteltu. Lisäksi voit määrittää elementille vaikkapa heittovarjon.
Koko-välilehdellä voit määritellä elementin koon suhteessa sen vanhempi-elementtiin tai määrittää pakotetun koon esimerkiksi pikseleinä. Muista, että suuriksi pakotetut kuvat eivät välttämättä toimi responsiivisesti mobiililaitteilla. Sivupohjien esiasetukset ovatkin usein prosentteina ja automaattisesti mukautuvina.
Näytettävät elementit- valikosta voit valita haluatko esimerkiksi suurikokoisen kuvan näytettävän vain isommilla ruuduilla, jolloin sitä ei näytetä lainkaan puhelimella tai tabletilla. Oletusarvona kaikki elementit näytetään kaikilla laitteilla, mutta joissain tapauksissa elementtien rajoittaminen voi olla hyödyksi.
Voit myös valita millä sivuilla sama elementti näytetään.
Animaatio-valikossa voit asettaa elementille animaatioita.
Edistynyt-välilehdellä voit muuttaa elementin linkkiä, asettaa elementille ankkurin, muuttaa elementin luokkaa ja nimeä sekä lisätä toimintoja elementtiä klikatessa.
Hostaanin kotisivukone on toteutettu siten, että editorilla tuotettu sivusto toimii täysin responsiivisesti ja mukautuen käyttäjän päätelaitteen ruutukokoon.
Sivusto toimii ja näyttää hyvältä riippumatta siitä selaako käyttäjä sivua älypuhelimella, tabletilla, tietokoneella tai vaikkapa älytelevisiolla.
Voit testata, miltä sivustosi näyttää eri kokoisilla näytöillä joko kaventamalla/leventämällä selaimesi ikkunaa tai klikkaamlla editorinäkymän yläosassa näkyviä erikokoisia ruutuja, jolloin sivusto asetellaan kyseisen koon mukaiseen näkymään.
