Aanpassingen maken in Suffusion thema voor WordPress via Child Themes

Nou, dat is weer een lekker SEO vriendelijke titel (niet dus). Maar ik kon niet echt een korter titel verzinnen voor dat wat ik eigenlijk al een tijd geleden had moeten beschrijven. Want nu moest ik het zelf ook weer opnieuw uitzoeken toen ik er een vraag over kreeg: hoe pas je de “continue reading >>” tekst aan die standaard in het Suffusion thema getoond wordt als je een blogpost maakt die niet in zijn geheel op de voorpagina van je weblog getoond wordt? Ik heb daar namelijk staan “lees verder >>”.

Het is heel gemakkelijk, als je weet hoe het moet. Ik was het echter vergeten te documenteren en moest dus weer helemaal opnieuw op zoek naar mijn eigen werkwijze. Bij deze dan alsnog…

Child Themes
Een van de eerste dingen die je even moet begrijpen is het bestaan van “Child Themes” binnen WordPress. Met zo’n child theme (wie verzint er een mooie Nederlandse term voor?) kun je aanpassingen maken in een bestaand theme (verzameling van bestanden die de layout van je WordPress site bepalen) zonder dat die aanpassingen overschreven (en dus ongedaan gemaakt) worden als je een nieuwe versie van dat theme installeert.
En dat is handig, want Suffusion, het theme dat ik gebruik, wordt met enige regelmaat bijgewerkt en ik kan nu eenvoudig vanuit de WordPress interface updates laten installeren zonder dat die “lees verder” aanpassing stuk gaat.

Daarnaast is het zo dat zo’n child theme dé plek is om de vertalingen voor een theme neer te zetten. Ook hier is het weer zo dat bij aanpassingen in het hoofdthema zelf, deze aanpassingen (en ook de beschikbaarheid van vertalingen) verloren gaan bij een update.

Hoe maak je een Child Theme aan?
Er zijn verschillende instructies beschikbaar voor het aanmaken van een child theme. Hier staat er bijvoorbeeld eentje bij Peter Luit. Hij zegt dat er minimaal drie bestanden nodig zijn: functions.php, header.php, style.css maar ook met alleen style.css (en een paar andere bestanden) pikt WordPress het child them al op.

Voor wie snel klaar wil zijn, ik heb de bestanden die ik gebruik in een ZIP-bestand (ZIP-bestand, 20,8 kB) bij elkaar gezet. Die kun je downloaden en gewoon op je eigen site uploaden. Maar dat werkt alleen als je Suffusion gebruikt en bevat geen updates voor nieuwere vertalingen (ik ga het ZIP-bestand dus niet elke keer updaten, het is de situatie van vandaag 19-5-2012). Als je de stappen hieronder volgt, weet je zelf ook precies hoe het werkt.

Stap 1 – maak via FTP verbinding met je site
Ik ga er even vanuit dat je via FTP verbinding kunt maken met je site, anders houdt het hier al op. Ik ga er ook vanuit dat je het Suffusion theme al geïnstalleerd hebt en gebruikt.
Zoek nu de map ../wp-content/themes op op de server.
In die map zie je al een submap “suffusion” staan.

Maak in the themes map een nieuw submap “suffusion-subtheme” aan (zie hierboven) óf upload de inhoud van het ZIP-bestand (daar zit de map “suffusion-subtheme” in) naar die map.
Maak in de map “suffusion-subtheme” ook een map “post-formats” en een map “translation” aan.
Het moet er nu dus uitzien als in de schermafbeelding hierboven.

Stap 2 – Nederlandse vertaling downloaden en uploaden

Download de Nederlandse vertaling voor Suffusion vanaf deze link (ZIP-bestand)
Pak de ZIP uit en upload de bestanden nl_NL.mo en nl_NL.po naar de translation map in je child theme.
Zie ook de schermafbeelding hierboven.

Stap 3 – content.php downloaden, aanpassen, uploaden
Ga naar de map ../wp-content/themes/suffusion/post-formats en download het bestand content.php
Open het bestand in een teksteditor, het zal er zo uitzien:

Pas de tekst in regel 29 aan zodat er een Nederlandse tekst komt te staan in plaats van “Continue Reading”.
Het ziet er dan zo uit:

Sla het bestand op en upload het naar ../wp-content/themes/suffusion-subtheme/post-formats
Let op! Dit is dus het subtheme! Zie ook hieronder:

Stap 4 – style.css maken en uploaden
Maak een bestand genaamd style.css met deze inhoud:
/*
Theme Name: Suffusion Subtheme
Theme URI: http://ictoblog.nl
Description: Child Theme based on Suffusion
Version: 1.0.0
Author: Pierre Gorissen
Author URI: http://ictoblog.nl/
Template: suffusion
*/

@import url("../suffusion/style.css");
Je kunt alle waarden in het eerste deel aanpassen. Vul dus gerust een eigen theme name in, een andere URL, description etc. Ook de Author en Author URI hoeven niet naar mij te verwijzen!!
Belangrijk is wel dat je “Template: suffusion” laat staan!

Upload het bestand style.css naar ../wp-content/themes/suffusion-subtheme zoals je hieronder kunt zien.

Stap 5 – activeren van het child theme
Als je alles goed gedaan hebt, dan zie je nu bij de Weergave > Thema’s optie van WordPress (in de beheeromgeving) een nieuw thema met de naam en informatie die jij gekozen hebt in style.css

Klik nu op “Activeren” om het subthema actief te maken.
Alle opties en instellingen van Suffusion blijven actief, als je kiest voor “Suffusion Options” in het Weergave menu, dan krijg je nog steeds dezelfde vensters te zien als eerst. Uitsluitend de dingen die jij aanpast in de mappen van het child theme krijgen de voorkeur boven alle andere instellingen.

Samenvattend
Het vergt even een paar stappen, maar als je het child theme eenmaal op zijn plek hebt, dan heb je er eigenlijk weinig omkijken meer naar.