متى تستطيع استخدام البوتستراب في تطوير قالب الووردبرس الخاص بك
اذا قمت بعمل بحث عن " قالب ووردبرس مع بوتستراب " سوف ستحصل على الكثير من النتائج التى ستظهر لك. وسوف تحصل على بعض الدلائل التوضيحية التى سوف تخبرك كيف تستطيع ان تستخدم البوتستراب في بناء قوالبك وايضا قوالب مدفوعة ومجانية متوفرة تستخدم كإطار عمل بوتستراب.
اذا قمت بعمل بحث عن " بوتستراب " في ووردبرس سوف تحصل على حوالى 200 نتيجة تقريبا. أي أن هناك الكثير من الخيارات.
ما هو إطار عمل بوتستراب؟
اطار عمل بوتستراب هو اطار عمل لكل من HTML و CSS و Javascrip وهو الاطار الاكثر استخداما لتطوير المشاريع على النت ويعتمد على تطوير الموبايل دائما
بوتستراب صمم أصلاً كإطار عمل لمساعدة مطوري تويتر للعمل بكفاءة أكثر وتم اطلاقه كإطار عمل مفتوح المصدر في عام 2011 واستخدم منذ ذلك الحين في تشغيل مجموعة متنوعة من التطبيقات، بما في ذلك قوالب ووردبريس
إذا قمت بتحميل إطار عمل بوتستراب ، سترى أنه يتكون من مجموعة من التصميمات ملفات JavaScript و glyphicons الموجودة في ملفات الخطوط. وهذه الملفات لا يمكنها ان تكون مكان ملفات القالب الخاص بك بدلاً من ذلك يمكنك استدعائها في ملف التصميمات (stylesheet) وملف (functions)
والان سوف اخبرك بفؤائد انشاء القوالب بالبوتستراب
اول ميزه للبوتستراب هو انه متجاوب ويقدم لك تصميم للقالب الخاص بك اذا كنت قد حاولت جاهدا لعمل القوالب المتجاوبه فالبوتستراب سيسهل عليك التعب وسيمكنك من تعلم كيفيه جعل تصميماتك متجاوبه ويمكنك ايضا استخدام خاصيه media queries
بوتستراب يستخدم كتخطيط لشبكة grid-based التى تحتوى على 12 عامود columns مع انواع للشبكه grid classes التي يمكنك استخدامها مع العناصر في ملفات هيكل القالب الخاص بك لجعل المحتوى يتناسب مع الشبكة.
ومن مزايا هذه الطريقه
- إذا لم تكن معتاداً على كتابة (media queries) ، فلست مضطرا لكتابتها بنفسك.
- النظام القائم على شبكة (grid-based) يستخدم CSS طريقة التوجه، مما يتيح لك الكثير من المرونة في تصميم العناصر في قالبك وفي الصفحات الخاصة بك.
- مبدأ التطوير الخاص( بالموبايل اولا) يعني أن CSS الخاص بك أكثر نظافة وأكثر كفاءة من ملف التصميم (stylesheet) الخاص بمبدأ ( التطوير للحاسوب اولا ).
2: يستخدم تصميم حديث ونظيف وجذاب
- استخدام عنصر
للنص الثانوي ضمن العناوين
- التصميم الخاص بالاقتباس (blockquotes) والاستشهادات
- تصميم الجدول ، الذي هو افضل من الكثير فى قوالب ووردبريس
3: يتعامل بشكل جيد مع HTML5
بدل ان تقوم بإدخال فئات(classes) الخاصة به للتصميم، يشمل بوتستراب أيضا تصميم لمجموعة كاملة من عناصر HTML5 التي يمكنك أن تتوقع استخدامها في القالب. اذا قمت بتصميم كل هذا من الصفر يمكن أن يكون مشكلة كبيرة، لذلك هو يوفر عليك الكثير من العمل، فضلا عن تسهيل استخدامك للعلامات مثل (semantic markup) في القالب
4: هو يوفر لك سهولة الوصول إلى السكربتات
بدلاً من ان تكون مضطر إلى استخدام الإضافات أو مصدر سكربتات من مواقع أخرى، يوفر لك بوتستراب مجموعة لطيفة من السكربتات التي ستساعدك على إضافة الرسوم المتحركة والتفاعلات الاكثر استخداما إلى موقع الويب الخاص بك. وهذه تشمل ما يلي:
وهذه الاضافات تساعدك بشكل كبير فى عملية التطوير التى تقوم بها.
يتضمن ملف التصميم 155 سطر من التعليمات البرمجية فقطوهذا سيتطلب منك العمل الكثير والوقت ايضا وهذا اكثر مما تحتاجه بعض القوالب
اذا كان التصميم الذى تقوم به فى القوالب سياخذ منك عمل كثيرا او سوف تقوم بدعم عدة قوالب معا فاستخدام البوتستراب لن يكون مضيعه للوقت وسوف يساعدك كثيرا ويستحق الوقت الكثير لتعلمه اما اذا كان الامر يحتاج الى عدة اعمده فقط وهو تصميم متجاوب فان امر استخدام البوتستراب سيكون زياده عن اللزوم
1: يستخدم (Media Queries) ثابتة
(media queries) المستخدمة من قبل بوتستراب تقوم على افتراض حول عرض الشاشة والجهاز والتي اصبحت قديمة.
هذه هي (media queries)
إذا كنت قد قررت إضافة (media query) وسيط الى ملف التصميم (stylesheet) ، فعليك أن تأخذ 155سطر من التعليمات البرمجية الخاصة بتصميم نظام الشبكة وأن تجعلها تتكيف مع نقطة التوقف الجديدة
الملفات وهي مصغرة، يمكن ان تساعدك، لكن هل حقاً تحتاج إلى كل تلك التعليمات البرمجية الغير مستخدمة في القالب
وهذا يعني أن التصميم الخاص بك استند على ما وفره بوتستراب ، وليس على ما هو مطلوب لموقع الويب الخاص بك.
ويكمن خطر استخدام الكثير من القوالب لبوتستراب هو أننا في النهاية سوف نجد الكثير من القوالب التي تبدو متشابهة
إطار عمل قالب ووردبريس كثيرا ما سيقدم لك كل ما تحصل عليه من بوتستراب ، و بطريقة أكثر افضليه مع طريقة عمل مطوري ووردبريس. ومثل هذه القوالب لا يجب أن تكون غاليه أو لها قاعدة برمجية ضخمة.
قالب وونديرفلوكس، على سبيل المثال، هو مجاني ومفتوح المصدر، ويشمل نظام شبكي متجاوب (مثل بوتستراب لكن أقل تعقيدا) ومكتبة من (functions) و (hooks) والتي لا تحصل عليها في بوتستراب.
ويمكننا ايضا مثالا أن بوتستراب و ووردبريس ليس متوافقان بسبب ان تصميم قوائم التصفح (navigation menu) وقائمة الووردبريس الخاصة بك لن تعمل من تلقاء نفسها عند تمكين بوتستراب : بدلاً من ذلك يجب عليك إنشاء (nav walker) مخصصة. وهذا ليس من الصعب القيام به إذا كنت مرتاحاً مع التعليمات البرمجية، ولكنه يضيف خطوة أخرى لتطوير القالب الخاص بك.
وبعد ان قدمت لك المميزات والسلبيات للبوتستراب يمكننا ان نلخص الدرس فى:
ان البوتستراب له فوائده كثيره. إذا كنت تريد تخطيط جذاب ونظيف ومتجاوب للموقع الخاص بك والوصول إلى مجموعة من تأثيرات Javascript ، فيمكن أن يساعدك في تسريع عملية تطوير القالب الخاص بك.
ولكن ، إذا كنت تريد الوصول الى كل الإمكانيات التي يقدمها لك بوتستراب ، سوف تحتاج لقضاء بعض الوقت في تعلمه. هناك الكثير لتتعلمه مع بوتستراب ، وإذا كنت لا تنوي استخدام كل ميزاته ، فهو لا يستحق هذا العناء.
وهذه هيا الاشياء التى انصحك باستخدام البوتستراب عندها:
وهذه هيا الاشياء التى انصحك بعدم استخدام البوتستراب عندها:
بدل ان تقوم بإدخال فئات(classes) الخاصة به للتصميم، يشمل بوتستراب أيضا تصميم لمجموعة كاملة من عناصر HTML5 التي يمكنك أن تتوقع استخدامها في القالب. اذا قمت بتصميم كل هذا من الصفر يمكن أن يكون مشكلة كبيرة، لذلك هو يوفر عليك الكثير من العمل، فضلا عن تسهيل استخدامك للعلامات مثل (semantic markup) في القالب
4: هو يوفر لك سهولة الوصول إلى السكربتات
بدلاً من ان تكون مضطر إلى استخدام الإضافات أو مصدر سكربتات من مواقع أخرى، يوفر لك بوتستراب مجموعة لطيفة من السكربتات التي ستساعدك على إضافة الرسوم المتحركة والتفاعلات الاكثر استخداما إلى موقع الويب الخاص بك. وهذه تشمل ما يلي:
- الانتقالات (transitions)
- مودلز (modals)
- قوائم منسدلة (dropdowns)
- تلميحات الأدوات (tooltips)
- قوائم منبثقة (popovers)
- أزرار (buttons)
وهذه الاضافات تساعدك بشكل كبير فى عملية التطوير التى تقوم بها.
وكما ذكرنا الايجابيات لابد لنا من ذكر السلبيات لاستخدام البوتستراب
يتضمن ملف التصميم 155 سطر من التعليمات البرمجية فقطوهذا سيتطلب منك العمل الكثير والوقت ايضا وهذا اكثر مما تحتاجه بعض القوالب
اذا كان التصميم الذى تقوم به فى القوالب سياخذ منك عمل كثيرا او سوف تقوم بدعم عدة قوالب معا فاستخدام البوتستراب لن يكون مضيعه للوقت وسوف يساعدك كثيرا ويستحق الوقت الكثير لتعلمه اما اذا كان الامر يحتاج الى عدة اعمده فقط وهو تصميم متجاوب فان امر استخدام البوتستراب سيكون زياده عن اللزوم
1: يستخدم (Media Queries) ثابتة
(media queries) المستخدمة من قبل بوتستراب تقوم على افتراض حول عرض الشاشة والجهاز والتي اصبحت قديمة.
هذه هي (media queries)
العام الماضي ، التطوير المتجاوب ابتعد عن نقاط التوقف المحددة مسبقاً ل (media queries) ، واتجه نحو التصميم-المستند على نقاط التوقف. في حين ان هذه (media queries) تستند على تصميم بوتستراب بحيث لا ينبغي ان تسبب أي مشاكل في أي من الأجهزة المدعومة أو المتصفحات)، ولكنها لا تعطيك مرونة في حالة كنت تبرمج تعليمات برمجية(code)
إذا كنت قد قررت إضافة (media query) وسيط الى ملف التصميم (stylesheet) ، فعليك أن تأخذ 155سطر من التعليمات البرمجية الخاصة بتصميم نظام الشبكة وأن تجعلها تتكيف مع نقطة التوقف الجديدة
2: يضيف أشياء غير مهمة
بوتستراب يعطيك الكثير من الوظائف والتصاميم التي يمكنك استخدامها في القالب الخاص بك ولا يمكن إنكار هذا . ومع ذلك إذا كنت تستخدام جزء صغير مما يقدمه لك ، فهذا يعني انك ستقوم بإضافة تعليمات برمجية إضافية كل ذلك من أجل لا شيء.الملفات وهي مصغرة، يمكن ان تساعدك، لكن هل حقاً تحتاج إلى كل تلك التعليمات البرمجية الغير مستخدمة في القالب
3: يمكن ان يبعدك عن التصميم المبتكر
قم بإضافة بوتستراب الى القالب الخاص بك، استدعي ملف التصميم (stylesheet) من خلال ملف تصميم القالب لديك الان تصميم جاهز ، ومتجاوب والذي يبدو جيدا . الكثير منا يفضل ترك الأمر عند هذا الحد ، تعديل بعض الألوان وبعض والتغييراتوهذا يعني أن التصميم الخاص بك استند على ما وفره بوتستراب ، وليس على ما هو مطلوب لموقع الويب الخاص بك.
ويكمن خطر استخدام الكثير من القوالب لبوتستراب هو أننا في النهاية سوف نجد الكثير من القوالب التي تبدو متشابهة
بوتستراب و ووردبريس مختلفين عن بعضهم
والشى الوحيد الذى سيجعلك لا تعمل بالبوتستراب هو حقيقة أنه لم يصمم ابدا للعمل مع ووردبريس ، وأنه يعمل بطريقة مختلفة
إطار عمل قالب ووردبريس كثيرا ما سيقدم لك كل ما تحصل عليه من بوتستراب ، و بطريقة أكثر افضليه مع طريقة عمل مطوري ووردبريس. ومثل هذه القوالب لا يجب أن تكون غاليه أو لها قاعدة برمجية ضخمة.
قالب وونديرفلوكس، على سبيل المثال، هو مجاني ومفتوح المصدر، ويشمل نظام شبكي متجاوب (مثل بوتستراب لكن أقل تعقيدا) ومكتبة من (functions) و (hooks) والتي لا تحصل عليها في بوتستراب.
ويمكننا ايضا مثالا أن بوتستراب و ووردبريس ليس متوافقان بسبب ان تصميم قوائم التصفح (navigation menu) وقائمة الووردبريس الخاصة بك لن تعمل من تلقاء نفسها عند تمكين بوتستراب : بدلاً من ذلك يجب عليك إنشاء (nav walker) مخصصة. وهذا ليس من الصعب القيام به إذا كنت مرتاحاً مع التعليمات البرمجية، ولكنه يضيف خطوة أخرى لتطوير القالب الخاص بك.
وبعد ان قدمت لك المميزات والسلبيات للبوتستراب يمكننا ان نلخص الدرس فى:
ان البوتستراب له فوائده كثيره. إذا كنت تريد تخطيط جذاب ونظيف ومتجاوب للموقع الخاص بك والوصول إلى مجموعة من تأثيرات Javascript ، فيمكن أن يساعدك في تسريع عملية تطوير القالب الخاص بك.
ولكن ، إذا كنت تريد الوصول الى كل الإمكانيات التي يقدمها لك بوتستراب ، سوف تحتاج لقضاء بعض الوقت في تعلمه. هناك الكثير لتتعلمه مع بوتستراب ، وإذا كنت لا تنوي استخدام كل ميزاته ، فهو لا يستحق هذا العناء.
وهذه هيا الاشياء التى انصحك باستخدام البوتستراب عندها:
- إذا كنت تريد بذل بعض الجهد في تعلم كيفية استخدام بوتستراب
- إذا كنت تريد استخدام الكثير من ميزات بوتستراب ، مثل نظام الشبكة والسكربتات
- إذا لم يكن لديك مصمم يعمل معك وتريد تصميما جاهزاً
- إذا كنت ترغب في تطوير قالب متجاوب ولكن لا تعرف كيفية كتابة ( media queries )
وهذه هيا الاشياء التى انصحك بعدم استخدام البوتستراب عندها:
- إذا كنت تريد المزيد من المرونة فيما يتعلق بنقاط التوقف أو التصميم أو التخطيط
- إذا كنت ستستخدم سكربت واحد ، أو أنك لن تستخدم نظام الشبكة
- إذا كنت تريد حل سريع لا تستخدم البوتستراب
- إذا كان هناك إطار عمل قالب ووردبريس او قالب مبدئي يقوم بالوظيفة التي تحتاج إليها، ويوفر لك أكثر من ذلك، مثل (functions) و (hooks).
ارجو ان يفيدكم الموضوع وان يكون قد نال اعجابكم
ليست هناك تعليقات:
إرسال تعليق