استخدام Bootstrap في موقع في وورد بريس – الجزء الثاني –

استخدام Bootstrap في موقع في وورد بريس – الجزء الثاني –

استخدام Bootstrap في موقع في وورد بريس – الجزء الثاني –

استخدام Bootstrap في موقع في وورد بريس ,, للعمل على تصميم مواقع عبر منصة وورد بريس انت بحاجة الى معرفة بداية أو ان تبدأ تعلم لغات البرمجة الاساسية التالية وهي html و كذلك php بالإضافة الى css و js.

بالنسبة لنظام Bootstrap فهو يساعدك في معرفة و كذلك تسهيل اساسيات html و css , كما واننا سنقوم بهذه السلسة بشرح كامل لكيفية التعامل مع ثيم موقع عبر منصة وورد بريس لانشاءة من الصفر باستخدام php و js و بالاضافة الى ضمّ bootstrap الى العمل ,

وفي هذا الدرس سوف نقوم بداية بكيفية شرح وتنصيب bootstrap لدينا .

قبل ذلك ولكن انت بحاجة الى معرفة التالي :

الخطوة الأولى : استخدام Bootstrap في موقعي في وورد بريس

كل ثيم وورد بريس يجب أن يكون ضمن مجلد . وهذا المجلد الذي يمكنك انشاؤه لربما على سطح المكتب مبدأياً يجب أن يحتوي بشكل اساسي على الملفات التالية .

يمكنك انشاء هذه الملفات من الذهاب الى Notebook في نظام ويندوز مثلا وانشاءها بكتابة الاسم مع اللاحقة كما هي وموضحة الآن ..

الملفات هي :

• header.php • Stylesheet.css • index.php • page.php • functions.php • single.php • search.php • archive.php • footer.php

عند انشاء هذه الملفات ضمن المجلد تكون اجتزت المرحلة الاولى في انشاء ثيم وورد بريس . الان يجب أن تذهب الى ملف style.css و كتابة الكود التالي .

/*
Theme Name: STUDYSHOOT
*/

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

الخطوة الثانية :استخدام Bootstrap في موقعي في وورد بريس

ضمّ bootstrap الى ملف الثيم الخاص بك , كيف ذلك ؟
اذهب الى الى الموقع الخاص ب Bootstrap من هنا , ثم اضغط على ايقونة تحميل , وقم بتحميل المجلد كامل على سطح المكتب . بعدها قم باستخراج الملفات الموجودة ضمن المجلد المضغوط الذي قمت بتحميله ,

اذهب الآن الى مجلد الثيم الخاص بك وانشىء مجلد قم بتسميته Bootstrap . ثم قم بنسخ مجلدات css و كذلك js  والصقها في مجلد Bootstrap الذي قمت بانشاءه منذ قليل في ملف الثيم الخاص بك .

وهنا سيصبح لدينا التسلسل التالي :

Your theme Folder >>> Bootstrap>>> Css + Js

بعدها لنبداً العمل , اذهب الى مجلد الثيم وقم بفتح ملف Function .php و الصق الكود التالي به :

//Css
function load_css()
                {
                wp_register_style('bootstrap', get_template_directory_uri() . '/bootstrap/css/bootstrap.min.css', array(),false, 'all');
                wp_enqueue_style ('bootstrap');
                }
                add_action ('wp_enqueue_scripts','load_css');
 //Java Scripts
function load_js()
                {
                wp_enqueue_script('jquery');
                    wp_register_script('bootstrap', get_template_directory_uri() . '/bootstrap/js/bootstrap.min.js', 'jquery',false, true);
                    wp_enqueue_script('bootstrap');
                    wp_enqueue_script('jquery');
                }
                add_action ('wp_enqueue_scripts','load_js');

لنقم بشرح الكود قليلاً :

هذا الكود هو عبارة عن أمر تعطيه للورد بريس لكي يقوم بقراءة ملفات Bootstrap حتى نتمكن من استخدامها لاحقاً .

 
wp_register_style('bootstrap', get_template_directory_uri() . '/bootstrap/css/bootstrap.min.css', array(),false, 'all');
wp_enqueue_style ('bootstrap');
}
add_action ('wp_enqueue_scripts','load_css');

 في السطر الأول انت تخبر وورد بريس عن مكان مجلد bootstrap و بما في داخله أي ملف bootstrap.min.css ,

لربما لاحظت عند فتحك ملفات bootstrap بانها تحتوي على العديد من الملفات ومنها اخترنا فقط boostrap.min.css وذلك بسبب حجمها الخفيف الذي لن يسبب لنا مستقبلاً بطىء في حركة الموقع .

بالنسبة للشطر الثاني أي السطر الثاني هي خاصية بوورد بريس تستخدم عند جلب ملفات css  و js الى الثيم .

هنا نكون انتهينا من ضمّ ملفات Bootstrap الى  موقعنا الالكتروني  , تابع في الدرس القادم الدرس الثالث حتى نبدأ ببعض العمل الجاد .

الدرس التالي هو :

ماهي اساسيات bootstrap وكيف ابدأ العمل ؟ الجزء الثالث

روابط :

  • تحميل Bootstrap  من هنا 
  • مرجع وورد بريس لقراءة وفهم الكود الذي استخدمناه في function.php  من هنا 

الزوار قاموا بقراءة ما يلي أيضاً

