ทำไมคุณไม่ควรปรับแต่งWordPressในธีมหลักที่มีอยู่? จะเกิดอะไรขึ้นกับการปรับแต่งของคุณเมื่ออัปเดตธีมที่คุณใช้อยู่

คำตอบคือหายไป และการทำงานหนักของคุณเพื่อสร้างไซต์ของคุณตามแนวทางของแบรนด์และการรับส่งข้อความและการตั้งค่าจะหายไปด้วย

ธีมลูกช่วยให้คุณสร้างสไตล์ชีต CSS แยกต่างหาก^{(child theme enables you to create a separate CSS stylesheet)}และเพิ่มฟังก์ชันการทำงานเพิ่มเติมที่จะไม่สูญหายหรือได้รับผลกระทบเมื่อมีการอัปเดตธีมหลัก

สามารถทำได้ด้วยตนเองหรือโดยการติดตั้งปลั๊กอินผู้สร้างธีมลูก เริ่มต้นด้วยกระบวนการแบบแมนนวล

สร้างไดเร็กทอรีใหม่^{(Create a New Directory)}

เริ่มต้น^(Start)ด้วยการสร้างไดเร็กทอรีใหม่สำหรับธีมลูกของคุณ คุณสามารถใช้ไคลเอนต์ FTP^{(FTP client)}หรือเข้าถึง ไดเร็กทอรี wp-content/themes ที่มีอยู่ ผ่าน cPanel ของคุณ

ในการใช้ cPanel ไปที่แผงควบคุมโฮสติ้งของคุณ เลือกตัวจัดการไฟล์^{(file manager)}และไปที่ไดเร็กทอรีที่ติดตั้งWordPress

ซึ่งมักจะอยู่ใน ไดเร็กทอรีชื่อpublic_html ค้นหาและเปิดโฟลเดอร์wp-content คลิกที่สร้างโฟลเดอร์ใหม่^{(create new folder)}และป้อนชื่อสำหรับธีมลูกของคุณ อย่าลืมตั้งชื่อที่คุณจะจำได้ในภายหลัง ตัวอย่างที่ดีคือnameofparenttheme -child^{(nameofparenttheme-child)}

อย่าใส่ช่องว่างในชื่อไฟล์ของคุณเพื่อหลีกเลี่ยงข้อผิดพลาด

เนื่องจากการจัดการภายใน ชื่อโฟลเดอร์ต้องมีชื่อของธีมหลัก (ธีม 'slug') ตามที่แสดงในตัวอย่างด้านล่าง

สร้าง CSS สไตล์ชีต^{(Create a CSS Stylesheet)}

สไตล์ชีตใช้ใน ธีม WordPressด้วยเหตุผลสองประการ

• เป็นตำแหน่งของสไตล์ที่ส่งผลต่อรูปลักษณ์ของไซต์ของคุณ
• สไตล์ชีตหลักของธีมเป็นที่ที่ WordPress มองหาข้อมูลเกี่ยวกับธีมนั้น

คุณอาจไม่ต้องการเพิ่มสไตล์ใหม่ในธีมย่อย อย่างไรก็ตาม สไตล์ชีตยังคงต้องมีอยู่เพื่อกำหนดข้อมูลเฉพาะ เช่น ชื่อธีมและชื่อธีมหลัก

ดังนั้น คุณต้องสร้างสไตล์ชีตใหม่สำหรับธีมลูกของคุณ ดังนั้น ขั้นตอนต่อไปของคุณคือการสร้างไฟล์ข้อความสำหรับ สไตล์ชีต CSSซึ่งจะกำหนดกฎเกณฑ์ที่ควบคุมรูปลักษณ์ของธีมลูกของคุณ

ไฟล์ CSS^(CSS)ของธีมลูกจะมีความสำคัญเหนือกว่าธีมหลัก

คุณต้องใส่ข้อมูลต่อไปนี้ในไฟล์ข้อความของคุณ:

• ชื่อธีมของคุณ
• ชื่อของไดเร็กทอรีธีมหลัก
• ชื่อเรื่องและคำอธิบายที่เหมาะสม

อย่าลืมใส่ความคิดเห็นส่วนหัวต่อไปนี้ที่ด้านบนของไฟล์ในสไตล์ชีต WordPressจะอ่านข้อมูลนี้และรู้ว่ามีการใช้ธีมลูก

