معرفی و بررسی Child Theme در وردپرس

Child Themeهای وردپرس ابتدا ممکن است کمی مبهم به نظر برسند، اما هنگامی که نکات آن را یاد بگیرید، به زیبایی‌های آن پی می‌برید و بسیار لذت‌بخش خواهند بود.

Child Theme چیست؟

Child Theme در اصل یک پوسته وردپرس است که فایل‌ها و قابلیت‌ها را از قالب دیگری که به عنوان قالب اصلی شناخته می‌شود، دریافت می‌کند.

ابتدایی‌ترین Child Theme در وردپرس فولدری حاوی یک فایل style.css است. یکی از سؤالاتی که احتمالا اکنون در ذهن شما نقش بسته این است که چرا باید از یک Child Theme استفاده کنیم با این‌که Parent Themeهای زیادی وجود دارد؟

پاسخ بسیار ساده است. بیشتر Parent Themeها هر از گاهی به‌روزرسانی می‌شوند. بنابراین اگر یک قالب اصلی داشته باشید و بخواهید کدها و استایل‌های آن را سفارشی‌سازی کنید، دفعه بعد که قالب به‌روزرسانی شود، همه این تغییرات را از دست خواهید داد. در چنین شرایطی Child Themeها به کمکتان می‌آیند. به این صورت که اجازه می‌دهند Parent Theme خود را بدون خطر از دست دادن تغییرات هنگام به‌روزرسانی، سفارشی‌سازی کنید. البته اگر برایتان مهم نیست که وب سایتتان در معرض حمله هکرها قرار گیرد، می‌توانید به‌روزرسانی را غیرفعال کنید.

قبل‌تر اشاره کردیم که Child Themeها عملکردشان را از قالب اصلی می‌گیرند. اما چگونه این اتفاق می‌افتد؟ Child Themeها را به عنوان یک قالب زیرمجموعه در نظر بگیرید، چرا که ویژگی‌های Parent Theme خود را تقلید می‌کنند. این مانند ایجاد یک کپی از قالب اصلی است بدون این‌که چیزی کپی شود! شبیه جادو به نظر می‌رسد، درست است؟

در واقع راز آن تنها یک خط کد است که در style.css یافت می‌شود. در ادامه یک Child Theme را ایجاد خواهیم کرد و چند مفهوم اساسی را معرفی می‌کنیم تا خطی که در مورد آن صحبت کردیم آشکار شود و درک بهتری از Child Themeها به شما بدهد.

به منظور ساخت Child Theme باید یک فولدر در قالب‌های وردپرس خود ایجاد کرده و به دلخواه آن را نام‌گذاری کنید. سپس یک style.css با کد زیر ایجاد نمایید:

/*
Theme Name : The name of your child theme (e.g. Total Child Theme)        
Theme URI: http://www.example.com (Your child theme's URL
Description: A brief description of your child theme
Author: Your name goes here
Template: Your parent theme directory name (e.g. Total, twentyfourteen, etc)
Version: 1.0.
*/

بعد این style.css را در فولدر Child Theme خود ذخیره کنید. حالا به خط ششم کد بالا برگردید.

این خط به Child Theme شما می‌گوید که از کدام Parent Theme توابع و فایل‌های قالب را بگیرد. همین خط ساده، Child Theme شما را به قالب اصلی متصل کرده و به عنوان پل ارتباطی عمل می‌کند که از طریق آن Child Theme، فایل‌های قالب و قابلیت‌های Parent Theme دریافت می‌‌شوند. این بدان معناست که شما باید Parent Theme را روی پلتفرم وردپرس خود نصب کنید.

بنابراین بدون این خط Child Theme نخواهید داشت. برای این کار فقط به یک فولدر و یک فایل style.css معمولی نیاز دارید.

به طور خلاصه وقتی Child Theme خود را فعال می‌کنید، خط Template قالب اصلی شما را به ارث می‌برد. همچنین اگر زمانی Parent Theme خود را به‌روزرسانی کنید، تمام تغییراتی که در Child Theme ایجاد کرده‌اید دیگر از بین نمی‌روند.

مزایای استفاده از Child Theme

استفاده از Child Theme مزایای زیادی دارد و به همه توصیه می‌کنیم که برای سفارشی‌سازی قالب وب سایت خود، آن را تنظیم و فعال کند. در ادامه برخی از مزایای کلیدی استفاده از Child Theme را لیست کرده‌ایم.

- به‌روزرسانی‌های امن

