اگر قصد دارید قالب وردپرس خود را شخصیسازی کنید، هرگز فایلهای قالب اصلی (Parent Theme) را مستقیما ویرایش نکنید. چرا؟
چون با هر بار بروزرسانی قالب، تمام تغییرات شما از بین میره.
راهحل استاندارد، استفاده از Child Theme یا همان قالب فرزند است.
در این آموزش یاد میگیریم Child Theme چیست، چه زمانی باید از آن استفاده کنیم و چطور در کمتر از ۵ دقیقه یکی بسازیم.
Child Theme چیست؟
Child Theme یک قالب فرعی است که تمام امکانات، استایلها و فایلهای قالب اصلی را به ارث میبرد.
در واقع به جای اینکه فایلهای قالب اصلی را تغییر دهید، همه تغییرات را داخل قالب فرزند انجام میدهید.
مزیتش چیست؟
هر زمان قالب اصلی را بروزرسانی کنید، تغییرات شما سر جای خودش باقی میماند.
یک مثال ساده:
فرض کنید قالب اصلی، موتور ماشین است و Child Theme بدنه و ظاهر آن.
شما هرچقدر ظاهر ماشین رو تغییر بدید، موتور همچنان بدون مشکل به کار ادامه میده.
دقیقا Child Theme هم همین کار رو انجام میده.
چه زمانی باید از Child Theme استفاده کنیم؟
اگر فقط میخواید چند خط CSS به سایت اضافه کنید، بخش CSS اضافی (Additional CSS) وردپرس برای این کار کافیه.
اما اگر قرار هست یکی از کارهای زیر را انجام بدید، بهتره از Child Theme استفاده کنید:
- ویرایش فایل functions.php
- اضافه کردن کدهای PHP
- تغییر فایلهایی مثل header.php یا footer.php
- ساخت قالب اختصاصی برای صفحات
- شخصیسازی ووکامرس
- Override کردن فایلهای قالب
به طور خلاصه، اگر تغییرات شما قرار است دائمی باشد، Child Theme بهترین انتخاب است.
آموزش ساخت Child Theme
ساخت قالب فرزند فقط چند دقیقه زمان میبره. بریم که طی 4 مرحله، ایجاد و فعالش کنیم.
مرحله اول: ساخت پوشه قالب فرزند
وارد هاست یا FTP شوید و به مسیر زیر بروید:
wp-content/themesحالا یک پوشه جدید ایجاد کنید.
بهتر است نام آن شبیه قالب اصلی باشد.
مثلا اگر قالب شما Hello Elementor هست، نام پوشه چایلدتم شما میشه:
hello-elementor-child
در واقع کافیه انتهای نام قالب، عبارت -child را اضافه کنید.
مرحله دوم: ساخت فایل style.css
داخل پوشه Child Theme یک فایل با نام زیر ایجاد کنید:
style.cssحالا اطلاعات زیر را داخل آن قرار دهید:
/*
Theme Name: hello elementor Child
Template: hello-elementor
Author: MrBinary
Version: 1.0
*/نکته مهم: مقدار Template باید دقیقا برابر نام پوشه قالب اصلی باشد.
مثلا اگر پوشه قالب اصلی:
hello-elementorباشد، مقدار Template هم باید دقیقا همین باشد.
حتی یک فاصله یا اشتباه تایپی باعث میشود وردپرس قالب فرزند را شناسایی نکند.
مرحله سوم: ساخت فایل functions.php
حالا داخل همان پوشه، فایل زیر را ایجاد کنید:
functions.phpو کد زیر را داخل آن قرار دهید:
<?php
function my_child_theme_enqueue_styles() {
wp_enqueue_style(
'parent-style',
get_template_directory_uri() . '/style.css'
);
wp_enqueue_style(
'child-style',
get_stylesheet_directory_uri() . '/style.css',
array( 'parent-style' ),
wp_get_theme()->get( 'Version' )
);
}
add_action( 'wp_enqueue_scripts', 'my_child_theme_enqueue_styles' );این کد باعث میشه ابتدا فایلهای CSS قالب اصلی و بعد استایلهای Child Theme بارگذاری شوند.
در نتیجه فقط کافی است تغییرات خودتان را داخل فایل style.css قالب فرزند بنویسید.
مرحله چهارم: فعال کردن قالب
حالا وارد پیشخوان وردپرس شوید.
از مسیر:
نمایش ← پوستهها
قالب فرزند را پیدا کنید و روی فعالسازی کلیک کنید.
کار تمام است.
از این لحظه تمام تغییرات را داخل Child Theme انجام دهید.
بعد از ساخت Child Theme چه کارهایی میتوان انجام داد؟
تقریبا هر چیزی!
مثلا میتوانید تمام CSSهای سفارشی را داخل فایل style.css بنویسید یا هر کدی که قرار است به سایت اضافه شود را داخل functions.php قرار دهید.
توصیه مسترباینری: این کار شاید فقط ۵ دقیقه زمان ببرد، اما بعدها میتواند ساعتها در زمان شما صرفهجویی کند 🙂
موفق باشید