คุณต้องการให้ความสำคัญกับแท็กเทมเพลต มันบอกWordPressว่าธีมหลักของลูกของคุณคืออะไร โปรดทราบว่าโฟลเดอร์ที่ธีมหลักของคุณตั้งอยู่นั้นจะคำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่

ในทางเทคนิค คุณสามารถเปิดใช้งานธีมลูกของคุณได้แล้ว อย่างไรก็ตาม หากคุณต้องการสร้างธีมลูกที่ซับซ้อนกว่านี้ คุณจะต้องเพิ่มฟังก์ชันPHP ที่กำหนดเอง^(PHP)

สร้าง ไฟล์ functions.phpในธีมย่อย (ในไดเร็กทอรีเดียวกันกับไฟล์ style.css^(style.css) ที่ คุณสร้าง) นี่คือที่ที่ควรเพิ่มสิ่งต่าง ๆ เช่นรูปแบบโพสต์เพิ่มเติม

เช่นเดียวกับ ไฟล์ CSSการเปลี่ยนแปลงหรือส่วนเพิ่มเติมใน ไฟล์ PHP ของคุณ จะถูกรวมเข้ากับหรือแทนที่ฟังก์ชันของพาเรนต์โดยอัตโนมัติ

สำหรับสิ่งต่างๆ เช่น รูปแบบโพสต์ที่เพิ่มด้วยadd_theme_support()จะทำหน้าที่เป็นการแทนที่แทนการรวม

เมื่อใช้add_theme_support()คุณต้องทำตามขั้นตอนเพิ่มเติมเพื่อให้แน่ใจว่าธีมลูกจะแทนที่พาเรนต์

สิ่งนี้อาจซับซ้อน ดังนั้นโปรดอ้างอิงถึงทีมตรวจสอบธีม WordPress^{(WordPress Theme Review Team)} ปัจจุบัน โพสต์ ของ William Patton เกี่ยวกับการใช้รูปแบบโพส ต์  WordPress^{( post on using WordPress post formats)}

เพิ่มสไตล์และสคริปต์เพื่อแทนที่การทำงานของธีมหลัก^{(Add Styles & Scripts To Override Parent Theme Functionality)}

ขั้นตอนต่อไปของคุณคือการทำให้แน่ใจว่าธีมลูกของคุณสืบทอดคุณสมบัติและสไตล์ของธีมหลักหรือสะท้อนถึงธีมใหม่ที่คุณต้องการใช้

สไตล์ใช้เพื่อเปลี่ยนรูปลักษณ์ของเว็บไซต์ของคุณ สคริปต์^(Scripts)ปรับปรุงการทำงาน วิธีเพิ่มสไตล์และสคริปต์ใน ไซต์ WordPress ของคุณ มีความสำคัญพอๆ กับเนื้อหาของไฟล์

ฟังก์ชัน enqueue ของ WordPress คือวิธีการทำให้สำเร็จ

การจัดคิวหมายถึงวิธีการเพิ่มสไตล์และสคริปต์ลงใน ไซต์ WordPressเพื่อให้สามารถส่งผลต่อสิ่งที่ผู้ใช้เห็นเมื่อเข้าชมไซต์ของคุณ

การใช้ปลั๊กอินจำนวนมากเพื่อให้ได้ผลลัพธ์แบบเดียวกันมักจะนำไปสู่ปัญหาความเข้ากันได้และไซต์ที่ใช้งานไม่ได้

Wp_enqueueไม่เพียงแต่ปรับปรุงประสิทธิภาพของเว็บไซต์ของคุณโดยการลดโอเวอร์เฮดของปลั๊กอิน แต่ยังช่วยปรับปรุงประสบการณ์ของผู้ใช้อีกด้วย

วิธีใช้ 'wp_enqueue'^{(How To Use ‘wp_enqueue’)}

ในการส่งออกสไตล์สำหรับธีมลูกของคุณ คุณจะต้องใช้ฟังก์ชันที่เรียกว่าwp_enqueue_style( )

ฟังก์ชันนี้ใช้ข้อมูลเพียงเล็กน้อย แต่ที่สำคัญที่สุดคือชื่อ (หรือ 'จัดการ') และตำแหน่งของไฟล์

ภายใน ไฟล์ functions.phpให้เพิ่มโค้ดต่อไปนี้

