كيفية إنشاء قالب تابع لـ WordPress

عادة ، يكون العثور على السمة المثالية أقرب إلى المستحيل ؛ هناك دائمًا بعض التعديلات التي يجب القيام بها. لذا ، لماذا لا تأخذ سمة افتراضية لطيفة لـ WordPress ، مثل Twenty Fifteen ، وتجعلها خاصة بك حتى تبدو وتعمل بالطريقة التي تريدها؟ سيوفر لك إنشاء موضوع فرعي الكثير من الوقت والصداع على الطريق (صدقني).

يمكنني التحدث من تجربة مباشرة. لقد "ورثت" موقع WordPress حيث قام المطور باختراق القالب الرئيسي ، وما زلت أتذكر مدى الإحباط الذي أصابني لأنني لم أتمكن من تحديث السمة في الواقع خوفًا من تجاوز التخصيصات التي أعطت الموقع وظائفه. لم أكن أعرف ما هو الكود الأصلي وما هو مخصص ، لذلك جلس هناك ، مع عدم وجود إمكانية للتحديثات.

لكن القصة لها نهاية سعيدة. كنت أحدث استخدامًا لـ WordPress في ذلك الوقت ، لذلك علمني في وقت مبكر أن تغيير موضوع الوالدين لم يكن فكرة جيدة. عندما أعيد تصميم الموقع أخيرًا ، كان العنصر الأول في العمل هو أخذ التخصيصات ووضعها في قالب فرعي.

يسمح لك المظهر الفرعي بالعمل في مكان منفصل دون الكتابة فوق عملك من خلال تحديث موضوع رئيسي في المستقبل. من الناحية الفنية ، عندما تقوم بإنشاء سمة فرعية ، فإنك تنشئ مجموعة منفصلة من الملفات التي يمكنك استخدامها لتخصيص السمة دون التأثير على السمة الأصلية الأصلية. إذا قمت بإجراء تغييرات على ملفات النسق الأصل ، فسيتم استبدال هذه التغييرات عند تحديث السمة في المرة القادمة. هذه مشكلة كبيرة لأن التحديثات يمكن أن تتضمن تعديلات على الميزات وإصلاحات للأخطاء وتدابير أمان مهمة. من الأهمية بمكان الحفاظ على السمة الأصلية محدثة واستخدام سمة فرعية لأي تخصيصات.

أساسيات موضوع الطفل

السمات الفرعية هي سمات منفصلة تقوم بإنشائها وتعتمد على سمة رئيسية لوظائفها الأساسية. عند استخدام قالب فرعي ، يعرف WordPress أنه يشير إليه ويبحث عن أي وظيفة مضمنة. هذا أمر رائع لأنه يسمح لك بتعديل أجزاء موضوع الوالدين فقط التي تحتاج إلى تغييرها ، مما يجعل هذه طريقة فعالة للغاية لإضافة التخصيصات إلى موقع WordPress الخاص بك.

للتعمق أكثر ، إليك كيفية عمل السمات الفرعية على مستوى الملف. يتحقق WordPress لمعرفة ما إذا كان الملف المطلوب مدرجًا في القالب الفرعي. إذا تم تضمينه ، يتم تحميل ملف الموضوع الفرعي هذا. إذا لم يكن هناك واحد في النسق الفرعي ، يتم تحميل الملف في النسق الأصلي. الاستثناء الوحيد لهذا هو ملف function.php ، حيث يتم تحميل كل من الإصدارين الأصل والفرع. عادة ، هناك معلومات مهمة في ملف function.php. إذا قام WordPress بتحميل إصدار السمة الفرعية فقط (إلا إذا قمت بنسخ كل شيء) ، فلن يعمل الموقع بشكل صحيح. لحسن الحظ ، يقوم WordPress بتحميل كلا الملفين ، لذلك لا داعي للقلق بشأن نسخ ملف function.php بأكمله في قالب طفلك.

تذكر أنه يمكنك دائمًا إيقاف تشغيل المظهر الخاص بك والعودة إلى النسخة الأصلية إذا لزم الأمر. إنه شارع ذو اتجاه واحد بالرغم من ذلك ؛ لا يمكنك إيقاف تشغيل الوالد والاعتماد على المظهر الفرعي.

إذا كنت تضيف تخصيصات إلى سمة WordPress ، فمن الأفضل استخدام سمة فرعية. على استعداد لإنشاء الخاص بك؟ الآن سنستعرض العملية خطوة بخطوة.

إنشاء موضوع فرعي

ليس الأمر معقدًا كما قد يبدو لإنشاء واحدة. في الواقع ، كل ما تحتاجه تقنيًا هو ملفان فقط: ملف style.css functions.php . تحتوي معظم الموضوعات الخاصة بالأطفال على أكثر من ذلك ، ولكن من الناحية الفنية ، فإن هذين هما الموضوعان الوحيدان المطلوبان.

لإنشاء قالب فرعي ، يجب أن يكون لديك WordPress مثبتًا جنبًا إلى جنب مع المظهر الأصلي الذي ترغب في استخدامه.

قم بإنشاء دليل موضوع

أولاً ، انتقل إلى دليل السمات وأنشئ مجلدًا لموضوعك الجديد. أعطه اسمًا معروفًا. في هذا المثال ، سأقوم بتسمية موضوعي child-example حتى يسهل العثور عليه.

اصنع ورقة الأنماط الخاصة بالموضوع الفرعي