Child Themeهای وردپرس فقط توابع، کد‌ها و استایل‌ها را از قالب اصلی می‌گیرند که به شما امکان می‌دهد وب سایتتان را بدون دستکاری Parent Theme سفارشی‌سازی کنید. بنابراین هر زمان که توسعه دهندگان قالب اصلی شما را به‌روزرسانی کنند، می‌توانید با خیال راحت وب سایت خود را بدون از دست دادن تغییرات انجام شده آپدیت نمایید.

- Child Themeها به راحتی قابل توسعه هستند

Child Themeهای وردپرس به شما انعطاف‌پذیری زیادی می‌دهند. به این صورت می‌توانید قالب جدیدی ایجاد کنید که بخشی از قالب اصلی نیست اما توابع، استایل‌ها و ویژگی‌های دیگر آن را استفاده می‌کند. همچنین فریمورک‌های زیادی هم برای توسعه این قالب‌ها وجود دارند.

- Child Themeها ایمن هستند

هر توسعه دهنده‌ای انسان است و همه ما می‌دانیم که انسان جایزالخطاست. همه اشتباه می‌کنند و اشتباهات هم فراموش می‌شوند. مثلا اگر هنگام استفاده از یک Parent Theme فراموش کردید قسمتی را کدنویسی کنید، خروجی با مشکل مواجه خواهد شد. اما این موضوع در Child Themeها کمی متفاوت است. یعنی اگر کدی را فراموش کنید، وردپرس به طور خودکار یک جایگزین را از قالب اصلی برای آن بارگیری می‌کند. البته این تنها در صورتی است که کد در قالب اصلی وجود داشته باشد.

معایب استفاده از Child Theme

با این‌که به طور کلی Child Themeها عالی هستند و استفاده از آن‌ها به شدت توصیه می‌شود، اما معایبی هم دارند که باید در نظر گرفت.

- منحنی یادگیری

Child Themeها اساسا برای گسترش یا سفارشی‌سازی قالب اصلی استفاده می‌شوند. پس اگر توسعه دهنده نیستید، نمی‌توانید با آن‌ها کارهای زیادی انجام دهید و باید کدنویسی را یاد بگیرید. بدین منظور به زمان نیاز دارید تا کارکرد قالب‌های اصلی و وردپرس را همراه با کمی کدنویسی به طور کلی بیاموزید تا بتوانید از پتانسیل کامل Child Themeها نهایت استفاده را ببرید.

- تغییرات قالب اصلی

اگر وب سایت خود را حول یک قالب اصلی ساخته‌اید، ممکن است مجبور شوید چند چیز مانند منوها، ویجت‌ها و یا امکانات قالب هنگامی که تغییراتی در Child Theme خود ایجاد می‌کنید را تغییر دهید. برخی از قالب‌ها تنظیمات را در پایگاه داده بر اساس نام قالب ذخیره می‌کنند، بنابراین وقتی Child Theme خود را تغییر می‌دهید، ممکن است به نظر برسد که تمام تنظیمات Parent Theme را از دست داده‌اید اما نگران نباشید چون آن‌ها در پایگاه داده امن هستند. در این صورت باید به Parent Theme خود برگردید تا بتوانید تنظیمات را کپی کرده و آن‌ها را منتقل کنید. اغلب برای قالب‌ها یک پنل کاربری در داشبورد ارائه می‌‌شود تا بتوانید تنظیمات آن را قبل از تغییر در Child Theme کپی کرده و از طریق گزینه Import / Export به راحتی منتقل نمایید.

به علاوه هنگام استفاده از Child Themeها برای ارائه عملکردهای اضافی به سایت خود اگر Parent Theme را تغییر دهید، ممکن است مجبور شوید برخی از عملکردها را به یک Child Theme جدید منتقل کنید یا نام Child Theme فعلی خود را تغییر دهید یا از یک پلاگین کمک بگیرید.

چگونه یک Child Theme در وردپرس ایجاد کنیم؟

ابتدا وارد پنل وردپرس خود شوید، سپس دایرکتوری …/wp-content/themes را باز کرده و داخل آن یک فولدر با نام دلخواه ایجاد کنید تا در ادامه فایل style.css مد نظر را آنجا ذخیره نمایید.

توجه: هم می‌توانید از طریق File Manager در cPanel خود به دایرکتوری themes دسترسی داشته باشید و هم در صورت فعال بودن FTP می‌توانید از یک کلاینت مانند FileZilla استفاده کنید.

