إعداد واجهة / خلفية لموقع ويب بسيط متعدد اللغات باستخدام Bootstrap 4 مع إطار PHP الخالي من الدهون ، ولكن لا توجد قاعدة بيانات.
أردت استخدام إطار PHP مع Bootstrap 4 لإنشاء مواقع ويب من شأنها أن: من شأنها أن:
كان خياري خاليًا من الدهون- "فورمور صغيرته PHP قوية ولكنه يسهل الاستخدام"
للتأكد من أنه يمكنني بناء موقع ، قمت بإنشاء موقع ؛ موقع حول كيفية استخدام Bootstrap وخالية من الدهون لإنشاء موقع. والموقع هو السجل الخاص بي لما فعلته ولماذا.
هذا ليس CMS. لا توجد قاعدة بيانات. جميع المحتوى موجود في ملف التكوين ، وملفات وحدة التحكم ، وقوالب المحتوى.
*ملاحظة: لدي مستودع مماثل لـ Bootstrap 5 في https://github.com/richdebourke/simple-f3-bootstrap-5-multi-lang-site.
جميع الكود من هذا المستودع قيد التشغيل على http://sbf-testing.byethost7.com. القصد من ذلك هو أن تكون الكود حزمة مكتملة على أنها محتملة ، بدلاً من مجرد نقطة انطلاق عارية لبناء موقع. يتم تشغيل العرض التوضيحي على خدمة استضافة مجانية توفر PHP و Apache ، ولكن لا يتم حظر بريد إلكتروني ومعظم الروبوتات ، لذلك لا يوجد نموذج اتصال ولا يوجد SSL 1 (لهذا السبب أقول "موقعًا كاملاً" ، ولكن يجب أن تكون سهلة بما يكفي لتنفيذها على مضيف إنتاج.
ملاحظة 1 : تقدم خدمة الاستضافة شهادات موقعة ذاتيًا ، لكنني لست متأكدًا من أن Google تقبل تلك للحصول على تصنيف البحث. نظرًا لأن خدمة الاستضافة تمنع معظم الروبوتات ، فمن الصعب التحقق من صحة ملكيتي ، لذلك أقوم بتشغيل الموقع بدون SSL.
جميع ملفاتي لموقع العرض التجريبي ، والتكوين الخالي من الدهون ، ووحدات التحكم ، وملفات القالب ، وملفات SCSS ، و Image ، و JavaScript في مستودع GitHub هذا. تتوفر ملفات bootstrap والدهون من bootstrap وخالية من الدهون.
يجب أن يكون من السهل استبدال محتوى موقعي الخاص بمحتوى موقع ويب مختلف.
لم يتم تضمين الملفات الخالية من الدهون-تلك الملفات متوفرة من الدهون الخالية
Bootstrap سهل الهيكل مع الفصول المتاحة واستخدام Sass. كان هناك شيئان قمت بتغييره من رمز bootstrap القياسي:
لم يتم تضمين ملفات bootstrap - تلك الملفات متوفرة من bootstrap
على الرغم من أن محتوى الموقع التجريبي باللغة الإنجليزية ، فإن العرض التجريبي لديه صفحات صينية وكورية لإظهار العملية متعددة اللغات. تم إنشاء الصفحات المنزلية الصينية والكورية من الصفحة الرئيسية الإنجليزية باستخدام Google Translate. بقية الصفحات الصينية والكورية ، والتي يتم توفيرها فقط لإظهار الملاحة ، لديها فقط ترجمات جوجل لعناوين الصفحات الإنجليزية وأوصافها.
لتحديث يوليو 2022 ، بالإضافة إلى التحقق من أن الموقع يعمل مع أحدث الإصدارات من الدهون الخالية من الدهون ، و bootstrap 4 ، و jQuery ، قمت أيضًا بمراجعة الموقع إلى:
استخدم خطوط النظام-تم التبديل من استخدام خطوط Google إلى استخدام خطوط system-ui . يتطلب استخدام Fonts Google من متصفح المستخدم إرسال طلب إلى Google للحصول على ورقة الأنماط وملفات الخطوط المطلوبة. يتضمن ذلك إرسال عنوان IP الخاص بالمستخدم إلى Google ، والذي يقوله لائحة حماية البيانات العامة للاتحاد الأوروبي (GDPR) أنه غير مسموح به. يقوم system-ui بتوجيه المتصفح إلى استخدام نفس الخط الذي يستخدمه نظام التشغيل لعرض النص. يوفر هذا نظرة مشابهة لما يراه المستخدم على شاشات النظام ، ويسرع وقت بدء تشغيل الصفحة حيث لا توجد خطوط للتنزيل.
ملفات Bootstrap & jQuery ذاتها-تم التبديل من استخدام شبكات تسليم المحتوى لملفات الإطار والمكتبة لتزويد الملفات من الخادم الخاص بي ، مرة أخرى بسبب متطلبات الناتج المحلي الإجمالي لعدم مشاركة عناوين IP للمستخدم مع مواقع أخرى. أنا الآن أستخدم WebPack للجمع بين jQuery و Bootstrap javaScript و JQuery Lighting Plugin و JavaScript للموقع في ملف واحد (سيتم تنزيل ملف واحد بشكل أسرع).
يفضل الدعم الخنق-في حين أن Boostrap دعم بالفعل إعداد المستخدم للحركة المخفضة ، لم أقم بضبط الرسوم المتحركة jQuery. أنا أفعل الآن.
يفضل الدعم أن يختتم "-إضافة تنسيق وضع مظلم للمستخدمين الذين يفضلون تنسيقًا مظلمًا بدلاً من تنسيق الضوء.
يعمل الموقع التجريبي مع أحدث إصدارات:
ومع:
يتم توفير هذا الرمز تحت رخصة معهد ماساتشوستس للتكنولوجيا. انظر ملف الترخيص للحصول على التفاصيل.
يتم توفير الدهون الخالية من رخصة GNU العامة (GPL V3)
يتم توفير bootstrap بموجب ترخيص معهد ماساتشوستس للتكنولوجيا
يتم توفير الملاحة OffCanvas بموجب ترخيص معهد ماساتشوستس للتكنولوجيا
2018/09/23 - الإصدار الأولي.
2019/01/02 -تم التحقق من صحة الموقع مع 3.6.5 خالية من الدهون وقام بتحديث بعض محتوى الصفحة لتحسين نتائج محرك البحث.
2019/05/10 - تم التحقق من صحة الموقع مع JQuery 3.4.1 و Bootstrap 4.3.1.
2019/05/27 - نقل القسم لإشعار ملفات تعريف الارتباط في الاتحاد الأوروبي إلى أسفل الصفحة حيث كانت Google في بعض الأحيان تضمن نص الإشعار في المقتطف على بعض صفحات نتائج محرك البحث.
2019/07/02 - display=swap على خطوط Google ، مما يلغي الحاجة إلى مدير خط ، على الأقل بالنسبة لخطوط Google (كنت أستخدم Font Face Observer).
2020/01/20 -تم التحقق من صحة الموقع مع 3.7.1 خالية من الدهون و Bootstrap 4.4.1 ، وقام ببعض التعديلات البسيطة للمحتوى.
2020/07/05 -تم التحقق من صحة الموقع مع FARE-FREE 3.7.2 ، Bootstrap 4.5.0 ، و JQuery 3.5.1 ، ألغيت ملفات CSS غير المؤكدة (فقط توفير ملفات CSS المصغرة على الموقع الإلكتروني) ، وقامت ببعض التعديلات البسيطة على المحتوى (بما في ذلك شرح حول كيفية قيامني في رمز VS).
2022/07/15 -تم التحقق من صحة الموقع مع FARE-FREE 3.8.0 ، BOOTSTRAP 4.6.1 ، و JQUERY 3.6.0 ، تم التبديل من خطوط Google إلى استخدام خطوط النظام ، وأضاف الدعم للحركة المنخفضة والوضع المظلم ، وتحديث المحتوى.
2022/11/17 - تم التحقق من صحة الموقع مع JQuery 3.6.1 والتحول إلى توفير صور ويب عادية وعالية الدقة للضوء والظلام باستخدام عناصر الصورة والمصدر.
2023/07/09 -أضف رابطًا إلى Bootstrap 5.3 مع مستودع إطار عمل PHP الخالي من الدهون.
2023/10/07 - تم التحقق من صحة الموقع مع Bootstrap 4.6.2 و JQuery 3.7.1. يعمل مضيف الموقع التجريبي الآن على تشغيل PHP 8.2 ، لذلك يستخدم العرض التوضيحي الآن 3.8.2 من الدهون.