أفضل الدول لدراسة الفنون والتصميم وتاريخ الفن في الخارج

أفضل الدول لدراسة الفنون والتصميم وتاريخ الفن في الخارج

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

أفضل 16 منحة ماجستير طب الاسنان ممولة بالكامل

أفضل 16 منحة ماجستير طب الاسنان ممولة بالكامل

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

ما هو الفرق بين المنحة الممولة بالكامل والمنحة الممولة جزئياً

ما هو الفرق بين المنحة الممولة بالكامل والمنحة الممولة جزئياً

كل جامعة أو مؤسسة تعليمية لديها معاييرها الخاصة لتحديد المنحة الدراسية كاملة أو منحة دراسية كاملة الرسوم ولكن عمومًا منحة الرسوم... قراءة المزيد

دورات مجانية عن بعد – Free courses – كورسات مجانية

دورات مجانية عن بعد – Free courses – كورسات مجانية

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

ما هو الفرق بين التدريب العملي و التطوع؟

ما هو الفرق بين التدريب العملي و التطوع؟

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

ما هو اختبار GMAT؟ ما تحتاج لمعرفته حول الاختبار والنتائج والأقسام

ما هو اختبار GMAT؟ ما تحتاج لمعرفته حول الاختبار والنتائج والأقسام

يعد اختبار قبول الخريجين في الإدارة ، أو اختبار GMAT ، جزءًا مهمًا من عملية التقديم في كليات إدارة الأعمال يعد GMAT اختبارًا موحدًا متعدد... قراءة المزيد


تعرف على التخصصات الدراسية التالية

تخصص الهندسة الطبية الحيوية Biomedical Engineering

تخصص الهندسة الطبية الحيوية Biomedical Engineering

الهندسة الطبية الحيوية تعتبر مهنة فاصلة ما بين الهندسة والطب, لماذا؟ لأنك ستجبر بالعمل في المجالين معاً, فعلى سبيل المثال اذا كنت عالم... قراءة المزيد

تخصص علم النفس

تخصص علم النفس

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

تخصص هندسة الحاسوب – Computer Engineering

تخصص هندسة الحاسوب – Computer Engineering

يُشارك المهندسون المختصون في تخصص هندسة الحاسوب في العديد من جوانب الأجهزة والبرمجيات في مجال الحوسبة، بدءً من تصميم وحدات التحكم... قراءة المزيد

تخصص التصميم الجرافيكي – Graphic Design

تخصص التصميم الجرافيكي – Graphic Design

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


اخترنا لك المنح التالية للتقديم عليها

منحة جامعة ويسترن واشنطن لدراسة البكالوريوس في أمريكا

منحة جامعة ويسترن واشنطن لدراسة البكالوريوس في أمريكا

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

منحة الماجستير في جامعة سيدني  المقدمه من مؤسسة AWET الخاصة

منحة الماجستير في جامعة سيدني المقدمه من مؤسسة AWET الخاصة

أنشئت منحة الماجستير في جامعة سيدني المقدمه من مؤسسة AWET الخاصة في عام 2007 من قبل  الصندوق الأسترالي لتقديم المساعدة للطلاب الذين... قراءة المزيد

منح الماجستير في إدارة الأعمال و  القانون

منح الماجستير في إدارة الأعمال و القانون

قدّم الآن على منح الماجستير في إدارة الأعمال و  القانون عبر الانترنت هذه المنحة مخصصة للطلاب ذوي الاحتياجات المالية الصعبة حيث تساعدهم... قراءة المزيد

منحة إيميل بوتمي في فرنسا لدراسة البكالوريوس و الماجستير

منحة إيميل بوتمي في فرنسا لدراسة البكالوريوس و الماجستير

تقدّم الان للحصول على فرصة للدراسة مجاناً في فرنسا عبر منحة إيميل بوتمي للطلاب من كل أنحاء العالم الراغبين بدراسة البكالوريوس و... قراءة المزيد

اقرأ المقالات التالية القائمة الشاملة ←
أفضل جامعات لاتفيا للطلاب الدوليين

أفضل جامعات لاتفيا للطلاب الدوليين

تعرف على قائمة أفضل جامعات لاتفيا للطلاب الدوليين الراغبين بالدراسة في دول البلطيق لاتفيا بلد أوروبي معروف بوجود اقتصاد متقدم وعالي... قراءة المزيد

جامعة ترينت في كندا

جامعة ترينت في كندا

جامعة ترينت هي جامعة عامة في كندا، تأسست عام 1964 تقع في مدينة بيتيربوروغ، أوشاوا كليات جامعة ترينت في كندا كلية كاثرين بار... قراءة المزيد

منح جامعة رايرسون للدكتوراه في الهندسة في كندا

منح جامعة رايرسون للدكتوراه في الهندسة في كندا

تقدم منح جامعة رايرسون للدكتوراه في الهندسة في كندا للطلاب الدوليين المسجلين في برامج الدكتوراه في الهندسة تم إنشاء منح دكتوراه... قراءة المزيد

منح جامعة Trent للبكالوريوس في كندا

منح جامعة Trent للبكالوريوس في كندا

تعلن جامعة Trent في كندا عن فتح باب التقديم للمنح الدراسية للطلاب في جميع أنحاء العالم الراغبين في الدراسة بالجامعة يتم تقديم هذه المنحة... قراءة المزيد