راهنمای جامع استفاده از Child Theme در وردپرس

اگر با قالب های وردپرس سر و کار داشته باشید، حتما پیش آمده که عبارت Child Theme یا معادل فارسی آن یعنی پوسته فرزند یا قالب فرزند را شنیده باشید. حتی ممکن است که مشاهده کرده باشید در پکیج قالبی که از سایتی دانلود کرده اید، قالبی هم با عنوان child theme موجود است. یا مثلا ممکن است در جایی به شما توصیه شده باشد که برای سفارشی سازی قالب سایت خود، بجای ویرایش کدهای قالب اصلی، از پوسته فرزند استفاده کرده و آن را به شیوه دلخواه سفارشی کنید. خلاصه امر اینکه اگر این عبارت را شنیده اید ولی دقیقا مطمئن نیستید که child theme چیست و چگونه باید آن را مورد استفاده قرار دهید، آموزش امروز مسترکد، مخصوص شماست.

در این آموزش ابتدا به توضیح کاربرد چایلد تم خواهیم پرداخت. سپس مزایا و معایب آن را بررسی میکنیم. در ادامه نیز یاد خواهیم گرفت که چگونه child theme را نصب کرده و از آن استفاده کنیم. و در آخر نحوه ساخت child theme در وردپرس را شرح خواهیم داد. از شما دعوت میکنیم که در ادامه، همراه ما باشید.

Child Theme چیست؟

وقتی از پوسته فرزند یا child theme صحبت میکنیم، اولین چیزی که به ذهنمان خطور میکند، وجود یک رابطه پدر و فرزندی است. (شما هر یک از والدین را که دوست داشتید در نظر بگیرید ?) منظور از پوسته فرزند، پوسته ایست که ویژگی ها و امکانات خود را از یک قالب والد به ارث میبرد.

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

مثلا بیایید قالب Twenty Seventeen را در نظر بگیریم. اگر شما بخواهید این قالب را سفارشی کرده و کدها یا استایلهای آن را به صورت مستقیم تغییر دهید، با آپدیت بعدی که از طرف وردپرس برای این قالب ارائه میشود، کلیه تغییرات شما از دست رفته و با فایلهای جدید جایگزین خواهند شد. این در حالی است که اگر از پوسته فرزند برای سفارشی سازی قالب مورد نظر استفاده کرده بودید، کلیه تغییرات شما در جای خود باقی میماندند و تنها پوسته والد آپدیت میشد که این امر مشکلی در تغییرات اعمال شده از طرف شما ایجاد نمیکرد.

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

چرا و چه زمانی از Child Theme استفاده کنیم؟

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

استفاده یا عدم استفاده از پوسته فرزند، انتخابی است که بیشتر به نوع نیازهای شما بستگی دارد. گاهی ممکن است تغییراتی که به آنها نیاز دارید بیش از اندازه جزئی یا بیش از اندازه پیچیده باشند، در هردوی این حالات، ممکن است نیازی به استفاده از پوسته فرزند نداشته باشید. مثلا ممکن است بخواهید فقط چند استایل جزئی را در قالبتان تغییر دهید، در این حالت شاید استفاده از بخش “CSS اضافی” در سفارشی ساز وردپرس (customizer) یا استفاده از یک افزونه جانبی ساده، انتخابی کاملا منطقی باشد. اما مثلا اگر بخواهید کل طرح رنگ قالب را تغییر دهید و نحوه نمایش عناصر را به کلی عوض کنید، ممکن است استفاده از یک پوسته فرزند، روش بهتری برای پیاده سازی این امر به نظر بیاید. به هر حال در پایان همه چیز به تصمیم و نیازهای شما بستگی خواهد داشت.

اگر تصمیم دارید در سایت خود از پوسته فرزند استفاده کنید، باید این نکته را هم مد نظر داشته باشید که انتخاب یک پوسته والد با کیفیت و قدرتمند، امری حائز اهمیت است. در واقع زمانی یک قالب ارزش استفاده به عنوان قالب والد یا Parent Theme را دارد که از امکاناتی مناسب و گسترده برخوردار بوده و نکته مهم تر اینکه استاندارد باشد. (مثلا فریم ورک هایی مثل genesis برای استفاده به عنوان قالب والد گزینه ای بسیار عالی هستند)

از طرفی هم اگر در زمان استفاده از پوسته فرزند، قرار باشد، بسیاری از فایل های قالب اصلی را با فایل های سفارشی خود جایگزین کنید، شاید بهتر باشد از روشی به غیر از استفاده از پوسته فرزند استفاده کنید. مثلا فرض کنیم شما تصمیم گرفته اید با استفاده از یک پوسته فرزند، قالب twenty seventeen وردپرس را ویرایش کنید. برای این کار ابتدا استایل های فایل style.css را بازنویسی کرده اید. سپس تغییراتی در کدهای functions.php قالب ایجاد کرده اید. بعد تصمیم گرفته اید نحوه نمایش سربرگ و فوتر قالب اصلی را به طور کلی بازنویسی کنید و … در این شرایط به نظر میرسد آنچه واقعا مد نظر شما بوده، قالب twenty seventeen نیست و شاید بهتر باشد که بجای این کار، کارتان را با یک قالب استارتر شروع کنید و برای خودتون یک پوسته سفارشی بسازید.

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