รหัสนี้จะเพิ่มสไตล์ชีตจากไดเร็กทอรีหลัก และเพิ่มสไตล์ชีตสำหรับเด็กที่เราสร้างไว้ก่อนหน้านี้ โปรดทราบว่า ข้อความ รูปแบบหลัก^{(parent-style)}ควรตรงกับชื่อของชุดรูปแบบหลักโดย เพิ่ม -styleต่อท้าย

เปิดใช้งานธีมลูกของคุณ^{(Activate Your Child Theme)}

หากคุณสร้างไฟล์สำหรับธีมลูกของคุณบนเซิร์ฟเวอร์ภายในโฟลเดอร์wp-content/themes/yourthemenameไฟล์นั้นจะพร้อมใช้งานในแดชบอร์ดWordPress ของคุณเพื่อให้คุณเปิดใช้งาน^(WordPress)

• เข้าสู่ระบบแดชบอร์ดของคุณ
• ไปที่ ลักษณะ ที่Appearance > Themes
• ธีมลูกของคุณควรอยู่ในรายการ
• เลือกแสดงตัวอย่าง^(Preview)เพื่อดูว่าไซต์มีลักษณะอย่างไรกับธีมลูกใหม่
• เมื่อคุณพอใจกับรูปลักษณ์แล้ว ให้คลิกเปิดใช้งาน^{(Activate )}เพื่อเผยแพร่

หากคุณสร้างธีมลูกไว้ที่อื่นที่ไม่ใช่บนเซิร์ฟเวอร์ในโฟลเดอร์wp-content/themes/yourthemenameคุณควรซิปโฟลเดอร์ธีมลูกใหม่

• เข้าสู่ระบบแดชบอร์ด WordPress ของคุณ
• ไปที่ ลักษณะ ที่Appearance > Themes
• คลิกเพิ่ม^{(Add new)}ใหม่
• เลือก อัป โหลดธีม^{(Upload Theme)}
• ลาก^(Drag)ไฟล์ซิปของคุณไปยังกล่องใหม่ที่ปรากฏขึ้นหรือคลิกตัวเลือกไฟล์และเรียกดูไฟล์ในคอมพิวเตอร์ของคุณ
• เมื่ออัปโหลดแล้ว คุณสามารถดูตัวอย่างและเปิดใช้งานได้

เพิ่มไฟล์เทมเพลต^{(Add Template Files)}

หากต้องการลบล้างเทมเพลตอื่น คุณสามารถคัดลอกจากธีมหลักไปยังธีมย่อยได้ ไฟล์เทมเพลตใดๆ ที่มีชื่อเดียวกันในลูกและในพาเรนต์จะทำหน้าที่เป็นการแทนที่ จากนั้นปรับเนื้อหาของเทมเพลตตามต้องการ

ในการเพิ่มเทมเพลตใหม่^{(To add new templates)}เป็นเพียงกรณีของการสร้างไฟล์ใหม่ด้วยชื่อที่ถูกต้องและเพิ่มเนื้อหาของคุณเอง ส่วนด้านบนจะอธิบายขั้นตอนการทำงานด้วยตนเอง

ตอนนี้เรามาดูวิธีสร้างธีมลูกด้วยปลั๊กอินWordPress กัน^(WordPress)

ใช้ปลั๊กอิน WordPress^{(Use a WordPress Plugin)}

เข้าสู่ระบบ^(Log)แดชบอร์ดWordPressของคุณ คลิก^(Click)ที่Plugins > Add New New ค้นหาธีมลูก^{(child theme.)}

ปลั๊กอินแรก ที่คุณจะเห็นคือChild Theme Configurator นี่เป็นตัวเลือกที่ดี ดังที่เห็นในภาพหน้าจอด้านบน เนื่องจาก:

• เข้ากันได้กับ WP เวอร์ชันปัจจุบัน
• มีการติดตั้งจำนวนมาก
• ถูกปรับปรุงล่าสุด

คลิกที่Install now > Activateงาน ขั้นตอนต่อไปคือไปที่เครื่องมือ^(Tools)แล้วเลือกธีมลูก^{(child themes.)}

ค้นหา^(Find)และเลือกธีมหลักจากเมนูแบบเลื่อนลง เลือก การ วิเคราะห์^(analyze)เพื่อให้แน่ใจว่าธีมของคุณสามารถใช้เป็นธีมย่อยได้

