Een handige plugin om zelf wijzigen te maken aan de CSS van je website is SiteOrigin CSS.
Met CSS kun je wijzigingen maken aan de vormgeving van je WordPress website als je thema daar geen mogelijkheden voor biedt. Bijvoorbeeld, onderstaande CSS zou de achtergrond van een webpagina lichtgrijs maken, ook als het thema daar geen optie voor heeft:
body {
background-color: silver;
}Maar als je niet veel, of helemaal geen, ervaring hebt met CSS, met het vinden van de juiste selector voor het element dat je wilt wijzigen of de CSS regel niet kent die de wijziging geeft die je zou willen, dan kan het nog flink ingewikkeld zijn om die wijziging te maken.
De SiteOrigin CSS plugin maakt dit eenvoudiger omdat je elementen die je aan wilt passen, aan kunt klikken in de interface van de plugin en vervolgens CSS kunt toevoegen door verschillende opties te selecteren in hun visuele editor. Jouw keuzes worden vervolgens door de plugin omgezet naar CSS code.
Een van de grote pluspunten van deze plugin is dat je niet all opties uit je hoofd hoeft te weten, maar als je klaar bent met bewerken zie je wel tot welke CSS je wijzigingen geleidt hebben. Zo ga je steeds meer herkennen en het ook makkelijker uiteindelijk zelf schrijven.
Het nadeel van deze plugin is dat je niet altijd elk element kunt selecteren, bijvoorbeeld omdat het overlapt met een ander element. Het is niet altijd duidelijk of een selector alleen voor dat element geldt, of voor meerdere op de pagina, of een CSS regel alleen op die pagina wordt doorgevoerd of op de hele site. En de plugin legt je dat ook allemaal niet uit. Mijn voornaamste advies is om na elke wijziging die je maakt naar je website te kijken, zodat je kunt zien wat het effect is op de pagina en de site als geheel.
Deze plugin is vooral een heel handig gereedschap in het leerproces, als aanvulling op:
- het leren gebruiken van de inspector van je browser, want die is veel uitgebreider dan die in deze plugin
- het leren van de basis van HTML
- het leren gebruiken van selectors, bijvoorbeeld bij CSS diner
- en natuurlijk het leren van CSS zelf, je kunt bij Learnit Training een gratis online cursus volgen, en bij W3C een korte introductie op CSS doorlopen
Kijk op de website van SiteOrigin voor meer informatie en de korte video waarin je de plugin in gebruik ziet.
