Ron Putting

Je stopt niet met spelen omdat je oud wordt, je wordt oud omdat je stopt met spelen!

Ik wil een eigen WordPress theme opmaken

Published · Updated

Deel 4 van “Ik wil een website”. Klik hier voor deel 3.

Stylesheets.

Vanuit WordPress perspectief bestaat opmaken uit twee dingen: indeling en aankleding. Indeling gaat over de layout van een homepage, je berichten (onder elkaar, naast elkaar in bijvoorbeeld een rij van vier berichten en dan een volgende rij met vier berichten, of variaties hiervan met blokken) of een enkel bericht en/of pagina’s. Aankleding gaat over lettertypen, kleuren, achtergronden enzovoort, In beide gevallen bepaal je dit met PHP-code (in mindere mate), maar voornamelijk met stylesheets (de style.css). En dan blijkt CSS weer een wereld op zich te zijn. De mogelijkheden zijn enorm. Hoe zie je door de bomen het bos? Wat helpt is de mogelijkheid in moderne browsers om een element te inspecteren (bijvoorbeeld in Google Chrome: wijs het te onderzoeken element op het scherm aan, rechts-klikken en kies optie “inspect element”). Dit laat o.a. alle css opmaakcodes zien die voor het gekozen element van toepassing zijn. Je kunt deze interactief in de browser aanpassen om meteen het effect te beoordelen. Bevalt dit, dan kan je stylecode in de style.css opzoeken en hier permanent doorvoeren.

Responsive, Bootstrap en afhankelijkheden

Een belangrijk punt tegenwoordig is dat een website bij voorkeur Responsive moet zijn. Dat wil zeggen dat een website niet alleen op een PC of laptop maar ook op een tablet en op een smartphone correct en leesbaar wordt weergegeven, ongeacht het formaat van het apparaat (dus zonder van de zoomfunctie gebruik te hoeven maken zodat je de site niet voortdurend heen en weer hoeft te slepen om alles te kunnen lezen). Dit kan je zelf m.b.v. CSS regelen maar je kunt ook Bootstrap gebruiken (w3schools heeft een toegankelijke toelichting over Bootstrap). Bootstrap is speciaal hiervoor ontwikkeld. Het lastige is hier dan weer dat Bootstrap haar eigen CSS gebruikt. Heb je naast Bootstrap ook opmaakcode in een eigen CSS zitten dan kunnen deze elkaar beinvloeden. Gelukkig valt dit met bovenstaande “inspect element” optie goed te onderzoeken.

Alle ik-wil-een-website berichten

Tags:

Geef een reactie

Je e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

Deze site gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.