ด้านล่างนี้^(Below)คือบทช่วยสอนทีละขั้นตอนเกี่ยวกับวิธีตั้งค่าChild Theme Configurator ^{(Child Theme Configurator)}หากคุณตัดสินใจที่จะใช้ ปลั๊กอิน WordPressอื่น คุณสามารถหาบทช่วยสอนเกี่ยวกับวิธีการตั้งค่าได้อย่างง่ายดายเช่นกัน

อย่างที่คุณทราบแล้ว ธีมย่อยเป็นธีมที่แตกต่างกันซึ่งต้องอาศัยธีมหลักสำหรับฟังก์ชันการทำงานบางอย่าง

เมื่อคุณใช้ธีมลูกWordPressจะมองหาเด็กก่อนผู้ปกครองและติดตามสไตล์และการทำงานของเด็กหากมีอยู่

ประหยัดเวลา ปัญหาและอาการปวดหัวในอนาคตได้มากเมื่อธีมหลักอัปเดตโดยการสร้างเด็กที่จะไม่ได้รับผลกระทบจากการอัปเดต

How To Create a WordPress Child Theme

Whу should you never customize WоrdPress іn the existing parent theme? What happens to your customizations when the theme you are using is updated?

The answer is they are lost, and your hard work to create your site according to your brand and messaging guidelines and preferences will also be lost.

A child theme enables you to create a separate CSS stylesheet and add additional functionality that will not be lost or affected when the parent theme is updated.

This can be done manually or by installing a child theme creator plugin. Let’s start with the manual process.

Create a New Directory

Start by creating a new directory for your child theme. You can use an FTP client or access your existing wp-content/themes directory via your cPanel.

To use cPanel, go to your hosting control panel. Select file manager and navigate to the directory where WordPress is installed.

This is usually in a directory named public_html. Locate and open the wp-content folder. Click on create new folder and input a name for your child theme. Be sure to give it a name that you will recognize later. A good example is nameofparenttheme-child.

Do not include any spaces in your file name to avoid errors.

Due to internal handling, the folder name must include the name of the parent theme (theme ‘slug’) as shown in the example below.

Create a CSS Stylesheet

Stylesheets are used in WordPress themes for two reasons.

• It is the location of the styles that affect how your site looks.
• A theme’s main stylesheet is where WordPress looks to find information about the theme.

You may not want to add any new styles in the child theme. However, the stylesheet still needs to exist to define specifics such as your theme name and the parent theme name.

Therefore, you need to create a new stylesheet for your child theme. So, your next step is to create a text file for the CSS stylesheet that will define the rules that control the look of your child theme.

The child theme CSS file will then take precedence over the parent theme.

You need to include the following information in your text file:

• Your theme’s name.
• The name of the parent theme directory.
• Title and description that makes sense.

Be sure to include in the stylesheet the following header comment at the top of the file. WordPress will read this information and know that a child theme is being used.

You want to pay close attention to the template tag. It tells WordPress what the parent theme of your child is. Note that the folder where your parent theme is located is case sensitive.

Technically, you can now activate your child theme. However, if you want to create a more complex child theme, you will need to add custom PHP functions.

Create a functions.php file in the child theme (in the same directory as the style.css file you made). This is where things like additional post formats should be added.

As with your CSS file, the changes or additions to your PHP file will automatically be merged with or override the parent’s functions.

For things like post formats that are added with an add_theme_support(), they act as overrides instead of merges.

When using add_theme_support(), you need to take some additional steps to ensure that the child theme overrides the parent.

This can get complicated, so refer to the current WordPress Theme Review Team lead William Patton’s post on using WordPress post formats. 

Add Styles & Scripts To Override Parent Theme Functionality

Your next step is to make sure your child theme either inherits the parent theme’s features and styles or reflects the new ones you want to use.

Styles are used to changing the appearance of your website. Scripts enhance functionality. The way styles and scripts are added to your WordPress site is as essential as the contents of the files.

WordPress’ enqueue functionality is how to get this accomplished.

Enqueueing refers to the way styles and scripts are added to WordPress sites so that they can affect what users see when they visit your site.

Using numerous plugins to achieve the same result often leads to compatibility issues and broken sites.

Wp_enqueue not only improves your website’s performance by way of reducing plugin overhead, but it also enhances the user experience.

How To Use ‘wp_enqueue’

To output the styles for your child theme, you will need to use a function called wp_enqueue_style().

