السلام عليكم
ساشرح في هذه التدوينة عملية تحويل تصميم موقع الى قالب ورد بريس
اذا كان لديك تصميم موقع وتريد تحويله الى قالب ورد بريس فهذه عملية بسيطة
اولا قم بعمل فولدر جديد على سطح المكتب سمي الفولدر بأي اسم تريد
مثلا قالبي والان افتح النوتباد ولا تقم بكتابة اي شئ فقط اذهب الى
(file > save as) واحفظه بأسم style.css وبعد ذلك اذهب
الى (file > save as) مجددا واحفظه بأسم index.php.
صدق او لا تصدق ولكن قوالب الوردبريس تحتاج فقط هذين الملفين
الان افتح ملف الستايل الخاص بموقعك وانسخ جميع محتوياته الى ملف الستايل الذي عملناه توا
والان انسخ هذا الكود في اعلى ملف الستايل الخاص بالقالب:
/* Theme Name: اسم قالبك. Theme URI: عنوان موقع القالب Description: وصف مختصر للقالب. Version: 1.0 Author: انت Author URI:عنوان موقعك. */
ان هذا الكود هو الذي يحتاجه وردبريس للتعرف على القالب
الان الستايل مرتب . نحتاج ان نقسم كود الموقع. ان الوردبريس
يستخدم عدة اكواد php ليعمل ونحن بأستخدام هذه الاكواد سوف نقسم
الكود الى عدة اقسام ونستدعيه بواسطته لا تخف انها عملية بسيطة جدا.
الان افتح النوتباد واعمل ثلاثة ملفات جديدة كما فعلنا سابقا مع ملف الاستايل والاندكس
وسمي هذه الملفات “header.php , sidebar.php , footer.php”
(وتذكر ان تضع جميع هذه الملفات في فولدر واحد) الان شغل برنامج الاف تي بي
خاصتك ونزل قالب كلاسيك من هذا العنوان (/wp-content/themes/classic/)
من موقعك حيث نحتاج ان نستخدم بعض الاكواد منه اعثر على ملف header.php في ملفات
قالب كلاسيك الذي حملناه لتونا والان افتح الملف وانسخ جميع الاكواد الموجودة بين وسمي
<head></head> الى ملف header.php الذي عملناه في فولدر قالبنا
والان افتح الاندكس الخاص بموقعك وانسخ الاكواد التي استعملتها لتكوين الهيدر
والصقها في ملف header.php تحت وسم </head> الخاص بالقالب الجديد ثم احفظ واغلق.
الان افتح ملف index.php الذي عملناه لقالبنا وافتح الاندكس الخاص بموقعك وانسخ الكود الخاص بمحتوى
موقعك (لا السايدبار ولا الفوتر فقط المحتوى) اي فقط الكود وليس المحتوى والصقه في ملف index.php
ثم احفظ واغلق .
والان انسخ اكواد السايدبار من موقعك الى ملف sidebar.php الخاص بالقالب واعمل نفس الشئ للفوتر
ثم احفظ واغلق.
الان لنجمع كل شئ من جديد وذلك بأستخدام اكواد php افتح ملف index.php الخاص بالقالب وانسخ الكود التالي فوق كل شئ:
<?php get_header(); ?>
والان اذهب الى الاسفل وضع هذين الكودين:
<?php get_sidebar(); ?> <?php get_footer(); ?>
ان هذه الاكواد الثلاثة من البي اتش بي تخبر الوردبريس ان يجلب ملف الهيدر والسايدبار والفوتر ويربطها معا مع
الاندكس الان القالب اعيد جمعه معا. الان اذا اردت ان تعدل على ملف السايدبار او الفوتر او الهيدر يمكنك ذلك
عن طريق الي ملفاتها دون ان تضطر الى ان تبحث عن الاكواد في الاندكس.
الان تقريبا الاندكس انتهى ولكن يجب ان ندخل المحتوى لحسن الحظ ان الوردبريس يستخدم اكواد بي اتش بي
لجلب المحتوى تسمى The Loop حيث هذه الخاصية يستخدمها الوردبريس لجلب وعرض تدويناتك من قاعدة
البيانات. الان افتح قالب كلاسيك الذي انزلته لتوك وافتح ملف index.php الان انسخ جميع الاكواد الواقعة بين
<?php get_header(); ?> و <?php get_footer(); ?> والصقها في ملف index.php الخاص بقالبك
الان حمل قالبك الجديد الى /wp-content/themes/ وقم بتفعيله.
نحن ادخلنا كود بسيط من The Loop للمزيد من التعديلات يمكنك زيارة WordPress Codex وخاصة
Template Tags و Template Files يمكنك استخدام Template tags في السايدبار او الفوتر او الهيدر
لاستدعاء التدوينات او التصنيفات او اي شئ اخر تريد مع ازدياد تعلمك ستكتشف الميزات اللانهائية للوردبريس.
اذا كان عندك استفسار او سؤال اترك تعليق.
شكرا لك استاذ احمد على الشرح الرائع فعلا رائع و تمت اظافته للمفضلة
السلام عليكم
والله اخي الله يرحم والديك
اخوك مغربي الجنسية ومقيم في دولة ليبيا
والله نفرح لما نلاقي احد الاخوة العرب يحب يعطي ما عندو
ونعلم ان 5% من المبرمجين العرب هدا هو العدد الموجود في الدول العربية
ونسبة الاكبر وهي للاجانب 75%
اخي انا من محبي مجلة جوملا وتعاملت معها حتى اصبحت من مستخدميها المتقنبن لهده المجلة فالمشكل لتركي لهده المجلة انها ليست مجانية رغم اعلانهم بانها مجانية صدقا و الله ما هي مجانية
الي مجاني هي المجلة وحدها وليست الاضافات الاساسية لها
تركبها وتتعب لغاية متصبح مجلة كاملة وكل من يدخل لموقعك يقول سبحان الله
وبعد مدة تلاقي الفيروسات استحودة على المجلة تصلح ملف وتقول الحمد لله يتعطب ملف اخر …الى ما لا نهاية ..اقول حسبي الله ونعم الوكيل
ضاع الوقت وضاع الجهد …. الى متى ….؟؟؟؟؟
لقد اعجبتني هده المجلة وساقوم ببرمجة موقع بادن الله
وشكرا لك اخي ونتمنى ان يصبح المبرمجين العرب بمستواهم
السلام عليك ..
درس مميز اخي بارك الله فيك ..
وااااصل تميزك ..