WordPress weboldal tulajdonosok többsége egyéni módosításokkal használja a weboldalhoz választott sablonját. Emellett 10 weboldalból csak 3-nál élnek a gyereksablon nyújtotta előnyökkel.
Vélhetően ez két okra vezethető vissza: nem ismerik a gyereksablon megoldást, nem tudják, hogyan hozhatnak létre gyereksablont.
Ebből az írásból megtudhatod, hogy miért fontos a gyereksablon használata, és hogyan hozhatsz létre saját weboldaladhoz.
Miért célszerű gyereksablont használnod?
Ha gyereksablont használsz a sablon módosítása során sok időt és fejtörést spórolhatsz magadnak. A gyereksablonok lehetővé teszik, hogy a szülősablon kódjának módosítása nélkül alakítsd a weboldal megjelenítését, valamint a szülősablont az egyéni módosítások elvesztése nélkül frissítsd.
Gyereksablon létrehozásával külön mappába kerülnek az egyéni sablon módosításokat, kódokat tartalmazó fájlok.
Hogyan készíts gyereksablont?
A következő példában gyereksablont fogunk létrehozni a ‘Twenty Sixteen’ nevű alapsablonhoz. Első lépésben hozz létre egy új mappát a /wp-content/themes/ mappában például /egyedi-sablon/ névvel. Ebbe a mappába hozz létre egy style.css nevű fájlt, és másold bele az alábbi kódot.
/*
Theme Name: Egyedi Sablon
Theme URI: https://milu.hu/wordpress-gyereksablon/
Description: Gyereksablon a Twenty Sixteen sablonhoz.
Author: Milu
Author URI: https://milu.hu/
Template: twentysixteen
Version: 0.1
*/
@import url(“../twentysixteen/style.css");
/* Ez alatt a sor alatt kezdődik az egyedi CSS kód */A legfontosabb a Template, amellyel megadjuk a szülősablon nevét, és a @import sor, amellyel átvesszük a szülősablon stíluslapját.
A gyereksablon aktíválása
A style.css fájl mentését követően a gyereksablont azonos módon tudjuk aktválni, mint bármelyik másik sablont: az weboldal adminisztrációs felületén, a Megjelenés > Sablonok menüpont alatt a gyereksablon fölé húzva a kurzort, kattints a Bekapcsol gombra.
A sablon módosítása
A gyereksablon aktiválást követően a weboldal ugyanúgy néz ki, mint az eredeti sablonnal, a szülősablonnal. A sablon módosításához egyedi CSS formázást adhatsz meg a gyereksablon style.css-ében, és így a szülősablon stílusát ezzel felülírhatod.
A functions.php fájl szerkesztése
A function.php fájlban találhatóak a sablon saját funkciói. A szülősablon funkcióit örökli a gyereksablon, és a gyereksablonhoz további funkciók adhatóak. Ehhez a gyereksablon mappájában hozz létre egy functions.php nevű fájlt. A gyereksablon funkciói a szűlősablon funkcióit követően tölti be a WordPress. A functions.php fájl nyitó php tag-gel kell, hogy induljon, ahogy az alábbiakban látható.
<?php
// Az egyedi php kódod ide kerül, a nyitó tag után.További sablonfájlok szerkesztése
A megjelenés stílusának és a funkcióknak a módosításán túl lehetőséged van struktúrális módosításokat is eszközölni. Ehhez a sablon php fájlait szükséges átírnod.
A functions.php-nél azt láthatod, hogy a szülősablon functions.php fájlát kiegészíti a gyereksablon function.php fájlja. Ezzel szemben egyéb sablon php fájlt a WordPress teljes egészben lecserél, ha a gyereksablonnál is létezik. A szülősablon fájlját figyelmenkívül hagyja, a gyereksablon fájljával dolgozik helyette.
A módosítani kívánt php fájlt egyszerűen másold át a szülősablon mappájából a gyereksablon mappájába. (Fontos, hogy a mappaszerkezet megtartása mellett.) Majd a gyereksablon mappájában nyisd meg a fájlt, és így valósítsd meg a kívánt változásokat.