This function takes a few bits of information, but the most important is the name (or ‘handle’) and the location of the file.

Inside the functions.php file add the following code.

This code adds the stylesheet from the parent directory and then also adds the stylesheet for the child which we created earlier. Note that the parent-style text should match the name of the parent theme with -style added to the end.

Activate Your Child Theme

If you created the files for your child theme on the server inside the wp-content/themes/yourthemename folder, it would then be available in your WordPress dashboard for you to activate.

• Log into your dashboard.
• Go to Appearance > Themes.
• Your child theme should be listed.
• Select Preview to see how the site looks with the new child theme.
• Once you are satisfied with how it looks, click Activate to make it go live.

If you created your child theme somewhere other than on the server in the wp-content/themes/yourthemename folder, then you should zip your new child theme folder.

• Log into your WordPress dashboard.
• Go to Appearance > Themes.
• Click Add new.
• Choose Upload Theme.
• Drag your zipped file to the new box that appears or click the file selector and browse to it on your computer.
• Once it has been uploaded, then you can preview it and then activate it.

Add Template Files

To override other templates, you can copy them from the parent theme into the child theme. Any template files that have the same name in the child as in the parent act as overrides. Then adjust the contents of the templates as needed.

To add new templates, it’s just a case of making a new file with the correct name and adding your own content. The above section explains the manual process.

Now let’s go over how to create child themes with a WordPress plugin.

Use a WordPress Plugin

Log into your WordPress dashboard. Click on Plugins > Add New. Search for child theme.

The first plugin you will see is the Child Theme Configurator. This is a good choice, as seen in the screenshot above, because it:

• Is compatible with the current version of WP.
• Has a lot of installations.
• Was recently updated.

Click on Install now > Activate. The next step is to navigate to Tools and then select child themes.

Find and select your parent theme from the drop-down menu. Choose analyze to make sure your theme is ok to use as a child theme.

Below is a step-by-step tutorial on how to set up Child Theme Configurator. If you decide to use a different WordPress plugin, you can easily find a tutorial on how to set it up as well.

As you now know, child themes are distinct themes that rely on their parent theme for some of their functionality.

When you use a child theme, WordPress will look for the child before the parent and follow the styling and functionality of the child if it exists.

Save yourself a lot of time, trouble, and future headaches when the parent theme updates by creating a child that will not be affected by the update.

Related posts

• การสร้าง Child Theme ใน WordPress

• วิธีตั้งค่าเว็บไซต์ที่เหมือน Twitter ของคุณเองโดยใช้ธีม P2 ของ WordPress

• วิธีย้าย WordPress site จากโฮสต์หนึ่งไปยังอีก

• วิธีการติดตั้งและการตั้งค่าบน WordPress Microsoft Azure

• วิธีการรันอย่างรวดเร็ว WordPress บน Microsoft Azure

• วิธีทำ WordPress Site Secure

• Must Have WordPress Yoast SEO Settings 2021

• แสดงข้อความที่ตัดตอนมาบนโฮมเพจของ WordPress blog

• วิธีเพิ่มความเร็วไซต์ WordPress โดยใช้ .HTACCESS

• 9 ต้องมีปลั๊กอินสำหรับการติดตั้ง WordPress ใหม่

• วิธีสร้างป๊อปอัปคูปองของคุณเองใน WordPress

• AMP สำหรับ WordPress คืออะไรและจะติดตั้งได้อย่างไร

• 7 เคล็ดลับ WordPress สำหรับเว็บไซต์ที่เป็นมิตรกับมือถือ

• รูปแบบการเขียนบล็อกที่ดีที่สุดเพื่อให้ได้คะแนนของคุณ

• วิธีป้องกันหน้าด้วยรหัสผ่านบนเว็บไซต์ WordPress ของคุณ

• Squarespace Vs WordPress: แพลตฟอร์มไซต์ไหนดีกว่ากัน?

• วิธีดำเนินการทดสอบแบบแยกส่วนอย่างมีประสิทธิภาพใน WordPress

• วิธีการกำหนดค่า Privacy ใน WordPress และทำไมจึงเป็นสิ่งสำคัญ

• วิธีตั้งค่า WordPress บนโดเมนด้วยตนเอง

• วิธีการติดตั้งไซต์ทดสอบ WordPress บนคอมพิวเตอร์ของคุณ