مزایای استفاده از پوسته فرزند در وردپرس

استفاده از Child theme در وردپرس، مزایا و معایب خاصی را هم به همراه دارد. در ادامه با هم نگاهی به مزیت ها و معایب استفاده از این روش خواهیم پرداخت.

• استفاده از قالب فرزند باعث میشود که آپدیت قالب اصلی مورد استفاده شما (یا همان قالب والد) همیشه به آسانی امکان پذیر باشد. دلیل این مسئله این است که با بهره گیری از پوسته فرزند، و اعمال تغییرات مورد نظرتان روی آن، در زمان ارائه نسخه جدید قالب والد، میتوانید بدون نگران بودن در مورد از دست دادن تغییرات و سفارشی سازی ها، قالب اصلی را بروزرسانی کنید.
• مزیت دیگر استفاده از این روش، آسان شدن توسعه قالب هاست. این مسئله خصوصا در زمان استفاده از فریم ورک ها قابل لمس تر خواهد بود. در صورتی که از یک فریم ورک به عنوان قالب والد خود استفاده کنید، میتوانید با بهره گیری از این روش، تنها بخش های مورد نیاز خود را سفارشی کرده و به سادگی امکانات دلخواهتان را به سایت اضافه کنید.
• وقتی قرار باشد یک پوسته را از پایه طراحی کنید، لازم است که همواره همه جوانب و ویژگی های مورد نیاز سایت را در نظر بگیرید و کد نویسی قالب را به نحوی انجام دهید که در آن همه سناریو های ممکن در نظر گرفته شده باشد. اما وقتی از قالب فرزند استفاده میکنید، حتی اگر کدنویسی و پیاده سازی امکان خاصی را هم فراموش کنید، خیالتان راحت است که قالب والد از پس شرایط احتمالی پیش آمده، برخواهد آمد و آنچه طراحی کرده اید، حتی اگر کامل هم نباشد، پشتوانه ای مناسب برای اجرا خواهد داشت.

معایب استفاده از پوسته فرزند در وردپرس

و اما میرسیم به معایب استفاده از پوسته فرزند …

• ممکن است شرایطی پیش بیاید که توسعه دهندگان قالب والد شما، تصمیم بگیرند دیگر قالب مورد نظر را آپدیت نکنند. یا ممکن است ویژگی را از قالب والد حذف کنند که موجب از کار افتادن child theme شما شود. البته طبعا با توجه به اپن سورس بودن قالب های وردپرس، ممکن است این مسئله، آنقدر ها هم ترسناک نباشد اما به هر حال باید چنین شرایطی را هم در نظر گرفت. بنابراین بهتر است از قالب ها و فریم ورک هایی به عنوان قالب والد استفاده کنید که پشتوانه ای مناسب و آینده ای حی الامکان قابل پیش بینی داشته باشند.
• یکی دیگر از معایب استفاده از پوسته فرزند، زمانی است که باید صرف یادگیری نحوه کارکرد پوسته یا فریم ورک والد شود. طبعا وقتی کار با یک قالب جدید را به عنوان قالب والد انتخاب میکنید، لازم است که مدتی را صرف آشنایی با بخش های مختلف و امکانات آن بکنید تا بتوانید پوسته فرزند خود را به خوبی بر اساس آن بنا کنید. البته این مسئله چیزی نیست که بخواهید بخاطر آن از به کار گیری child theme ها پرهیز کنید. خصوصا در صورتی که قصد استفاده از یک فریم ورک را داشته باشید، کافی است یک بار زمان کافی را صرف آشنایی با فریم ورک مورد نظر کنید تا از این پس، سرعت توسعه شما با استفاده از این فریم ورک به شکل چشم گیری افزایش پیدا کند.

آموزش ساختن Child Theme در وردپرس

ایجاد child theme در وردپرس به دو شیوه امکان پذیر است. در آموزش امروز ما به شرح یکی از شیوه ها خواهیم پرداخت و مطالعه درباره روش دوم را به شما میسپاریم. (مطالعه روش دوم در سایت رسمی وردپرس) برای ایجاد پوسته فرزند میتوانید به شکل زیر عمل کنید :

1 – ابتدا یک فولدر برای پوسته فرزند خود ایجاد کنید. برای نامگذاری فولدر بهتر است از فرمت نام قالب والد به همراه عبارت child پیروی کنید. مثلا اگر نام قالب والد ما mrcode باشد، نام پوسته فرزند را به شکل mrcode-child انتخاب میکنیم. (این شیوه نامگذاری اجباری نیست)

2 – یک تصویر مناسب با نام screenshot با فرمت png یا jpg در این فولدر قرار دهید. این تصویر را میتوانید از پوسته والد کپی کنید یا اینکه خودتان تصویری را به دلخواه ایجاد کنید.

