تعد القوالب في ووردبريس ميزة رائعة لجعل موقع الويب الخاص بك يظهر بأفضل طريقة ممكنة. فأول خطوة نقوم بها عند الشروع في إطلاق موقع ووردبريس عبر الإنترنت، هي القيام بتنصيب قالب ووردبريس أنيق وتخصيصه بحيث يناسب متطلباتنا ويعرض محتوى موقعنا بشكل أنيق وجذاب. قد تختار لموقعك قالباً مجانياً أو مدفوعاً، فهناك آلاف الخيارات والقوالب الجاهزة المتاحة على شبكة الانترنت والتي يمكنك الانتقاء من بينها. وهناك العديد من المنصات للحصول منها على القالب المطلوب. فحتى لم يكن صاحب الموقع خبيرًا في التصميم، فإن قوالب ووردبريس تتيح له إعداد قالب الموقع بسرعة وتخصيصه بالطريقة التي يريدها مما يجعل هذا الخيار هو المفضل للغالبية العظمى من مستخدمي ووردبريس. القوالب في ووردبريس هي عبارة عن مجموعة من الملفات المكتوبة بلغات تصميم الويب المخصصة (PHP و HTML و CSS و JavaScript) وهي تتميز بكونها ديناميكية وقابلة لتعديل المحتوى بخلاف مواقع HTML وCSS الثابتة. في مقال اليوم نقدم لك شرحًا متقدمًا يعلّمك كيفية القيام بذلك خطوة بخطوة، وسنرشدك لكيفية إنشاء قالبك بنفسك، ونقدم لك خياراً إضافياً بديلاً يمكنك استخدامه عند اختيار تصميم لموقعك. في مقالة اليوم سوف نساعدك في استكشاف البنية الأساسية لملفات القوالب في وودربريس وتعلم كيفية إنشائها وتعديلها للحصول في نهاية الأمر على قالب ديناميكي كامل لموقعك. ولتبسيط الشرح للمبتدئين قمنا بتقسيم هذه المقالة إلى ثلاثة أجزاء، كما حرصنا على توضيح الخطوات العملية بالتفصيل لتكون واضحة ومفهومة .. ستكون هذه المقالة بأجزائها الثلاثة بمثابة دليل شامل يشرح لك بالتفصيل عملية تصميم قالب ووردبريس متكامل، بدءاً من اللحظة الأولى لتنصيب التصميم والألوان والخلفيات وواجهة المستخدم، وانتهاءَ بإكمال خطوات توافق القالب مع كافة أدوات وخيارات الووردبريس. متى تحتاج إلى تصميم قالب ووردبريس من الصفر؟ يفضل معظم المستخدمين الخيار السهل، وهو القيام بتحميل أحد قوالب الووردبريس الجاهزة من شبكة الإنترنت، وتنصيبها على موقع ووردبريس الخاص بهم. أما أن تقوم بتصميم وإنشاء قالب ووردبريس من البداية إلى النهاية فهو خيار فريد يستحق أن تقوم بتعلُّمه وإتقانه حتى لو كلفك الأمر بعض الوقت والجهد الإضافيين. فتعلم تصميم قوالب ووردبريس سوف يقدم لك الميزات والفوائد التالية: كسب المال يعتبر تصميم قوالب الووردبريس من المهام المربحة بشكل كبير، خصوصاً مع انتشار الووردبريس وحصوله على ثقة الملايين من أصحاب المواقع حول العالم. وبالتالي فإن تعلمك لطريقة تصميم قوالب الووردبريس من الصفر سوف يمكنك من بيع هذه القوالب لأصحاب مواقع الووردبريس مقابل مبالغ مالية مجزية. تحويل التصميم الثابت إلى قالب ووردبريس إذا كنت قد طلبت من شخص محترف أو من شركة متخصصة إنشاء تصميم لموقعك بإحدى لغات تصميم المواقع المختلفة، أو حتى قمت أنت بالأمر بنفسك، ستتمكن بعد تعلم تصميم قوالب ووردبريس من القيام بتحويل هذا التصميم الذي تم تنفيذه عن طريق الأكواد البرمجية إلى قالب ووردبريس. ذلك من أجل الاستفادة من كل الخيارات والأدوات التي يوفرها لك الووردبريس ، مثل لوحة تحكم الموقع، وإمكانية تنصيب إضافات على موقعك للقيام بالعديد من المهام الإضافية بدون كتابة أكواد برمجية، وغيرها من الفوائد التي تحصل عليها عند القيام بتحويل التصميم العادي إلى قالب ووردبريس. فهم التكوين الأساسي لقالب الووردبريس إذا كنت تعمل كمطور مواقع باستخدام الووردبريس، فسوف يساعدك تعلم إنشاء القوالب على القيام بتنفيذ أي تعديلات يطلبها العميل منك بشكل أسرع، لأنك ستكون قد تعرفت بشكل جيد على التكوين الأساسي للقالب، واطلعت على بنية الملفات التي يحتوي عليها، وتعلمت طريقة التعديل على كل ملف من تلك الملفات. التحكم بشكل كامل في قالب موقعك عند قيامك بإنشاء قالب الووردبريس بنفسك من الصفر، سوف تمتلك القدرة على التحكم الكامل في الكود المصدري للتصميم، وستتمكن من إضافة أو حذف أو تعديل الأكواد البرمجية كما ترغب للوصول إلى القالب المرجوّ الذي تريده لموقعك. فعندما يكون لديك خلفية كاملة عن وظيفة كافة الأكواد المكتوبة في القالب، سيسهل عليك التحكم بها والتعديل عليها بسهولة ومرونة. لذلك في هذه المقالة سوف نتطرق إلى كافة الملفات التي يحتوي عليها قالب الووردبريس ونشرح طريقة التعديل على كل ملف منها بشكل عملي.
محتويات المقالة البدء في تصميم قالب الووردبريس ما الذي يجعل قالب الووردبريس متكاملاً وجاهزًا للعمل؟  ما هي الملفات التي تحتاج لإنشائها لتأسيس قالب ووردبريس؟ إظهار اسم القالب الجديد الخاص بك في الووردبريس تحويل التصميم إلى قالب ووردبريس أولًا: نسخ أكواد الجزء Header ثانيًا: نسخ أكواد الجزء Footer ثالثًا: نسخ أكواد الجزء Sidebar  رابعًا: نسخ أكواد ملف Style.css  خامسًا: ربط ملف header بملف Style.css  سادسًا: معاينة مظهر القالب بشكل مباشر  سابعًا: نسخ كود المحتوى الرئيسي للقالب Content  تحويل القالب إلى قالب ديناميكي متجاوب مع أدوات الووردبريس 1 . تعيين عنوان القالب Title ليصبح نفس عنوان موقع الووردبريس 2. تعيين محتوى الصفحة الرئيسية لعرض آخر المقالات تلقائيًا 3. تهيئة الكود الخاص Sidebar ليكون متكاملا من أدوات الووردبريس  إجراء تعديلات برمجية إضافية للقالب 1 . اضافة قوائم التنقل Navbar إلى القالب 2. إظهار الودجات Widgets داخل القالب البدء في تصميم قالب الووردبريس رغم كل الفوائد التي سوف تحصل عليها من تعلم طريقة تصميم قالب ووردبريس من الصفر، إلا أن الأمر ربما لا يكون مناسبًا لجميع المستخدمين العاديين، فهناك عدة مهارات ومتطلبات أساسية يجب عليك امتلاكها كي تكون قادرًا على القيام بإنشاء قالب الووردبريس بطريقة صحيحة ومتكاملة ويمكن الاعتماد عليها في المواقع. في الجدول التالي نلخص لك أهم المتطلبات اللازمة لك لتكون قادراً على القيام بتصميم قالب ووردبريس بنفسك، ونوضح لك درجة الأهمية لكل متطلب: كما تلاحظ في الجدول السابق، فإن هناك عدة مهارات أساسية لازمة لتكون قادراً على البدء بتعلم تصميم قالب ووردبريس من الصفر. لا يجب أن تكون محترفاً في كل تلك المهارات، ولكن على الأقل يجب أن يكون لديك معرفة جيدة بها حتى تكون قادراً على إكمال عملية إنشاء وتصميم قالب ووردبريس متكامل من الخطوة الأولى حتى الخطوة الأخيرة، دون الوقوع بأية مشاكل أو عقبات خلال هذه العملية. ما الذي يجعل قالب الووردبريس متكاملاً وجاهزًا للعمل؟ قبل البدء في عملية تصميم قالب الووردبريس لابد أن تراعي بعض الأمور الهامة لكي تقوم بإنشاء قالب ووردبريس مميز واحترافي ويمكن الاعتماد عليه بشكل كامل. فقالب الووردبريس الناجح لابد أن يحتوي على أهم الأجزاء والعناصر التي توفر تجربة مستخدم ناجحة تساعد الزائر على الاستفادة بشكل كبير من عملية تصفح الموقع وصفحاته وأقسامه الرئيسية والفرعية بطريقة سهلة وغير معقدة. وإليك بعض النقاط التي يجب مراعاتها عند تصميم قالب ووردبريس: حاول أن يكون تصميمك فريدا ولا تقم بنسخ تصاميم أخرى مشابهة اجعل التصميم مقسمًا بشكل جيد ومريحاً للزائر اختر ألوان التصميم بعناية وابتعد عن كثافة الألوان التي ربما تشتت القارئ قم باختيار خطوط واضحة، وبعيدة عن الزخرفة، ويسهل قراءتها من قبل الزوار لا تستخدم صورًا أو وسائط عليها حقوق ملكية داخل القالب الخاص بك بعد انتهائك من إنشاء القالب قم باختباره على النسخة التجريبية للاستضافة ، أو على الخادم المحلي لتتأكد من أنه يعمل بالطريقة التي تريدها. ما هي الملفات التي تحتاج لإنشائها لتأسيس قالب ووردبريس؟ بدايةً عليك أن تفهم بشكل جيد التكوين الداخلي لقالب الووردبريس، والملفات الأساسية التي يجب عليك القيام بإنشائها لتأسيس قالب الووردبريس. يتكون قالب ووردبريس بشكل أساسي من مجموعة متنوعة من الملفات المنفصلة التي تعرف باسم ملفات القالب (قد تكون ملفات من نوع php أو ملفات stylesheet أو ملفات javascript) ، وتكون هذه الملفات مجمعة معاً في مجلد خاص بالقالب يحمل نفس اسم القالب. ويكون هذا المجلد مخزناً ضمن المسار التالي. wp-content>Themes> Theme_name1 سنوضح لك في في هذا الجزء من المقالة أسماء أهم الملفات الأساسية التي يتكون منها قالب الووردبريس، وسنقوم بضبط إعداداتها في الجزء الثاني من المقالة عند القيام بالتطبيق العملي وتصميم تلك الملفات بشكل فعلي: index.php: هذا الملف هو الملف الأكثر أهمية في القالب وهو يمثل الصفحة الرئيسية لقالب الووردبريس، ويتم استخدامه غالبًا لتصميم الواجهة الأمامية للموقع. Header.php: يحتوي هذا الملف على الأكواد الخاصة بتصميم ترويسة الموقع أو الجزء العلوي منه Head الذي يحتوي عناصر مثل اللوجو وقوائم التنقل الرئيسية وغيرها.. كما يحتوي بيانات أخرى مثل نوع مستند موقعك، ومعلومات وصفية، وروابط إلى ملفات التنسيق CSS.. وغالبًا ما ينتهي هذا الملف بالوسم . Sidebar.php: هو أحد الملفات الهامة لتكوين قالب الووردبريس، وهو يحتوي على الأكواد الخاصة بالشريط الجانبي للموقع، والذي يمكن استخدامه لإضافة بعض عناصر ووردبريس مثل “الودجات” وغيرها من العناصر الأخرى. ويساعدك في تخصيص الشريط الجانبي للموقع من داخل لوحة تحكم الووردبريس بعد تنصيب القالب. Footer.php: هذا الملف هو أحد الملفات الشهيرة في قوالب الووردبريس وهو مسؤول عن تصميم تذييل الموقع (Footer) بطريقة جميلة ومنسقة. Single.php: هو ملف برمجي يستخدم لتنسيق المنشورات الفردية على موقع الووردبريس. Page.php: هو ملف برمجي يستخدم لتنسيق الصفحات الثابتة على موقع الووردبريس. functions.php: هو أحد الملفات البرمجية الهامة في قالب الووردبريس، والذي بدوره يقوم بتخزين أهم الدوال البرمجية المتعلقة بالأمور التقنية للموقع، وسنقوم بتوضيح أهمية الملف في الجزء الثاني من المقالة. ( تعرف أكثر على ملف Functions.php ) ملف comments.php: هو الملف المسؤول عن تنسيق التعليقات التي تتم داخل مقالات ومواضيع الموقع والتحكم بعرضها بشكل كامل. ملف Style.css: هذا الملف من الملفات الضرورية لعمل قالب ووردبريس، وهو يحتوي قسم ترويسة مطلوب لتحديد معلومات أساسية حول القالب، كما يحتوي على أكواد CSS خاصة بتنسيق وترتيب عناصر الموقع وتحديد الألوان والخطوط والخلفيات المستخدمة وغيرها من التنسيقات المتنوعة.. ملحوظة : هناك بعض ملفات القالب التي يمكن استخدامها في جميع الصفحات، مثل الملف header.php و footer.php وهناك بعض الملفات التي يتم استخدامها فقط في حالات معينة مثل single.php

