الدليل النهائي لموضوعات WordPress Child

نشرت: 2022-06-13

هل سبق لك أن وجدت سمة WordPress قريبة من الكمال لموقعك على الويب ولكنك قررت عدم اتباعها بسبب عنصر تصميم صغير محطم للأعصاب لا يمكنك التغاضي عنه؟ إنه نمط الخط أو لوحة الألوان أو موضع عناصر التصميم ، ربما؟

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

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

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

يبدو جيدا؟ هيا بنا نبدأ!

قوالب ووردبريس الطفل: الأساسيات

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

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

تأتي معظم سمات WordPress في الوقت الحاضر مع سمات فرعية (أو أشكال مختلفة من السمات الفرعية الخاصة بهم) مباشرة خارج الصندوق.

لماذا يجب عليك استخدام مواضيع الأطفال؟

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

القضاء على مخاطر ضياع التعديلات

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

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

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

الحفاظ على منظمة الكود

يتكون قالب WordPress عادةً من بضعة آلاف من أسطر التعليمات البرمجية وعدة ملفات مختلفة - HTML و CSS و PHP و JavaScript والمزيد. وبسبب هذا ، فإن أي تغييرات طفيفة يتم إجراؤها هنا وهناك يصبح من الصعب تتبعها. عندما يحين الوقت للعودة وتعديل السمة أو إصلاح الأخطاء غير المتوقعة ، سيثبت أنها مكلفة للغاية (من حيث الوقت والميزانية).

الحفاظ على منظمة الكود
تساعد السمات الفرعية مطوري الويب في الحفاظ على رمز منظم.

كما تمت مناقشته أعلاه ، يتم توريث الموضوعات الفرعية بنشاط من الموضوعات الرئيسية. تظل أي تغييرات تجريها على السمة الفرعية موجودة (ما يحدث في السمات الفرعية يبقى في السمات الفرعية!) ويسهل تتبعه لأنه سيحتوي فقط على بضع مئات من الأسطر من التعليمات البرمجية (في أكثر الظروف قسوة) بدلاً من بضعة آلاف.

كما يمكنك أن تقول على الأرجح الآن ، لا توجد عيوب لاستخدام السمات الفرعية. في الواقع ، يقومون بحماية موقعك من الأخطاء العرضية.

كيف تصنع موضوعًا فرعيًا في ووردبريس

تأتي معظم المظاهر مع موضوعات فرعية ، ولكن إذا وجدت واحدة ترضيك والتي لا ترضيك ، فإن إنشاء سمة فرعية بنفسك ليس بالأمر الصعب. سأوضح البرنامج التعليمي من خلال إنشاء سمة فرعية لموضوع Sparkling الخاص بنا.

موضوع Colorlib's Sparkling
موضوع Colorlib's Sparkling

الخطوة 1: قم بإنشاء دليل للقالب الفرعي في تثبيت WordPress الخاص بك.

  1. انتقل إلى دليل /wp-content/themes theme).
  2. قم بإنشاء مجلد جديد وقم بتسميته Spark-child . من أفضل الممارسات أن تعطي لطفلك نفس اسم الوالد مع إلحاق الطفل في النهاية.
دليل موضوع الأصل ، دليل موضوع الطفل
موضوع الوالدين - موضوع الطفل

سنضيف جميع ملفات النسق الفرعي إلى هذا المجلد. ومع ذلك ، فإن الملف الوحيد الذي يتطلبه القالب الفرعي ليعمل بشكل صحيح هو ملف style.css .

الخطوة 2: قم بإنشاء ملف style.css لموضوع الطفل الجديد الخاص بك.

  1. انتقل إلى دليل القالب الفرعي الذي تم إنشاؤه في الخطوة 1 ، أي /wp-content/themes/sparkling-child .
  2. قم بإنشاء ملف .css جديد في الدليل وقم style.css .
  3. انسخ الكود التالي والصقه في ملف style.css الجديد:

https://gist.github.com/rafaysansari/59ab402cffc540d050ed

في الكود الموضح أعلاه ، أهم الأسطر هي تلك التي تبدأ بـ Theme Name و Template و @import . يجب عليك ملء هذه الأسطر بشكل صحيح إذا كنت تقوم بإنشاء سمة فرعية لموضوع رئيسي آخر. يضمن سطر @import أنك لست مضطرًا إلى إعادة كتابة قواعد CSS الخاصة بالقالب الأصلي من البداية. بدون سطر @import ، سيحتوي الموقع الجديد على المحتوى الذي تم تحميله عليه فقط ، بدون تصميم.

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

الخطوة الثالثة: قم بإنشاء ملف functions.php (اختياري).

يتيح ملف functions.php لمطوري الويب إضافة وظائف إلى مواقع WordPress الخاصة بهم باستخدام وظائف WordPress الأصلية ورمز PHP.

  1. انتقل إلى مجلد موضوع الطفل الخاص بك ، أي متألقة الطفل .
  2. قم بإنشاء ملف .php وقم بتسميته functions.php .
  3. أضف الكود التالي إلى ملف functions.php:

https://gist.github.com/rafaysansari/6c3cc1606823d56388f4

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