الخطوة التالية الحاسمة للغاية هي إنشاء ورقة أنماط للقالب الفرعي. قم بإنشاء ملف style.css . ضع في اعتبارك أنه يجب تسمية style.css حتى تعمل الأشياء بشكل صحيح.

بعد ذلك ، ستحتاج إلى تضمين بعض المعلومات حول المظهر الخاص بك.

انسخ هذا والصقه في style.css file :

/*
 Theme Name:   Child Example
 Theme URI:    http://example.com/child-exxample/
 Description:  Child Example Twenty Fifteen Child Theme
 Author:       Your Name
 Author URI:   http://example.com
 Template:     twentyfifteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         Tags: black, blue, gray, pink, purple, white, yellow, dark, light, two-columns, left-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
 Text Domain:  twenty-fifteen-child
*/

قد يبدو هذا كثيرًا ، ولكن لا يوجد سوى نوعين ضروريين ، وهما Theme Name Template . يخبر Theme Name WordPress باسم القالب الفرعي. يخبر Template WordPress بالموضوع الذي يجب أن يعتبره الموضوع الرئيسي ، وهو أمر مهم للغاية.

معظم الآخرين يشرحون أنفسهم تمامًا ، ولكن هناك زوجين قد يحتاجون إلى مزيد من التوضيح. قد يكون Text Domain Tags بعض الشيء. يُستخدم Text Domain لترجمة الجمل لأغراض التدويل. هذا فريد لموضوعك ويجب استخدامه كلما استخدمت وظائف الترجمة. هناك الكثير من المعلومات في Codex ويمكن العثور عليها في موضوع I18n لمطوري WordPress. قسم Tags عبارة عن قائمة بالعلامات الخاصة بموضوع WordPress. في هذا المثال ، نظرت إلى style.css أصل Twenty Fifteen ، وحصلت على العلامات من هناك ، ووضعتها في القالب الفرعي.

استخدم الأنماط الأصلية

هل تتذكر كيف يبحث WordPress عن ملفات السمات الفرعية أولاً؟ في الوقت الحالي ، يعمل المظهر الفرعي ، لكنه لا يبدو مصقولًا للغاية لأنك لم تقم بأي تصميم حتى الآن. إذا قمت بتنشيطه وإعادة تحميل الصفحة ، فستبدو فوضوية بعض الشيء. من المحتمل أن يبدو شيئًا كالتالي:

دعنا نصلح هذا حتى يعود إلى الموضوع الأصلي وسيكون هناك على الأقل بعض الأنماط المطبقة. ستستمر في استخدام مظهر طفلك لتصميمك المخصص ، ولكن أولاً ، دعنا نظهر تصميم الوالدين.

للتأكد من تحميل ورقة أنماط الملف الأصلي ، سنحتاج إلى وضعها في قائمة الانتظار في القالب الفرعي. ستحتاج إلى ملف 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' );
}

إجراء تخصيص CSS

الآن بعد أن تم عرض الأنماط الأصلية ، دعنا نغير بعض CSS لتخصيص موضوع طفلك. في هذا المثال ، يعد تصميم عنصر الخلفية لمحتوى الصفحة طريقة جيدة لمشاهدة القالب الفرعي أثناء العمل. لقد تم تصميمه باللون الأبيض في السمة الأصلية CSS ، لكن دعنا نغيرها إلى اللون الأزرق في السمة الخاصة بك. تذكر أنه يتم تحميل الأنماط الأصلية أولاً ، وسيتم تحميل تخصيصاتك بعد ذلك ، لذا ستكون هذه هي ما سنراه.

إذا كنت من مستخدمي Chrome ، فإن أدوات المطور مفيدة جدًا في رؤية التصميم والتجربة في المتصفح. انتقل إلى عرض> مطور> عرض المصدر وحدد عناصر الصفحة. سيتم عرض الأنماط على اليمين. لقد تفقدت المقالة التي تحتوي على فصل .hentry بخلفية بيضاء. لقد قمت بلصق قيمة سداسية عشرية لاختبارها أولاً في المتصفح.

لإجراء هذا التغيير ، افتح ملف CSS في القالب الفرعي وأضف معلومات CSS.

كما ترى ، يمكن إجراء تغييرات النمط بسهولة في السمة الفرعية.

تعديل وظائف موضوع طفلك

يعد ضبط التصميم أمرًا سهلاً للغاية ، ولكن ماذا عن الأشياء الأخرى مثل الرأس والتذييل والشريط الجانبي وما إلى ذلك؟ لنفترض أن هناك بعض التعديلات التي يجب إجراؤها في التذييل. انسخ والصق التذييل من النسق الرئيسي في الشكل الفرعي. يمكن فتح ملف footer.php في محرر نصوص من اختيارك وتعديله. لقد قررت إزالة سطر "مدعوم من WordPress بكل فخر" ، لذلك قمت بحذف هذا من الملف في قالب طفلي. هذا هو الملف الذي سيحمله WordPress أولاً ، لذلك لن يظهر هذا السطر من النص.

يعد إنشاء قالب فرعي عادة جيدة يجب الدخول فيها عند إنشاء قوالب WordPress. من خلال بضع خطوات بسيطة ، يسهل إنشاؤها وصيانتها. يعد الاحتفاظ بالتخصيصات منفصلة عن السمات الرئيسية أمرًا جيدًا لكل من أغراض المنظمة والحفاظ على كل شيء محدثًا ، مما سيوفر الكثير من المتاعب على الطريق.