سوق العرب | معهد سكيورتى العرب | وظائف خالية

نسخة كاملة: شرح تعريب ستايلات الجيل الثالث لمنتديات ib
أنت حالياً تتصفح نسخة خفيفة من المنتدى . مشاهدة نسخة كاملة مع جميع الأشكال الجمالية.
السلام علكيم ورحمة الله وبركاته:

أنوه أيضاً... أن هذا الشرح قد يتفق أو لا يتفق مع ستايلات عدة.. كل حسب أسلوبه في التعامل مع الاستايلات..

أي أن هناك الكثير من الاستايلات تتطلب معرفة بالـHTML و الـ CSS

وهنا في شرحي حاولت تبسيط الأمور قدر الإمكان..

بسم الله على بركة الله..

-------------------------------------------

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

هذه الخطوة يتم تنفيذها كالتالي:

من لوحة تحكم منتداك:

Look & Feel -> Manage Languages

ثم إختر اللغة التي تود تعديل إتجاه الاستايل بها وبجانبها اضغط على: Edit...

ثم نقوم بضبط الإعدادت كما بالصورة:

[صورة مرفقة: ta3rebib1.jpg]

قم بتغيير الإعدادات حسب رغبتك..

ما يهمنا هو الخيار: Display right to left?

اجعله: Yes

ثم إضغط Save Changes

إلى هنا نجد أن الاستايل بالكامل تم تحويله من إتجاه اليسار إلى إتجاه اليمين (LTR to RTL)

فيما عدا الجزء الخاص بالهيدر (Header)

لتعديل الهيدر، أي لوضع اللوجو باليمين وبيانات العضو باليسار.. نتبع الآتي:

من لوحة تحكم منتداك:

اضغط على الاستايل الذي تود تعديل الهيدر الخاص به.. ثم اضغط على التبويب الخاص بالـ CSS

أسفلها مباشرة اضغط على: Add CSS File

كما بالصورة:

[صورة مرفقة: ta3rebib2.jpg]

تظهر لنا النافذة التالية:

[صورة مرفقة: ta3rebib3.jpg]

في الحقل الخاص بـ: CSS File Name:

نقوم بتسمية الإستايل شيت بأي اسم وليكن: ipb_rtl كما هو موضح بالصورة السابقة..

ثم اضغط Add

بعدها تظهر لنا صفحة بيضاء فارغة.. نقوم بملئها بأكواد الصفحة الموجودة على الرابط التالي:

http://www.4ipb.com/...css/ipb_rtl.css

للعلم.. هذه الصفحة موجودة لدى كل موقع يستخدم نسخة الجيل الثالث..

استبدل اسم موقعنا باسم موقعك وستجد هذه الصفحة

بعد نسخ ولصق أكواد هذه الصفحة بالاستايل شيت الذي قمنا بإنشائه..

نبحث عن:

كود :
/*** COMMENT THE FOLLOWING TO ALIGN THE LOGO TO THE RIGHT SIDE AND THE MENU TO THE LEFT ***/
#branding { text-align: left; direction: ltr; }
#user_navigation.not_logged_in {text-align: right; float: right;}
#user_navigation { left: auto;right: 10px;float: right; }
/*** COMMENT THE FOLLOWING TO ALIGN THE LOGO TO THE RIGHT SIDE AND THE MENU TO THE LEFT ***/

ونقوم بحذفه..

لأن هذا الكود هو المسئول عن ظهور اللوجو بيسار الصفحة والبيانات الخاصة بالعضو بيمين الصفحة.. لذا فنحن لا نحتاجه الآن..

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

نجد أن اللوجو تم عكسه.. وهو ما أردنا فعله

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

ومثل هذه الاستايلات تحتاج لخبرة بسيطة بالـ HTML و الـ CSS

ولكن قد يفيد ما سأذكره الآن مع القليل من مثل هذه الاستايلات..

بالاستايل شيت المسمى: ipb_styles.css .. نحاول البحث عن الاختلافات من خلال الضغط على: Compare Differences

ونقل هذا الاختلافات بالكلاسات الأساسية إلى الاستايل شيت الذي أنشاناه تحت اسم: ipb_rtl

ثم بنقوم بتعديل الاتجاهات مثل: Right نجعلها Left و Left نجعلها Right


انتهى الشرح


منقول من موقع 4ipb.com

ادارة سكيورتي العرب
روابط المرجعيات