3 – یک فایل با نام style.css ایجاد کرده و اطلاعات قالب فرزند را در آن قرار دهید و سپس استایلهای پوسته والد را نیز در آن فراخوانی کنید. مثلا :

واضح است که اطلاعات درج شده در بالا تنها مثال بوده و لازم است که آنها را با اطلاعات صحیح جایگزین کنید. در کد بالا توجه ویژه ما باید به خط 8 باشد. درج عبارت Template: mrcode در این بخش به وردپرس میگوید که قالب فعلی ما یک Child Theme بوده و پوسته والد آن در فولدر mrcode قرار گرفته. توجه داشته باشید که حروف کوچک و بزرگ در اینجا حائز اهمیت هستند بنابراین نام فولدر پوسته والد را به طور دقیق در اینجا وارد کنید. همچنین در خط 11 که استایلهای پوسته والد را فراخوانی کرده ایم، لازم است که بجای عبارت mrcode نام فولدر پوسته والد مورد نظرتان را وارد کنید.

4 – همین کار را برای فایل rtl.css نیز تکرار کنید. حتی اگر پوسته والد شما فاقد فایل rtl.css باشد نیز وردپرس توصیه میکند این فایل را ایجاد کرده (و سر فرصت استایلهای مناسب را برای آن ایجاد کنید) اگر پوسته والد شما دارای فایل rtl.css است، فراموش نکنید که آن را به شیوه ای که در مرحله قبل گفته شد، در فایل rtl.css پوسته فرزندتان فراخوانی کنید. اگر هم پوسته والد فاقد این استایلهاست، نیازی به فراخوانی فایل مورد نظر نخواهد بود.

5 – یک فایل با نام functions.php جهت ویرایش های بعدی ایجاد کرده و کد زیر را در آن قرار دهید تا امکان استفاده از php در آن میسر باشد :

کدهایی که لازم است در فایل توابع قالب قرار بگیرند را میتوانید از این پس در این قسمت مورد استفاده قرار دهید.

حالا میتوانید پوسته فرزندتان را دقیقا مثل هر پوسته دیگری در وردپرس نصب کرده و به کار بگیرید. از این پس میتوانید استایلها و کدهای مورد نیازتان را به فایلهایی که همین حالا در پوسته فرزندتان ایجاد کرده اید اضافه کنید و دیگر نیازی به ویرایش کردن پوسته اصلی تان نخواهید داشت. توجه داشته باشید که شیوه ای که ما در این آموزش برای فراخوانی استایلها استفاده کردیم (@import) هرچند آسان است، ولی روش بهینه ای نیست. بنابراین اگر مایلید با روش بهینه تر انجام این کار آشنا شوید، توصیه میکنیم سری به راهنمای درج شده در سایت رسمی وردپرس بزنید. (لینک در پاراگراف اول همین بخش) (بعلاوه، آموزش روش صحیح افزودن فایل css به قالب وردپرس را هم مطالعه کنید)

آموزش نصب Child Theme در وردپرس

در واقع در اینجا اصلا نیازی نیست که هیچ توضیح خاصی درباره نصب چایلد تم به شما ارائه کنیم! باور نمیکنید؟ دلیل این مسئله این است که نصب Child theme در وردپرس، دقیقا مثل نصب همه ی قالب عادی دیگر در وردپرس صورت میگیرد. مسترکد قبلا نصب قالب در وردپرس را برایتان به طور مفصل شرح داده است. (برای مطالعه آموزش نصب قالب در وردپرس کلیک کنید)

بنابراین برای نصب چایلد تم، ابتدا بایل پوسته فرزند ارائه شده به همراه قالب مورد نظرتان را به روش مرسوم نصب قالب در وردپرس، نصب کنید (یا اگر قالبتان چایلد تم ندارد، به شیوه ای که برایتان شرح دادیم، یکی برایش ایجاد کنید) سپس آن را فعال کرده و به سفارشی سازی و استفاده از آن بپردازید. در اینجا نکته ای که حائز اهمیت است و لازم است به آن اشاره کنیم این است که پوسته فرزند، بدون حضور پوسته والد خود در وردپرس، کار نخواهد کرد. همانطور که حتما تا حالا متوجه شده اید، پوسته فرزند به پوسته والد، وابستگی کامل داشته و کار کردن آن مستلزم وجود پوسته والد در سایت شماست. بنابراین فراموش نکنید که پوسته والد را از سایتتان حذف نکنید. (نیازی نیست که پوسته والد فعال باشد، تنها وجود آن کافی است)

سخن پایانی

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

سوالات، نظرات و نکاتی که به ذهنتان میرسد را با ما در بخش دیدگاه ها به اشتراک بگذارید و اگر نکته ای را در این آموزش از قلم انداخته ایم، حتما به آن اشاره کرده و با این کار به تکمیل تر شدن این آموزش کمک کنید.

در پایان مطالعه آموزش های زیر را نیز به شما توصیه میکنم :

آموزش طراحی قالب وردپرس

آموزش راستچین کردن قالب وردپرس

آموزش فارسی سازی قالب و افزونه های وردپرس

آموزش اضافه کردن فونت دلخواه به قالب