الخطوة 4: استيراد أوراق أنماط متعددة (اختياري).

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

  1. انتقل إلى دليل القالب الفرعي وافتح ملف functions.php في محرر نصوص.
  2. أضف سطور التعليمات البرمجية التالية إلى ملف functions.php تحت علامة الفتح <?php tag:

https://gist.github.com/rafaysansari/9535343506d670226f4e

ستقوم وظيفة wp_enqueue_style() المستخدمة في الكود أعلاه باستيراد أوراق أنماط متعددة إلى قالب الطفل الخاص بك دون إبطاء موقعك.

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

الخطوة 5: قم بتحميل القالب الفرعي.

الآن بعد أن أنشأت القالب الفرعي بنجاح ، حان الوقت لتحميله على موقع WordPress الخاص بك وتنشيطه.

  1. ضغط دليل القالب الفرعي في ملف .zip .
  2. قم بتسجيل الدخول إلى لوحة إدارة WordPress الخاصة بك وانتقل إلى المظهر > السمات .
  3. انقر فوق الزر " إضافة جديد " على الشاشة التالية.
زر تحميل الموضوع
انقر فوق الزر تحميل الموضوع.
  • انقر فوق الزر تحميل الموضوع للمتابعة.
  • تحميل موضوع الطفل
    ابحث عن ملف .zip الخاص بالمظهر الفرعي في محرك الأقراص وقم بتحميله.
  • تصفح بحثًا عن ملف .zip الخاص بموضوع طفلك وقم بتحميله.
  • بمجرد تحميل القالب الفرعي ، انقر فوق تنشيط .
  • يمكنك أيضًا تحميل السمة الفرعية عبر عميل FTP الخاص بك عن طريق النسخ المباشر للصق ملف .zip في دليل السمات. إذا كنت تقوم بإنشاء سمة فرعية لموضوع آخر ، فقم بإجراء التعديلات اللازمة على الكود المذكور أعلاه.

    يهدف هذا البرنامج التعليمي فقط إلى توضيح كيفية إنشاء قالب فرعي. لقد أنشأنا موضوعًا فرعيًا لـ Sparkling والذي يمكنك تنزيله مباشرةً إذا كنت تفضل عدم قضاء الوقت في إنشاء قالب خاص بك.

    تخصيص موضوع طفلك

    بافتراض أن كل شيء سار كما هو مخطط له ، عند تنشيط السمة الفرعية ، يجب أن يبدو موقع الويب الخاص بك كما هو عند تنشيط السمة الأصلية. لكن انتظر! أليس بيت القصيد من إنشاء موضوع فرعي لجعل موقع الويب الخاص بك يبدو مختلفًا؟

    في هذا القسم ، سنوضح لك كيف يمكنك البدء في تخصيص السمة الفرعية لإجراء تعديلات.

    تطبيق الأنماط المخصصة

    نظرًا لأن الملف الأول (والملف الإلزامي) الذي أنشأناه كان ، style.css ، فمن المنطقي فقط البدء بإضافة أنماط مخصصة إلى القالب الفرعي باستخدامه. من خلال إضافة كود CSS مخصص إلى ورقة الأنماط ، ستتمكن من تجاوز ورقة أنماط القالب الأصلي.

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

    انتقل إلى Appearance> Editor وأضف كود CSS مباشرة من هناك.
    انتقل إلى Appearance> Editor وأضف كود CSS مباشرة من هناك.

    كل ما عليك فعله هو إضافة كود CSS مخصص إلى أسفل ملف style.css الخاص بموضوع طفلك وأنت على ما يرام. أولئك الذين لا يرغبون في الوصول إلى عميل FTP لموقعهم في كل مرة يحتاجون فيها إلى إجراء تغيير بسيط يمكنهم الانتقال إلى محرر WordPress الافتراضي ( المظهر > المحرر ) وإضافة كود CSS مباشرة من هناك. انتقل إلى Appearance> Editor وأضف كود CSS مباشرة من هناك.

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

    تقنيات تعديل الموضوع البديلة

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

    • أضف functions.php جديدة إلى ملف jobs.php. لقد أنشأنا بالفعل ملف functions.php لموضوع طفلك ، لذا كل ما عليك فعله الآن هو إضافة بعض الوظائف المخصصة إليه اعتمادًا على الوظيفة التي تريد تحقيقها. يمكنك كتابة التعليمات البرمجية بلغة PHP أو استخدام وظائف WordPress الأصلية.
    • تحرير ملفات القوالب. إذا لم تقم style.css و functions.php بقصها وما زلت بحاجة إلى تعديل السمة ، يمكنك نسخ لصق ملفات القالب من السمة الأصلية وتعديلها وفقًا لذلك.
    • أضف ملفات قالب جديدة. إذا وجدت القوالب التي تعجبك في مكان آخر (ليس في دليل القالب الأصلي) أو إذا كنت تريد إنشاء القوالب الخاصة بك ، فيمكنك إضافتها مباشرة إلى القالب الفرعي والانتقال من هناك.

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

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

    قم بتغليفه

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

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

    هل توافق على أن جميع تعديلات التصميم والوظائف يجب أن تتم عبر السمات الفرعية؟ هل تمكنت من إنشاء سمة فرعية وتفعيلها بنجاح على موقع WordPress الخاص بك؟ نود أن نسمع عن تجربتك ، لذا أخبرنا من خلال التعليق أدناه!

    اعلمنا اذا اعجبك المنشور