كذلك قد تحتوي بعض القوالب على ملفات أكثر من تلك التي ذكرناها لك في الأعلى، وهذا يعتمد على حجم الخيارات والوظائف التي يقوم بها القالب. إلا أن تلك الملفات التي أشرنا إليها هي الملفات الأساسية في إنشاء الهيكل الأساسي للقالب. دعنا نبدأ الآن بالتنفيذ العملي ونأتي لخطوة إنشاء الملفات الأساسية التي أشرنا إليها في الفقرة السابقة ووضحنا أهمية كل واحد منها. في البداية قم بالدخول إلى مدير الملفات الخاص بموقعك من داخل لوحة التحكم Cpanel ثم قم بالدخول إلى المجلد WP-content الذي يمثل مسار تنصيب الووردبريس على الاستضافة> بعدها قم بالدخول إلى المجلد Themes الذي يحتوي على كافة القوالب المتواجدة في موقع ووردبريس الخاص بك: كما تلاحظ في الصورة السابقة، يحتوي المسار Themes بداخلة على المجلدات الفرعية لكافة القوالب التي توجد في موقعك (كل مجلد من هذه المجلدات يمثل قالب مستقل، ويحوي بداخله كافة الملفات اللازمة لعمل هذا القالب). لإنشاء مجلد فرعي لقالبك الجديد الذي ستقوم بإنشاءه داخل موقع ووردبريس، عليك القيام بالنقر على زر إنشاء مجلد جديد (+Folder) المشار إليه بالسهم الأحمر أعلى يسار الصورة السابقة. وبعد النقر على زر إضافة مجلد جديد، سيظهر لك مربع إدخال لتحديد اسم مجلد القالب الجديد الذي تريد إنشاءه (قم بتسميته على سبيل المثال باسم “Test” أو أي اسم آخر تختاره) بعد إنشاء مجلد القالب مباشرة، سيظهر هذا المجلد داخل المجلد Themes بهذا الشكل : بعد أن قمت بالخطوة الأولى وهي إنشاء المجلد الخاص بقالب الووردبريس الذي ستقوم بإنشاءه داخل موقعك، نأتي الآن للخطوة التالية وهي الدخول إلى هذا المجلد، والبدء في إنشاء الملفات الأساسية لقالب الووردبريس واحداً تلو الآخر (ابتداء من ملف index.php وحتى الملف Style.css) لإنشاء كل ملف من هذه الملفات، قم بالدخول إلى المجلد Test، ثم قم بالنقر على زر ملف جديد ( +File ) الموجود أعلى اليسار وحدد اسم وامتداد الملف المطلوب (مثلاً index.php )، ثم انقر على الزر Create new file . كما هو مبين في الصورة المتحركة التالية، التي توضح لك بشكل عملي طريقة إنشاء الملف index.php داخل مجلد القالب الجديد Test بنفس الطريقة التي توضحها لك الصورة المتحركة السابقة، ستقوم بإنشاء باقي الملفات بالأسماء التي شرحناها لك سابقًا، واحرص على الحفاظ على أسماء الملفات كما أشرنا إليها (حيث أنّ تغيير الاسم لأحد تلك الملفات قد يسبب لك مشاكل في القالب، وربما لن يعمل قالبك نهائياً إذا قمت بتغييرها إلى أسماء أخرى) والآن بعد قيام بإنشاء كل الملفات بنفس الطريقة، يفترض أن يحتوي المسار Test على الملفات التسعة التالية: الآن إذا دخلت إلى لوحة تحكم الووردبريس المنصب على موقعك، ثم قمت بالدخول إلى المظهر < قوالب ، ستلاحظ عدم ظهور أي قالب جديد بالموقع. صحيح ؟! إظهار اسم القالب الجديد الخاص بك في الووردبريس لتقوم بإظهار قالبك الجديد في صفحة قوالب الموقع عليك القيام بتعديل ملف التنسيق style.css الذي قمت بإنشائه داخل مسار المجلد Test الخاص بالقالب الجديد، عليك القيام بإضافة كود بسيط للغاية في ترويسة هذا الملف ليتم إظهار اسم القالب داخل لوحة تحكم الووردبريس. قم بالتوجه إلى الملف style.css الموجود داخل مجلد Test ، ثم انقر بالزر الأيمن للماوس عليه، لتظهر لك قائمة خيارات اختر منها الأمر تعديل أو Edit : ستفتح أمامك صفحة تحرير الملف style.css، كل ما عليك القيام به هو لصق الكود التالي داخل صفحة تحرير الملف: /* Theme Name: قالب جديد Theme URI: http://www.wpar.net Description: قالب ووردبريس جديد تم إنشاءه من الصفر بشكل كامل. Author: Admin Version: 1.0 Tags: new theme,create */ بعد لصق الكود قم بالنقر على زر Save changes لحفظ التغييرات كما هو موضح في الصورة التالية: وإليك فائدة هذا الكود: كما تلاحظ يتكون الكود من بعض العناصر التي سنوضحها لك بالترتيب: Theme name ومن خلاله يتم تحديد اسم القالب المراد إظهاره داخل لوحة تحكم الووردبريس، وفي هذه الحالة قمنا بتسمية القالب “ قالب جديد ” وهنا يمكنك استبدال الاسم بأي اسم آخر كيفما تشاء. Theme URI وفيه تقوم بوضع الرابط الخاص بالقالب، حيث يمكن لأي مستخدم يقوم بفتح الكود المصدري للقالب العثور على مزيد من المعلومات حول القالب من خلال هذا الرابط (هذه المعلومة اختيارية، والهدف منها توضيح بعض المعلومات عن القالب مثل اسمه والمطور الخاص به وما إلى ذلك. لذا يمكنك تركه فارغاً أو وضع أي رابط تريده.) Description: هنا يمكنك كتابة وصف قصير عن القالب ليظهر في صفحة التعريف بالقالب في الووردبريس. Author: هنا يمكنك كتابة اسم مطور القالب، وهنا قمنا بكتابة Admin ويمكنك استبداله باسمك على سبيل المثال، وسيظهر اسم المطور هذا في صفحة التعريف بالقالب في الووردبريس. Version هنا تقوم بكتابة رقم الإصدار أو النسخة الحالية للقالب، وتكتب بالصيغة X.X أو X.X.X Tags وفيه تقوم بكتابة بعض الوسوم التعريفية بالقالب لأغراض البحث، وهذه الوسوم تظهر أيضاً في صفحة معلومات القالب بالووردبريس. والآن بعد هذا التعديل البسيط الذي قمت به داخل ملف style.css ، قم بالدخول إلى لوحة تحكم الووردبريس< المظهر<القوالب، وسوف تلاحظ الآن ظهور اسم قالبك “قالب جديد” داخل لوحة قوالب الووردبريس: يمكنك النقر على زر “تفعيل” ليتم تفعيل وتنشيط القالب على موقعك الووردبريس. لكن إذا قمت بتفعيل القالب الجديد وزيارة موقعك، ستلاحظ أن موقعك أصبح عبارة عن صفحة بيضاء لا تحتوي على أي شيء بداخلها! دعنا الآن نجرب شيئًا بسيطًا جدًّا لنتاكد من أن القالب قد تم إنشاءه وتفعيله بشكل سليم، قم بالدخول إلى مجلد القالب الذي قمت بإنشائه باسم Test، ثم قم بفتح صفحة التحرير الخاصة بملف index.php: ثم قم بكتابة الجملة التالية داخل صفحة تحرير الملف index.php ولتكن مثلاً عبارة “مرحبًا بكم في موقعنا الجديد”، بعد ذلك قم بالنقر على زر حفظ الملف: الآن بعد كتابة أي جملة أو نص تريده، قم بزيارة الموقع الخاص بك، لتجده بالشكل التالي : يمكنا القول بأنك قمت الآن بإنشاء قالب ووردبريس بسيط للغاية يظهر جملة “مرحبًا بكم في موقعنا الجديد”، بالتأكيد لا يمكننا اعتبار أن هذا قالب ووردبريس لكننا قمنا بالتأكد من أن القالب تم إنشاءه وتفعيله بشكل ناجح. في الفقرات التالية، ستتعلم البدء في كتابة الكود الخاص بتصميم كافة عناصر القالب الخاص بك، ابتداء من ترويسة الموقع وقوائم التنقل والشريط الجانبي والتذييل وغيرها من العناصر الهامة اللازمة لإنشاء قالب احترافي وقادر على العمل على ووردبريس بشكل سليم. تحويل التصميم إلى قالب ووردبريس في الفقرات السابقة قمنا بتجهيز البنية التحتية للقالب، وأنشأنا كافة الملفات الأساسية اللازمة لإنشاء قالب الووردبريس الجديد. لكن بالتأكيد القالب حتى هذه اللحظة يعتبر فارغاً تماماً وليس به أي تصميم أو أي مظهر يمكن اعتماده كقالب ووردبريس. لذلك في الفقرات التالية ستقوم بالعمل على تصميم وتخصيص مظهر القالب بالكامل ليكون قابلاً للعمل على موقع ووردبريس بدون مشاكل. أول خطوة تنفيذية عليك القيام بها من أجل البدء في إنشاء قالب ووردبريس من الصفر هي القيام بتصميم بسيط ثابت لمظهر القالب باستخدام لغة HTML + CSS على الأقل، ثم القيام بتحويل هذا التصميم العادي إلى قالب ووردبريس من البداية إلى النهاية. فائدة هذا التصميم هو أنه يشكل حجر الأساس لتصميم قالب ووردبريس. بمعنى آخر سوف تقوم بنسخ الأكواد الخاصة به، ولصقها داخل ملفات قالب الووردبريس الجديد التي قمت بإنشاءها مسبقًا، ليصبح لديك قالب ووردبريس بنفس التصميم والشكل الثابت الذي قمت بإنشاءه باستخدام CSS+HTML. ليس لديك تصميم جاهز الآن؟ لا تقلق ياصديقي، فقد قمنا بإنشاء تصميم بسيط لأجلك باستخدام لغة HTML + CSS فقط، وسنقوم في الجزء التالي من المقالة بالاعتماد على هذا التصميم عن طريق تحويله من تصميم عادي إلى قالب ووردبريس يتمتع بكل المميزات والخيارات التي توفرها قوالب الووردبريس الأخرى. كل ما عليك هو نسخ الأكواد الخاصة بهذا التصميم وتطبيقها على قالبك كما سنشرح لك بعد قليل. كما تلاحظ في الصورة السابقة، لديك هنا تصميم بسيط تم إنشاؤه بلغة HTML + CSS ولكنه لم يصبح بعد قالب ووردبريس متجاوب بعد، حالياً هو عبارة عن بعض النصوص والروابط المرتبة بالشكل الظاهر أمامك. ويمكنك تحميل ملف الأكواد الخاصة بهذا التصميم من هنا . ملحوظة: هذا نموذج من تصميم بسيط بهدف التجريب، وإلا فننصحك بالإعتناء بعمل تصميم احترافي يحسن من تجربة المستخدم ويناسب الهدف الأساسي من موقعك. بعد قيامك بتنزيل ملف التصميم الجاهز، قم بفك ضغط الملف في أي مكان على حاسوبك، وستجد أن الملفات المتواجدة فيه هي كالتالي: تبين لنا الصورة التي في الأعلى الملفات التي يحتوي عليها ملف التصميم الجاهز، ومن ضمنها ملف index إذا قمت بالضغط على هذا الملف ستفتح لك صفحة ويب في المتصفح الخاص بك بالشكل التالي: مهمتك في الفقرات التالية هي إنشاء قالب ووردبريس بنفس التصميم الذي تشاهده أمامك في الصورة السابقة. ولكي تقوم بذلك عليك نسخ الأكواد من ملف التصميم Testdesign المضغوط الذي قمت بتنزيله وفك ضغطه على جهازك المحلي، ثم لصق تلك الأكواد داخل ملفات القالب الجديد الذي قمت بإنشائه داخل المجلد Test ضمن مدير ملفات الموقع في الجزء الأول من المقالة. لكي نسهل عليك الأمر، دعنا نخبرك بأن قالب الووردبريس الذي سنقوم بتصميمه سيكون عبارة عن 4 أجزاء رئيسية كما هو موضح في الصورة التالية: Header وهو الترويسة أو الجزء الذي يمثل المنطقة العليا من القالب. Content وهو الجزء الذي يعرض بداخله محتوى الموقع بالكامل سواء كان مقالات أو محتوى ثابت. Sidebar وهو الشريط الجانبي للقالب الذي يظهر على يسار أو يمين القالب. Footer وهو التذييل أو الجزء الذي يظهر أسفل القالب تمامًا وفي الغالب يحتوي على عبارة حفظ الحقوق وبعض بيانات التواصل. الأن قم بفتح مجلد الأكواد الخاص بالتصميم الجاهز، ثم قم بفتح الملف Index بأي محرر أكواد مثل Notpad++ أو أي محرر أكواد آخر. ستجد أن الملف يحتوي على الأكواد التالية:

كما تلاحظ فإن الكود السابق، يحتوي على كل الأكواد الخاصة بتصميم العناصر (header ،content ،sidebar ،footer) الموافقة للأجزاء الظاهرة في صورة التصميم الأساسي. في الفقرات التالية سنقوم بنسخ الأكواد الخاصة بكل عنصر على حدة، ونقوم بلصقها داخل ملفات القالب الموافقة التي قمنا بإنشائها في الجزء الأول من المقالة. أولًا: نسخ أكواد الجزء Header قم بفتح ملف index الموجود ضمن ملفات الأكواد التي قمت بتنزيلها باستخدام أي محرر أكواد، ثم قم بنسخ الأكواد الخاصة بالجزء العلوي من القالب Header، وهي الأكواد الموجودة من بداية الملف وصولاً للكود >div id=”content”<، وبالتالي قم بنسخ الكود التالي:

بعد نسخ الكود من الملف، توجه إلى المجلد Test الذي يتضمن ملفات القالب داخل مدير ملفات الموقع، وقم بفتح صفحة التحرير الخاصة بالملف Sidebar.php بنفس الطريقة المعتادة: ثم قم بلصق الكود الذي نسخته سابقًا داخل هذا الملف، و احفظ التغييرات التي قمت بها في الملف. وبهذا يكون الكود الخاص بإظهار الشريط الجانبي للقالب جاهزًا الآن.. رابعًا: نسخ أكواد ملف Style.css هل تتذكر عندما قمت بإنشاء ملف Style.css فارغ داخل مجلد القالب في مدير ملفات الموقع؟ الآن جاء وقت وضع الأكواد داخل هذا الملف، حيث تعتبر أكواد Style.css هي المسؤولة عن تنسيق شكل مظهر الموقع بالكامل، مثل ضبط مقاسات العرض والارتفاع، وتحديد الألوان والخلفيات وغيرها الكثير من التنسيقات التي تحدد المظهر العام والشكل النهائي للموقع. قم بفتح الملف style.css الموجود ضمن ملفات التصميم Testdesign التي قمت بتحميلها على جهاز حاسوبك الشخصي بأي محرر أكواد لديك: بعد فتح الملف قم بنسخ كافة الأكواد المتواجدة به ثم قم بلصقها داخل الملف style.css المتواجد في مجلد القالب Test داخل مدير ملفات الموقع: بعد لصق الكود الذي نسخته كاملاً داخل الملف لا تنس القيام بحفظ التغييرات على الملف بالنقر على زر Save changes. خامسًا: ربط ملف header بملف Style.css الأن ناتي إلى هذه الخطوة المهمة للغاية والتي لن يعمل القالب بشكل سليم إلا عند القيام بها، وهذه الخطوة هي القيام بربط الملف header.php بملف style.css (هذان الملفان موجودان داخل مجلد القالب Test في مدير ملفات الموقع) وللقيام بعملية الربط بينهما، قم بالدخول إلى مجلد القالب Test في مدير الملفات، ثم قم بفتح صفحة تحرير الملف header.php بالطريقة المعتادة، بعدها ستفتح لك صفحة تحرير ملف header.php وستجد في بدايتها الكود التالي : قم باستبدال الكود السابق بالكود التالي:

أهلا بالعالم!

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

قراءة المزيد