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

اینکه بخواهید پوسته سایت‌تان را ویرایش کنید و چیزی را به آن اضافه کنید و یا از آن حذف کنید، به طور حتم حق مسلم شماست، اما یک مشکل کوچک و البته مهم وجود دارد!

همانطور که خودتان اطلاع دارید وردپرس به طور مدام در حال بروزرسانی بوده و به دنبال آن افزونه ها و پوسته ها نیز بروزرسانی می شوند.

این بدان معناست که اگر شما تغییراتی را در پوسته سایت خود اعمال کرده باشید، به هنگام بروزرسانی پوسته از بین خواهند رفت. پس چاره کار چیست؟ از پوسته فرزند (child theme) استفاده کنید.

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

این کار سه مزیت را برای شما به همراه خواهد داشت:

  1. در صورتی که تغییراتی اعمال کرده باشید، با بروزرسانی پوسته از بین نخواهند رفت.
  2. در صورت بروز مشکل به هنگام تغییرات می توانید پوسته فرزند را حذف کنید تا سایت دچار مشکل نشود.
  3. استفاده از پوسته های فرزند باعث شناخت بهتر شما از ساختار پوسته های وردپرس می شود.

اکنون تا با اینجا می دانید که منظور از پوسته فرزند چیست و چه کاربردی دارد. پس به سراغ آموزش استفاده از آن می رویم.

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

ابتدا از طریق کنترل پنل هاست یا FTP یک پوشه جدید در مسیر پوسته های وردپرس (site/wp-content/themes) ایجاد کنید.

نام پوشه را test-child وارد کنید. البته نام پوشته را می توانید هرچه که می خواهید وارد کنید اما بهتر است که ابتدا نام پوسته اصلی را بنویسید و سپس عبارت child را به آن اضافه کنید تا بعدها متوجه شوید که آن پوشه مربوط به پوسته فرزند کدام پوسته است.

پس از ایجاد پوسته لازم است که آن را به وردپرس شناساند و بدین منظور حتما می دانید که از فایل style.css استفاده می شود. بنابراین فایل ذکر شده را ایجاد کرده و کدهای زیر را به آن اضافه کنید:

/*
Theme Name: Test Child Theme
Theme URI: https://wprahnama.com
Description: Test Child Theme
Author: Payam
Author URI: https://wprahnama.com
Template: test
Version: 1.0
*/

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

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

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

تغییرات در استایل سایت

برای اعمال تغییرات در ظاهر سایت از فایل استایل استفاده می شود. در واقع تغییرات ظاهری سایت را می توانید در همان فایل style.css وارد کنید.

تغییرات در امکانات سایت

امکانات سایت همان کدها و توابع PHP هستند که در فایل functions.php نگه داری می شود. بنابراین اگر بخواهید تغییراتی را در این خصوص اعمال کنید، یک فایل با همین نام در پوسته فرزند ایجاد کرده و تغییرات خود را در آن وارد کنید.

تغییر در ساختار سایت

تغییرات همیشه به تغییر دادن رنگ و افزودن چند تا امکان خلاصه نمی شود. گاهی اوقات ممکن است پوسته انتخابی قسمت های اضافی داشته باشد که به آنها نیازی ندارید و یابرعکس! در این حالت باید تغییراتی در ساختار کدنویسی HTML اعمال کرد.

بدین منظور همانند روش های قبل باید عمل کنید. برای مثال اگر می خواهید به هدر سایت المان هایی را اضافه کنید، می توانید فایل header.php پوسته مادر را در پوسته فرزند کپی کرده و سپس اقدام به ویرایش کنید. در واقع وردپرس هر فایلی را که در پوسته فرزند وجود داشته باشد را به فایل اصلی ترجیح خواهد داد.

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

تا به این قسمت ما پوسته فرزند را ایجاد کردیم و تغییرات خود را در آن اعمال کرده ایم.شاید فکر کنید که کار تمام است – اما این چنین نیست! کافیست که پوسته فرزند را فعال کرده و سایت خود را مشاهده کنید؛ بله سایت بهم ریخته است! چراکه ما کدهای استایل پوسته مادر را هنوز به پوسته فرزند معرفی نکرده ایم. همانطور که بالاتر گفته شد، در صورتی که فایلی در پوسته فرزند وجود داشته باشد، وردپرس آن فایل را دیگر از پوسته مادر فراخوانی نخواهد کرد و ما در اینجا فایل style.css را ایجاد کردیم که باعث می شود که فایل استایل پوسته اصلی دیگر استفاده نشود.

برای اینکه فایل style.css پوسته مادر را استفاده کرد می توان از دستور @import در فایل استایل پوسته فرزند استفاده کرد، اما بهتر است که از این روش استفاده نکنید؛ چراکه می تواند موجب کاهش سرعت بارگذاری فایل ها و در نهایت سایت شود. به همین دلیل از تابع wp_enqueue_style و اکشن ها استفاده می کنیم.

کدهای زیر را به فایل functions.php پوسته فرزند اضافه کنید (اگر تا با اینجا این فایل را ایجاد نکرده اید، اکنون ایجاد کنید و فراموش نکنید که آن موقع از تگ های آغازین و پایانی پی اچ پی استفاده کنید):


نکته: پس از اینکه پوسته فرزند را فعال کردید، فهرست ها و تنظیماتی مانند تصویر سربرگ و تصویر پس زمینه را باید مجددا ذخیره کنید.