تعريب ستايلات الجيل الثالث

محروم.كوم · #1 05-07-2010, 01:00 AM

بسم الله الرحمن الرحيم..

السلام عليكم ورحمة الله وبركاته

إخواني الكرام.. نظراً لكثرة الإستفسارت الخاصة بكيفية تعريب ستايلات نسخة الآي بي - الجيل الثالث..

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

وأنوه في البداية أنا صاحب الفضل الأول بعد ربنا سبحانه وتعالى في فهمي لإستايلات الجيل الثالث هو أستاذي العزيز Ali Ajouz

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

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

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

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

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

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

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

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

Look & Feel -> Manage Languages

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

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

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

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

اجعله: Yes

ثم إضغط Save Changes

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

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

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

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

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

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

كما بالصورة:

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

في الحقل الخاص بـ: 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

وهذا الرابط الخاص بشرح الاستايل الشيت الخاص بنسخة الجيل الثالث قد يفيد الكثير أيضاً في فهم تعديل الاتجاهات: http://www.4ipb.com/...b-30-css-guide/

إلى هنا نكون إنتهينا من تعريب إستايل أجنبي

آمل من الله تعالى أن يكون هذا العمل خالصاً لوجهه وأتمنى أن أكون قد أضحت الفكرة بالشكل الأمثل..

في إنتظار إستفساراتكم

ملحوظة: يمنع بتاتاً نقل الموضوع دون الاستئذان من إدارة الموقع

الموضوع الأصلي: تعريب ستايلات الجيل الثالث المصدر: 4IPB.COM __DEFINE_LIKE_SHARE__