همانطور که در مقاله ی پوسته ی فرزند در وردپرس چیست؟ به طور مفصل توضیح دادیم، Child Theme یک پوسته وردپرس است که عملکرد، ویژگیها و سبک قالب وردپرس دیگر، تم اصلی را به ارث میبرد. سپس می توانید قالب فرزند را بدون ایجاد هیچ تغییری در قالب والد شخصی سازی کنید.
قالب فرزند بهترین راه برای سفارشی کردن پوسته وردپرس هستند زیرا باعث صرفه جویی در زمان و تلاش می شوند. قالب والد از قبل دارای قالببندی و قابلیتهای زیادی است، بنابراین لازم نیست همه چیز را از ابتدا کدنویسی کنید.
همچنین به روز رسانی تم های وردپرس شما را ایمن می کنند. از آنجایی که شما قالب فرزند را تغییر داده اید و نه والد، هیچ گونه سفارشی سازی را با به روز رسانی قالب والد از دست نخواهید داد.
هنگامی که از پوسته ی فرزند خود راضی بودید، حتی می توانید از آن در سایت وردپرس دیگری استفاده کنید.
قبل از اینکه شروع به ایجاد یک Child Theme کنید !
برای ایجاد یک Child Theme ، باید توجه داشته باشید که با کد کار خواهید کرد. برای اینکه بفهمید برای دستیابی به اهداف خود باید چه تغییراتی در کد ایجاد کنید، به درک اولیه ای از HTML و CSS نیاز دارید.
دانش PHP نیز مفید است. حداقل باید با کپی و چسباندن قطعه کد از منابع دیگر آشنا باشید.
توصیه می کنیم در محیط توسعه محلی خود تمرین کنید. می توانید یک سایت وردپرس زنده را برای اهداف آزمایشی به سرور محلی منتقل کنید یا از محتوای ساختگی برای توسعه تم استفاده کنید.
شما باید یک قالب والد را انتخاب کنید که از نظر ظاهری و ویژگیها مشابه هدف نهایی شما باشد. هدف این است که تا حد امکان تغییرات کمتری ایجاد کنیم.
برای تمرین، بهتر است از قالب های پیش فرض وردپرس مانند تم Twenty Twenty-One که یکی از تم های پیش فرض وردپرس است استفاده کنید.
ایجاد اولین Child Theme شما
میتوانید با ایجاد پوشه و فایلهای مورد نیاز، یک Child Theme به صورت دستی ایجاد کنید. یا می توانید با استفاده از یک افزونه یک تم کودک ایجاد کنید.
روش دستی مفید است زیرا به شما کمک می کند تا در ادامه آموزش با فایل هایی که باید با آنها کار کنید آشنا شوید. اگر در ایجاد آن فایل ها مشکل دارید، می توان از روش افزونه استفاده کرد.
ایجاد پوسته فرزند
ابتدا باید wp-content/themes/ را در پوشه نصب وردپرس خود باز کنید و یک پوشه جدید برای تم فرزند خود ایجاد کنید. شما می توانید این پوشه را هر چیزی که می خواهید نام گذاری کنید. برای این آموزش نام آن را twentytwentyone-child می گذاریم.
Theme Name: twentytwentyone-child
Theme URI: https://blog.pouyasazan.org/
Description: twentytwentyone child theme
Author: pouyasazan
Author URI: https://www.pouyasazan.org/
Template: twentytwentyone
Version: 1.0.0
Text Domain: twentytwentyone child
در مرحله بعد، باید فایل اول را برای پوسته ی فرزند خود ایجاد کنید. با باز کردن یک ویرایشگر متن مانند Notepad شروع کنید. سپس باید کد زیر را در سند خالی قرار دهید.
این کد حاوی اطلاعاتی در مورد Child Theme است، بنابراین با خیال راحت آن را تغییر دهید تا نیازهای خود را برآورده کنید. اکنون این فایل را به عنوان style.css در پوشه فرزند تم که ایجاد کردید ذخیره کنید. این شیوه نامه اصلی Child Theme شما است.
نام پوسته فرزند | Theme Name |
آدرس پوسته | Theme URI |
نام برنامه نویس پوسته | Author |
سایت برنامه نویس | Author URI |
نسخه ی پوسته ی فرزند | Version |
نام پوسته اصلی (والد) | Template |
توجه کنید که حتماً باید نام پوسته اصلی (Template) را وارد کنید. این نام، نام فولدر پوسته اصلی در مسیر پوستههای وردپرس است. مثلاً اگر بخواهید از قالب 2021 پیشفرض به عنوان پوسته پایه استفاده کنید، باید twentytwentyone را بنویسیم.
در مرحله ی بعد کاری که باید انجام دهید این است که یک فایل دوم ایجاد کنید که شیتها را از پوسته ی والد وارد یا در صف قرار دهد. برای انجام این کار، یک سند جدید در ویرایشگر متن خود ایجاد کنید و در آن کد زیر کپی کنید.
کد functions.php :
/* enqueue scripts and style from parent theme */
function twentytwentyone_styles() {
wp_enqueue_style( ‘child-style’, get_stylesheet_uri(),
array( ‘twenty-twenty-one-style’ ), wp_get_theme()->;get(‘Version’) );
}
add_action( ‘wp_enqueue_scripts’, ‘twentytwentyone_styles’);
این کد زمانی کار می کند که از TwentyTwentyOne به عنوان قالب والد استفاده کنید. اگر از قالب والد متفاوتی استفاده می کنید، باید از کدهای متفاوتی استفاده کنید که در کتابچه راهنمای قالب وردپرس توضیح داده شده است.
اگر در تغییر کد برای یک پوسته ی والد دیگر مشکل دارید، ممکن است بخواهید به جای آن از روش افزونه استفاده کنید.
اکنون این فایل را به عنوان functions.php در پوشه ی فرزند خود ذخیره کنید. بعداً به این فایل باز خواهیم گشت تا عملکردی به پوسته ی فرزندتان اضافه کنیم.
نکته: در گذشته تم والد با استفاده از دستور @import در style.css وارد می شد. ما دیگر این روش را توصیه نمی کنیم زیرا زمان مورد نیاز برای بارگذاری شیت ها را افزایش می دهد.
شما اکنون یک Child Theme بسیار ابتدایی ایجاد کردهاید، و وقتی در پیشخوان وردپرس به بخش پوسته ها بروید، باید twentytwentyone-child را ببینید. برای شروع استفاده از پوسته ی فرزند (Child Theme) در سایت خود، باید آن را فعال کنید.
از آنجایی که هنوز چیزی را در پوسته ی فرزند خود تغییر نداده اید، سایت شما از عملکرد و ظاهر پوسته ی اصلی خود استفاده خواهد کرد. توجه داشته باشید که برای سفارشی سازی پوسته خود از این به بعد هر قسمتی را که میخواهید تغییر ایجاد کنید باید دقیقا همان فولدر و فایل را در پوشه ی فرزند خود کپی کنید و تغییرات دلخواه خود را اعمال کنید. هر تغییری که در پوشه ی فرزند اعمال می کنید با به روز رسانی پوسته ی والد از بین نخواد رفت.