آموزش ساخت Child Theme برای قالب وردپرس

چرا باید از Child تم در وردپرس استفاده کنید

از آنجا که موضوع Child برای تم بسیار مهم است و تم Child یا همون تم کودک اطلاعات و صفات خود را از مادر خود یعنی تم اصلی به ارث می برد .

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

تم Child در وردپرس چگونه کار می کند

همانطور که قبلاً به طور خلاصه به آن اشاره شد ، یک تم Child تمامی ویژگی هایش را از وارث خود یعنی تم اصلی میگیرد . هر یک از تم های Child حداقل دارای ۲ فایل Style.css و functions.php است. می توانید فایل های دیگر را باتوجه به نیاز اضافه کنیم ولی این ۲ فایل اصلی این تم ها می باشد.

با تم های Child  می توانید از اضافه کردن استایل گرفته تا اسکریپت و … به قالب اصلی خود لذت ببرید بدون آنکه به قالب اصلی دست زده باشید .

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

آموزش و نحوه مرحله به مرحله  ایجاد قالب Child برای پوسته وردپرس

این آموزش رو به صورت مثال و با قالب اصلی وردپرس یعنی بیست بیست یا twentytwenty آغاز می کنیم که کاملا درک آن برای شما آسان شود .

مرجله اول : ایجاد فولدر و یا پوشه قالب Child

ابتدا وارد هاست خود شوید و فولدر یا پوشه ای به نام twentytwenty-child ایجاد نمایید .

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

  public_html -> wp-content -> themes

نکته ی مهم : در نام فولدر انتخابی به هیچ عنوان از فاصله استفاده نکنید و (-) را جایگزین کنید تا از بروز خطاها جلوگیری شود .

مرحله دوم : ساخت فایل style.css

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

/* 
Theme Name: Twenty Twenty  Child 
Theme URL: http://yourdomain.com
Description: Twenty Twenty  Child 
Theme Author: Your Name
Author URL: http://yourdomain.com
Template: twentytwenty 
Version: 1.0.0 
Text Domain: twentytwenty-child 

Theme Name: نام پوسته شما
Theme URL: آدرس سایت توسعه دهنده
Description: توضیحات قالب شما
Theme Author: نام نویسنده قالب
Author URL: آدرس سایت نویسنده قالب 
Template: نام تم اصلی قالب
Version: نمایش ورژن قالب
Text Domain: این نام برگرفته از نام قالب اصلی + Child می باشد 

مرحله سوم : ایجاد فایل functions.php

خوب برای این کار همانند ساخت فایل style.css عمل کنید و در کنار آن فایلی به نام functions.php ایجاد کنید و محتوای زیر را در آن ذخیره کنید .

<?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );

function enqueue_parent_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}
?>

مرحله چهارم : فعال سازی قالب

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

آموزش سفارشی سازی قالب Child

برای سفارشی سازی قالب شما نیاز به درک css دارید و به راحتی می توانید کد های سی اس اس خود را در قالبتان ثبت کنید .

برای اینکه کد های خود را در قالب ثبت کنید شما می توانید هم در فایل style.css خود بارگزاری کنید و هم میتوانید در قسمت پیشخوان > نمایش > سفارشی سازی > css اضافی وارد شوید و سی اس اس خود را بارگزاری کنید .

تعویض رنگ پشت زمینه :

پس از ورود به بخش پیشخوان > نمایش > سفارشی سازی > css اضافی کد های css زیر را وارد و ذخیره کنید .

.site-content-contain {
    background-color: #DEF0F5;
    position: relative;
}

مشاهده می کنید تصویر پشت زمینه قالب اصلی تغییر کرده است .

امیدوارم این آموزش هم نیاز شما را برطرف کرده باشه .

موفق باشید 

مشاوره و راهنمایی رایگان

پاسخ سوالات در مورد تمامی خدمات نوین سایت