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

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

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

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

هذه هي الطريقة التي إستخدمتها في تعريب الإستايلات التي عربتها {طبعا مع إختصار العديد من الخطوات مع الخبرة}

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

الصور لكبر حجمها أبقيت روابطها فقط وهي مرتبة كما يفترض أن تراها

وآسف لأنه تنسيق الموضوع ضعيف {أسوء شي أجيده هو التنسيق}

أول شي :-

الأدوات المطلوبة تواجدها في الجهاز

1:- متصفح فايرفوكس {ويفضل آخر إصدار}

2:- إضافة FireBug للفاير فوكس مركبة {وشي اكيد الأفضل آخر نسخة}

3:- إضافة Web Developer للفايرفوكس مركبة {وأكيد آخر نسخة}

4:- السيرفر المحلي {أنا أستخدم AppServ} وطبعا هو إختياري {يمكنك العمل على موقعك مباشرة ولكنك ستستهلك وقتا أكثر}

5:- محرر NotePad++ مثبت على الجهاز {ويفضل آخر نسخة}

6:- آخر نسخة من منتدى أو … {آخر نسخة لأنه لن يقوم موقع بالعمل على نسخة قديمة}

7:- آخر نسخة من الإستايل الذي تريد التعديل عليه {يفضل أن تحمل مباشرة من موقع المصمم لتضمن عدم العبث بها}

8:- تقريبا ماراح تحتاج شي إضافي {بحسب إمكانياتك الشخصية}

ثاني شي :-

الأشياء المطلوب تواجدها في الشخص الذي سيقوم بالعمل

1:- إتقان لغة HTML {على الأقل الأساسيات والباقي يبحث عنه لو تعطل}

موقع عربي

http://ar.html.net/tutorials/html/

و

آخر إنجليزي

http://www.w3schools.com/html/default.asp

2:- إتقان لغة CSS {على الأقل أساسياتها أو إلمام بسيط بها}

موقع عربي

http://ar.html.net/tutorials/css

و

آخر إنجليزي

http://www.w3schools.com/css/default.asp

3:- معرفة بلغة PHP {تعرفو أنه بيكون في ملفات القالب أجزاء بلغة php مثل عبارات if الشرطية وغيرها}

4:- إتقان لغة JavaScript {أو إلمام بسيط بأساسياتها وقد لاتحتاجها — ذلك يعتمد على القالب نفسه}

5:- إتقان أو معرفة بأساسيات بناء الإستايل {يعني تكون عندك معرفة بكل ملف شنو المفروض يكون }

6:- سرعة الفهم والبديهة و التفكير بعقلانية {صدقوني بدونها راح تتعذبو وتسألو عن أشياء تعرفوها لمجرد عدم التفكير بها قليلا}

7:- أهم شي هو الصبر {لأنك إذا ماراح تصبر في الشغل قد لاتنتج بالمستوى المطلوب}

============================================

نبدأ بالشرح

أولا شرح الأدوات المطلوبة {طبعا الجديدة منها على معظمكم}

1:- إضافة FireBug {لم أشرح كيفية تثبيتها لأنها مثل أي إضافة أخرى للفايرفوكس }وهذا شرح أجنبي لها

http://docs.joomla.org/Tutorial:Using_Firebug_With_Your_Joomla_Website

إضافة جبارة جدا وسهلة لي عملي جدا {سأشرح أهم ماسنحتاجه منها والباقي لكم البحث والإستزادة}

طبعا كل الشكر للأجنبي الذي نصحني بها

طيب نبتدي شرح الإضافة — تابعو الصور

وبكذا إنشاء الله شرح هذه الإضافة مفهوم

========================

2:- شرح إضافة Web Developer

إضافة ممتازة جدا ولها إمتيازات عن غيرها سأتطرق لها في الشرح

طيب نبتدي الشرح — تابعو الصور

وبكذا إنشاء الله شرح هذه الإضافة مفهوم

========================

3:- شرح أهم مانحتاجه في محرر NotePad++

محرر ممتاز يدعم الكثير من لغات البرمجة ومنظم ويلون الأكواد وبمجرد أن تقوم بشيء خاطئ يتغير لونه ولون كل شيء سيتأثر به في ما بعده

أعتقد أن الجميع يعرف إستخدام المحررات وسأعود لشرحه مرة أخرى لأنه حدث خطأ وفقدت الملف الخاص بالشرح وسأعيد كتابته

========================

ألحين ندخل في شرحنا المهم

أول شي شنو التعريب نفسه :-

هو تعديل جميع الملفات الضرورية في الموقع لتتغير طريقة الكتابة

من اليسار إلى اليمين {ltr} إلى اليمين إلى اليسار {rtl}

و إعادة الكتابة على الصور المكتوب عليها بالإنجليزي إلى العربي وقلب مايحتاج منها إلى القلب {القلب عادة يكون بشكل أفقي }

