Kun luot verkkosivuja Elementorissa, on todella tärkeää selvittää verkkosivusi anatomia. Tämä on yhteinen rakenne, joka kaikilla sivuillasi on. Joskus erityisvaatimuksesi saattavat olla sellaiset, että tarvitset 2–4 erilaista mallipohjaa. Jokaista varten sinun on istuttava alas ja selvitettävä huolellisesti kunkin mallipohjan anatomia. Käytä siihen aikaa ja tee se oikein, sillä jos saat perustukset oikein alusta alkaen, talosi ei murene ja kaadu! Se säästää lopulta paljon tilkkutäkkien aiheuttamaa päänsärkyä.
Eli anatomian ymmärtämisellä tarkoitan sivun rakenteen selvittämistä. Onko sivulla otsikko (yleensä kyllä)? Entä alateksti tai alakategoria? Onko sivulla latausosio? Miltä pääsisällön otsikot näyttävät? Entä sisältöteksti?
Kun tarkastelet JOKAISTA näistä elementeistä, sinun on selvitettävä KOLME asiaa.
- Minkä värinen teksti tulee olemaan
- Mitä fonttiasetuksia tekstissä käytetään (koko, paksuus jne.)
- Ja sinun on selvitettävä jokainen näistä – PÖYTÄKONEELLE, TABLETILLE ja MATKAPUUHELIMELLE (muuten työpöydän asetukset näyttävät hulluilta matkapuhelimessa). Älä unohda, että useimmat ihmiset selaavat nykyään verkkoa puhelimillaan ja tableteillaan! Joten – SINUN TÄYTYY TEHDÄ TÄMÄ. Kyllä, tämä on kovaa työtä, mutta sinun tarvitsee tehdä se vain YHDEN KERRAN.
Ja Elementor helpottaa tätä käyttämällä GLOBAALIA FONTTEJA ja GLOBAALIA VÄREJÄ. Pohjimmiltaan voit asettaa GLOBAALIN VÄRIN esimerkiksi kaikkien sivujesi otsikoille. Voit sitten asettaa GLOBAALIN FONTIN kaikkien sivujesi otsikoille. Tällä on kaksi etua…
- Sinun ei tarvitse vaivalloisesti asettaa yksittäisiä fontti- ja värikomponentteja jokaiselle (esimerkiksi) sivun otsikolle. Yleiset fontit ja värit tekevät sen puolestasi.
- Jos tulevaisuudessa haluat muuttaa esimerkiksi kaikkien sivujesi otsikon väriä, muutat vain asetuksen Globaali väri -osiossa sen sijaan, että kävisit läpi jokaisen sivustosi verkkosivun. Kuvittele sivusto, jota luet nyt – yli 300 sivua – kuvittele, kuinka paljon aikaa säästyy, jos kaikki sivut muutetaan yhdestä osiosta!
Tässä ovat asetukseni tälle verkkosivustolle. Jos haluat ensin oppia lisää globaaleista fonteista ja globaaleista väreistä, kirjoita YouTubeen ”Elementor Global Fonts Colours”. Olen luonut tämän sivun itselleni tulevaisuuden referenssiksi, ja saatat haluta tehdä jotain vastaavaa verkkosivustollesi.
DT = Työpöytä
TAB = Tabletti
Puhelinnumero
Esim. DT tarkoittaa Desktop : 37, 400, LS -2.5, alleviivaus = fonttikoko 37, paksuus 400 , LS- rivinväli , alleviivaus on koriste. LH = rivinkorkeus. WS = sanaväli.
Kategoria esim. Etiikka
Väri #0097FD
Fontti: Courier Prime
DT: 27, 400, LS -2.5, alleviivaus
TAB: 27, 400, LS -2.5, alleviivaus
PH: 17, 400, LS -2.5, alleviivaus
alakategoria, esim. planeettojen terveys
Väri #F94A00
Fontti: Roboto
DT: 35 600
VÄLILEHTI: 35, 600
pH: 25, 600
Otsikko esim. Induktio
Väri # F94A00
Fontti: Roboto
DT: 35, 600, alleviivaus
VÄLILEHTI: 35, 600, alleviivaus
pH: 23, 600, alleviivaus
Alaotsikko esim. kaikki mitä haluat tietää
Väri #0097FD
Fontti: Courier Prime
DT: 17, 400, LS -2.5
TAB: 17, 400, LS -2.5
PH: 14, 400, LS -2.5
LADATTAVAT
Laatikon väri = #DDDDDD
Reunus: Kiinteä, leveys 1 1 1 1, Reunuksen säde 5 5 5 5
Tekstin väri #35C3FF
Tekstin fontti: Lato
DT: 20 500
VÄLILEHTI: 16, 500
pH: 16, 500
LINKIT
Väri #24B72F
Tekstin fontti ja DT-, TAB- ja PH-asetukset: samat kuin vasemmalla olevassa LATAUKSET-kohdassa
Uimakaistan palkki ja teksti
Violetti laatikkoväri #610071
Tekstin väri: # FFFFFF
Tekstin fontti: Ubuntu Conced
DT: 27 600
VÄLILEHTI: 27 600
PH: 20 600
Pääteksti
Väri #333333
Tekstin fontti: Lato, 15, 400, LH 24
Näin teksti tulee näyttämään…
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus eic ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus eic ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus eic ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus eic ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus eic ullamcorper mattis, pulvinar dapibus leo.