در مرحله بعد، ویرایشگر متن خود را باز کرده (مثلا Notepad++) و یک فایل style.css با اطلاعات زیر ایجاد کنید:

/*
Theme Name : The name of your child theme (e.g. Total Child Theme)
Theme URI: http://www.example.com (Your child theme's URL)
Description: A brief description of your child theme
Author: Your name goes here
Template: Your parent theme directory name (e.g. Total, twentyfourteen, etc)
Version: 1.0.0
*/

این همان کدی است که قبلا استفاده می‌کردیم.

فایل style.css را در فولدر Child Theme آپلود کنید. در این مرحله فایل style.css شما خالی است (به غیر از خطوط بالا که هیچ استایلی ندارند)، بنابراین انتظار نداشته باشید که قالب ایجاد شده چیزی شبیه به Parent Theme باشد. اما در ادامه می‌توانید با ایجاد یک فایل جدید با نام functions.php در فولدر Child Theme و افزودن کد PHP زیر، style.css قالب اصلی خود را وارد کنید:

function total_child_enqueue_parent_theme_style() {
        
        // Dynamically get version number of the parent stylesheet (lets browsers re-cache your stylesheet when you update your theme)
        $theme   = wp_get_theme( 'Total' );
        $version = $theme->get( 'Version' );
        
        // Load the stylesheet
        wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css', array(), $version );
        
}
add_action( 'wp_enqueue_scripts', 'total_child_enqueue_parent_theme_style' );

حتما بخش Total را تغییر داده و نام قالب اصلی خود را قرار دهید. این کد به Child Theme شما اجازه می‌دهد تا به صورت داینامیک شماره نسخه اضافه شده به style.css قالب اصلی را به‌روزرسانی کند، بنابراین وقتی Parent Theme به‌روزرسانی می‌شود اگر تغییراتی در فایل style.css آن ایجاد گردد، به مرورگر و CDN شما امکان می‌دهد stylesheet را در حافظه کش قرار داده و از بروز مشکلات احتمالی در هنگام مشاهده صفحه جلوگیری شود.

سفارشی کردن Child Theme

حالا به قسمت جذاب کار می‌رسیم. ما معمولا Child Theme را برای سفارشی‌سازی قالب اصلی ایجاد می‌کنیم. بدین منظور فقط کافی است استایل‌های خود را به فایل style.css اضافه کنیم. سپس به صورت خودکار استایل‌های مشابه موجود در قالب اصلی لغو می‌شوند.

برای ویرایش فایل‌های template هم ابتدا آن‌ها را در Child Theme کپی کرده و سپس تغییرات را در آنجا اعمال کنید. اما همه فایل‌ها را نمی‌توان در Child Theme کپی کرد و تغییر داد، فقط می‌توانید فایل‌های template را کپی کنید. بنابراین اگر قالب دارای فایل‌های خاصی برای include، inc، functions یا فولدر‌های دیگری است که کلاس‌ها و توابع سفارشی را در خود نگه می‌دارد، ممکن است نتوانید آن‌ها را کپی کنید و تغییر دهید. برای این کار باید به دنبال استفاده از فیلترها یا اکشن هوک‌ها برای تغییر توابع پیش‌فرض Parent Theme باشید.

همچنین می‌توانید فایل‌های template سفارشی را به Child Theme خود به منظور عملکردهای بیشتر اضافه کنید.

از فایل functions.php نیز برای افزودن توابع سفارشی و استفاده از Parent Theme یا فیلترهای وردپرس استفاده نمایید. به یاد داشته باشید که هرگز توابع جدید را به فایل functions.php در Parent Theme خود اضافه نکنید!

وردپرس ابتدا فایل‌های تمپلیت و استایل‌ها را در Child Theme شما بارگیری می‌کند و اگر چیزی از دست رفته باشد، فایل‌های مربوطه را در قالب اصلی قرار می‌دهد.

جمع‌بندی

Child Theme در وردپرس برای سفارشی‌سازی و توسعه‌پذیری بسیار قدرتمند هستند. به علاوه زمینه خوبی را برای هر کسی که به دنبال یادگیری توسعه قالب وردپرس است، فراهم می‌کنند. ایجاد آن‌ها ساده و سرگرم‌کننده است و گزینه‌های زیادی در اختیار شما قرار می‌دهد تا سایت وردپرسی خود را به هر شکلی که دوست دارید تغییر دهید. اگر به یادگیری وردپرس و Child Themeها علاقه دارید می‌توانید از دوره آموزش وردپرس بدون کدنویسی استفاده کنید. 

منبع