وعادة تعديل الإستايل أو القالب يكفي {ذلك يعتمد على مبرمج السكربت}

الحين نشوف شنو نحتاج لنفعله بعد ماعرفنا شنو نقصد بالتعريب :-

1:- قلب إتجاه كتابة النص

2:- مسح الكتابة الإنجليزية عن الصور والكتابة عليها بالعربي وقلب مايحتاج منها {عادة توضع الصور في مجلد فرعي بعنوان ar}

3:- تبديل مكان اللوجو {Logo} من اليسار إلى اليمين {أو بحسب مايعجبك وليست شرطا}

4:- تبديل أماكن وإتجاهات القوائم من اليسار إلى اليمين

5:- وضع لمستك الخاصة على القالب {تعديل تراه ضروريا ولاأستطيع ذكره لأنه شيء من رأيك الخاص مثلا محاذات الكتابة في القوائم يراها

البعض في الوسط أفضل والبعض يراها بمحاذات اليمين أفضل}

ألحين راح أعطيكم نبذة عن كل نقطة :-

1:- قلب إتجاه النص

لها عدة طرق منها :-

A:- بإستخدام text-align في css

وتأخذ قيم {Left – Right – center} وهناك قيمتان أخرتان ولكن هذه هي المهمة لكم الآن

مثال

http://www.w3schools.com/Css/tryit.asp?filename=trycss_text-align

B:- أن تقلب إتجاه الجدول كاملا أو الخلية كاملة بإستخدام direction في css

وتأخذ قيم {ltr للكتابة من اليسار إلى اليمين} و {rtl للكتابة من اليمين إلى اليسار} وهناك قيمة أخرى {لاتحتاجونها الآن}

مثال

http://www.w3schools.com/Css/tryit.asp?filename=trycss_text_direction

2:- مسح الكتبة الإنجليزية عن الصور والكتابة عليها بالعربي وقلب مايحتاج منها

تتم عن طريق برامج تحرير الصور مثل الفوتوشوب و Gimp

وهي تعتمد بشكل أساسي على خبرتك في التعامل مع البرامج ونحن هنا لسنا بصدد شرح اي منهما

3:- تبديل مكان اللوجو {Logo} من اليسار إلى اليمين

تتم عن طريق عدة طرق ومنها :-

A:- تعديل مكانه عن طريق float في css

وهي تأخذ قيما منها {Left – right} وهناك قيمتان أخرتان غير مهمتين لنا الآن

مثال

http://www.w3schools.com/Css/tryit.asp?filename=trycss_float

B:- أن تقلب إتجاه الجدول كاملا أو الخلية كاملة بإستخدام direction في css

وتأخذ قيم {ltr للكتابة من اليسار إلى اليمين} و {rtl للكتابة من اليمين إلى اليسار} وهناك قيمة أخرى {لاتحتاجونها الآن}

مثال

http://www.w3schools.com/Css/tryit.asp?filename=trycss_text_direction

C:- تعديل مكانه عن طريق التعديل على الجدول

مثلا تبديل محتويات العمود الأيمن بالأيسر {العمود في html هو } أو بحسب فهمك للموقف

وفي أحيان كثيرة تكون هذه الحركة ضرورية لأنه قد تكون هناك محتويات يمينه ويؤذيها تغيير {float أو direction}

بعض الأحيان تحتاج للتلاعب في المحتويات أو التنازل وحذف بعضها لتظهر بشكل صحيح

4:- تبديل أماكن وإتجاهات القوائم من اليسار إلى اليمين

A:- بإستخدام text-align في css لكل خلية في القوائم

B:- أن تقلب إتجاه الجدول كاملا أو الخلية كاملة بإستخدام direction في css

5:- وضع لمستك الخاصة على القالب

هذه لا أستطيع شرح أي شيء عنها لأنها كما قلنا تعتمد عليك أنت وأفكارك الخاصة

قد يكون شيء إضافي تضيفه للقالب وقد يكون شيء تعدله أو تستبدله وقد يكون شيء تحذفه

مثلا قد تضيف مكان جديد لعرض الموديلات وقد تغير مكان أحدها وقد تحذف أحد الأماكن

========================

أتمنى أن تكونو قد فهمتم أنه التعريب والتعديل يعتمد بشكل أساسي على مستواك في لغات البرمجة المذكورة وفهمك لتركيب البرنامج

أتمنى أني أكون قدمت شيء مفيد

ولا أرجو منكم إلا الدعاء في الغيب لوالدي ولي

والدرس ذو حقوق مفتوحة {يسمح النقل والإقتباس والتعديل ووو… ولكن يمنع حذف الحقوق وعند النقل أرجو ذكر المصدر}

وشكرا لكم

SH@RK

من معامل شبكة شارك ديزاين