Livestriimissä 5.5.2021 kävimme läpi CSS:n lisäämistä, muokkausta ja käyttöä täällä WordPress maailmassa. Videosta saat napattua hyvät vinkit omaan käyttöön jossa lähdetään ihan perustasolta liikkeelle muokkailemaan sivuja yleisellä tasolla.
Aiheet:
0:16 Mitä CSS on ja mitä sillä tehdään?
2:00 Miten tutkitaan koodia Chromen inspectorilla
7:12 Helppo tapa kohdistaa koodi suoraan tiettyyn classiin
8:50 Miten tarkistat toiselta sivustolta helposti mm. Värikoodit, Fontit ja fonttikoot
12:37 Kadence WordPress teeman muokkaaminen CSS:n avulla
15:43 Kuinka lisäät CSS-lisäluokan Gutenberg editorissa sarakkeeseen
16:20 CSS-lisäluokkien yleiset nimeämisohjeet
17:28 CSS:n lisääminen WordPress mukauttimen kautta – Oma CSS moduulia käyttäen
19:12 Saman classin käyttäminen muissa kohdissa WordPress sivulla
21:52 Oma CSS kohta vs Lapsiteemassa CSS – Miksi ja milloin?
25:27 Miksi kannattaa käyttää tiettyä rakennetta lisätessä CSS-koodia sivustolle?
26:16 Koodin kommentointi – Miten ja miksi?
27:58 CSS:n lisääminen lapsiteemaan
29:42 Otsikoiden koon muokkaaminen globaalisti CSS:n avulla
32:02 Tekstikoon muokkaaminen CSS:n avulla
33:03 CSS:n no no – Huomiot kokemuksen perusteella
35:20 Miten tehdään eri levyisille päätelaitteille omia tyylejä media queryjen avulla?
38:30 Elementtien piilottaminen CSS:n avulla ja vinkit milloin sitä ei kannata tehdä
47:45 Miksi CSS kannattaa lisätä vain yhteen paikkaan WordPressissä?
51:49 Mikä ero on theme CSS:llä ja Additional CSS:llä?
53:15 Miksi CSS voi näkyä omalla sivustollasi yhtenä pötkönä?
56:28 Kannattaako käyttää erillistä lisäosaa – Lisäämään CSS:ää sivustolle?
Lisätietoa ja työkaluja CSS:än opiskeluun löytyy mm.:
– WordPress lapsiteema selitettynä – Sisältää ohjeen!
– CSS selector reference – W3Schools
– FreeCodeCamp
– MDN Web Docs
– CSS-Tricks
– Media Queryt
Järjestäjät ja kommentaattorit:
Laura Jalonen – https://jaloin.fi
Jaakko Pöntinen – https://mooses.fi
Mikko Mörö – https://sivuseppa.fi
Niko Vittaniemi – https://innovitale.com/