المدخل لتعريب القوالب

قم بوضع مشاكلك مع القوالب هنا و كذلك تصميماتك لجوملا! أو تصميماتك بوجه عام

Moderators: sherif, General Support Moderators

Locked
User avatar
Mohammed
Joomla! Ace
Joomla! Ace
Posts: 1313
Joined: Thu Oct 27, 2005 11:20 pm
Location: Cairo , Egypt
Contact:

المدخل لتعريب القوالب

Post by Mohammed » Sun Apr 16, 2006 11:45 pm

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

أرجو أن يكون الجميع بألف صحة و سلامة

تعتبر عملية قولبة جملة أو Templating عملية صعبة نسبياً خاصة بالنسبة لشخص مبتدى

لذلك فكرت فى عمل هذا الموضوع ليكون بمثابة دليل مبسط أطرح فيه أفكارى بخصوص هذا العمل و بدون استخدام برامج خارجية مثل Dreamweaver أو غيرها

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

فى البداية مم يتكون القالب ؟
يتكون القالب من ملفات و مجلدات تكون فى أغلب الأحوال كالتاالى ,

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

template_thumbnail.png
هذه الصورة المصغرة للقالب , و معمتها هى عرض صورة للقالب للمعاينة قبل الاستخدام وهى غير ذات أهمية فى عملية البرمجة مطلقاً و يمكن حذفها و سيعمل القالب

templateDetails.xml هو ملف معلوماتى من الطراز الأول , حيث يقوم بإخبار جملة بملفات القالب جميعها كى تتعامل معها بشكل منطقى , كذلك يحفظ به صانع القالب حقه , و لن تستخدمه إلا إذا كنت تنوى عمل قالب منذ البداية

هذه كانت الملفات , ننتقل إلى المجلدات ,

/images يتضمن هذا المجلد جميع الصور المستخدمه لعرض القالب

/css لخبراء لغة css  يحتوى هذا المجلد على ملف وحيد بامتداد css غالباً , و لغة css هى التى تتحكم فى طريقة عرض الأحرف و حجمها و المؤثرات عليها و ما إلى ذلك





سؤال يطرح نفسه عند عمل تعديلات على قالب موجود على السيرفر مباشرة , لنفرض أنك قمت بنعديل صورة ضمن مجلد /images و أردت استبدالها , فلماذا يرفض السيرفر ذلك ؟
  ??? ???

هذه إحدى الأشياء التى تجعل المستخدم على وشك أن يفقد أعصابه و لكنها فى الحقيقة ميزة أمنية هامة , فجملة تقوم بحماية تلك الملفات من الوصول إليها بطرق غير شرعية , تماماً إذا أردت حذف ملف من على ويندوز و هو مفتوح بواسطة أى برنامج

هذا هو ما دفعنى لكتابة الموضوع من الأساس , لأنى فوجئت بنفس السؤال من صديق أوروبى و على مستوى من المعرفة التقنية يفوق بمرات و مرات مستوى أخيكم المتواضع  :'(

المهم , عند التعديل على قالب , ماذا أفعل ؟

أولا يجب أن يكون لديك سيرفر محلى لأن ذلك سيخلصك من مشكلة التصاريح و تعقيدات نظام الملفات على لينكس المستخدم على السيرفرات , و بعد انتهاء التعديل على القالب تقوم بضغط جميع الملفات فى ملف مضغوط بامتداد zip تماماً كما ترى فى القوالب التى تحصل عليها , و أخيراً ترفع الملف إلى جملة من لوحة التحكم
Last edited by Mohammed on Sun Apr 16, 2006 11:52 pm, edited 1 time in total.
"Joomla! is science made clear."
Mohammed Sh. Abbas  -- Joomla! Fan !!

User avatar
Mohammed
Joomla! Ace
Joomla! Ace
Posts: 1313
Joined: Thu Oct 27, 2005 11:20 pm
Location: Cairo , Egypt
Contact:

Re: المدخل لتعريب القوالب

Post by Mohammed » Sun Apr 16, 2006 11:45 pm

كيف أقوم بتعريب قالب ؟

تعريب القالب عملية سهلة ولكنها تحتاج إلى وقت و اختبار , لذلك فالأفضل أن تتم على سيرفر محلى كما ذكرنا سابقاً , و يكون الدافع لها هو إعجابك بأحد القوالب الغربية و رغبتك فى تحويله لتستخدمه على موقعك العربى , أليس كذلك ؟  :D

هذا طبعاً من حقك حيث أن كل ذلك تحت اتفاقية البرامج مفتوحة المصدر , و لكن ذلك لا يبرر إزالة الحقوق , على الأقل من ملف xml

ندخل فى الجد ,

سوف تحتاج كما ذكرنا إلى محرر نصوص متطور مثل نوتباد ++ لفتح ملفات index.php و  template.css

أولاً : قم بفتح ملف index.php ستجد فى أعلى الملف الكود التالى :

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml">
قم باستبداله بالكود التالى

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml" dir="rtl">
و لاحظ الكود الجديد لتجد dir="rtl" قد أضيفت و هى الكفيلة بعكس اتجاه القالب 180 درجة ليصبح من اليمين إلى اليسار

قبل أن نترك ملف index.php لحاله , قم بالبحث عن الكلمات التالية

iso-8859-1

أو

utf-8

فإذا وجدت أيا منهما قم باستبدالها ب windows-1256 حيث هذا هو ترميز عرض الحروف العربية لأن الترميزات السابقة خاصة بعرض الحروف اللاتينية

مثال على ذلك
Image

Image

Image

Image

Image
أخيراً , حتى ننهى التعامل مع ملف index.php  إذا كانت خبرتك فى لغة php جيدة فسيمكنك اللعب بالكود سواء بالحذف أو الاستبدال أو حتى بالإضافة لكى تعدل طريقة ظهور القالب

فضلاً راجع هذا الرابط حول مدلولات ما تجده فى ملف index.php

http://www.joomlart.com/tutorials/templ ... ayout.html
Last edited by Mohammed on Mon May 08, 2006 9:17 pm, edited 1 time in total.
"Joomla! is science made clear."
Mohammed Sh. Abbas  -- Joomla! Fan !!

User avatar
Mohammed
Joomla! Ace
Joomla! Ace
Posts: 1313
Joined: Thu Oct 27, 2005 11:20 pm
Location: Cairo , Egypt
Contact:

Re: المدخل لتعريب القوالب

Post by Mohammed » Sun Apr 16, 2006 11:46 pm

الآن ننتقل إلى ملف css  بعد الانتهاء من ملف index.php قم بحفظه و فتح ملف css

على النقيض من ملف index.php و الذى لم يكن بالضرورة فهم ما يجتويه واجباً , أؤكد أنه قبل الشروع فى تعديل ملف css يجب عليك الإحاطه بكامل محتوياته حتى تعلم جيداً ماذا تفعل و لا تتسبب فى ضياع مجهودك بسبب خطأ صغير

فى البداية يتكون ملف css من عدة فقرات قياسية , كل فقرة منها ترتبط بجزء من القالب

لذلك فعند تعاملك مع احدى الفقرات , انس بقية الملف و تعامل معها كأنها ملف منفصل و هكذا حتى تعدل على بقية الفقرات

مثلا , هذه تعتبر فقرة

Code: Select all

div#header_r {
	height: 90px;
	background: url(../images/mw_header_blue_t_r.png) 100% 0 no-repeat;
	padding-left: 370px;
	padding-right: 30px;
	padding-top: 25px;
	overflow: hidden;
	text-align: left;
}
لاحظ انها تبدأ بالقوس { و تنتهى ب { و هذا ما يساعدك عليه برنامج Notpad++

قام المطورون بوضع صيغه قياسية لما يجب أن تكون عليه تلك الفقرات , تجد شرحها هنا

http://www.joomlart.com/tutorials/templ ... nutes.html

و هذا الرابط أيضاً

http://www.joomlaos.de/CSS_Guide.html

حيث لا يمكن أن يخرج أى قالب عن هذه الأطر القياسية , و هذا هو سبب وجود العديد من القوالب لجملة أو لمامبو فى ما سبق

فمثلا إذا وجدت فى ملف css فقرة بعنوان a:mainlevel:link فهذا يعنى أنك ستتعامل مع القائمة الرئيسية أو أى قائمة للموقع

لنتقدم أكثر لندرك ماذا يجب تغييره حتى يتم تعريب القالب ,

أول الأوامر التى يجب ملاحظتها و هى من أهم الأوامر هى

Code: Select all

float : 
حيث يعمل هذا الأمر على التحكم فى محاذاه عنصر معين مثل القوائم و المحتوى و ما إلى ذلك

يتم وضع الأوامر left أو right أو center

فمثلاً و كما ستجد فى القوالب الغربية يكون الأمر

Code: Select all

float : left;
فقم بتغيير كلمة left إلى right و لا تنس إضافة الفاصلة المنقوطة بعد كل أمر


ثانى الأوامر هو

Code: Select all

font-family:
من منا يكره الخط الذى يتم عرض المحتوى به فى القالب الافتراضى ؟  ;D

هذا لا لشىء إلا بسبب أن من يصنع القالب قد قام وضع الخط arial أو sans serif و هذا مناسب للانجليزية و لكن ليس لعين المستخدم العربى عند عرض لغته الأم ,

لذلك سوف تجد هذا الأمر

Code: Select all

  font-family: Arial, Helvetica, sans-serif;
فقم بتغييره إلى

Code: Select all

  font-family: Tahoma, Arial, Helvetica, sans-serif;
لاحظ اننا أضفنا خط تاهوما و هو الأفضل لعين المستخدم العربى و هو المستخدم فى المنتدى أيضا  :P

و لاتقم بحذف بقية الخطوط الأخرى , حيث لا نضمن وجود خط Tahoma عند الجميع , من باب الاحتياط ليس أكثر

ثالث تلك الأوامر هو

Code: Select all

text-align:
و هو يختلف عن الأمر float : فى أن الأخير مهمته محاذاه العنصر مثل القائمة أو الموديل أو المحتوى , بينما الأول وظيفته محاذاة النص بداخل العنصر  :-*

أيضاً يقبل إضافة left أو right أو center

هذه الأوامر التى تتعلق بالتعريب ,

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

توجد اوامر أخرى مثل

Code: Select all

color:
و أمامه يوضع كود اللون بصيغة اتش تى ام ال

Code: Select all

background:
إذا أردت وضع خلفية للنص مثل صورة أو لون و يقبل كود اللون أو رابط الصورة

Code: Select all

padding:
هذا الأمر يدخل ضمن اوامر المحاذاه و لكن المحاذاه غير المطلقة , تعلم أنه عندما تكتب أمام أمر المحاذاه right فإنها ستجعل المحاذاه لأفصى اليمين , و لكنك لا تريد ذلك بالتحديد , فيمكنك جعل المحاذاه لليمين قليلا

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

و بالطبع وجود أربعة أكواد لتنظيم المحاذاه أعلى و أسفل و يمينا و يساراً , باختصار استخدم هذا الأمر لتخصيص العنصر الذى تعمل عليه على ذوقك و كما تحب بعيداً عن الخيارات المطلقة

بهذا نكون قد أنهينا ما يتعلق بملف css مع ملاحظة أنه عند التعديل يجب عليك تعديل فقرة و التأكد من نتيجة عملك فوراً و بعدها تكمل لفقرة أخرى

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

هذا ما يتعلق بتعريب القوالب , لاتنس أن تحزم الملفات بعد الانتهاء من العمل عليها و تجربتها فى ملف مضغوط و ترفعه

أخيراً أرجو أن يكون الشرح واضح و مؤدى للغرض و لا تنسونا من صالح دعائكم

أخوكم , محمد عباس  :)
Last edited by Mohammed on Sun May 28, 2006 1:39 am, edited 1 time in total.
"Joomla! is science made clear."
Mohammed Sh. Abbas  -- Joomla! Fan !!

AROON
Joomla! Intern
Joomla! Intern
Posts: 73
Joined: Sun Mar 12, 2006 8:00 pm
Location: egypt

Re: المدخل لتعريب القوالب

Post by AROON » Wed Apr 19, 2006 12:52 am

ما شاء الله شرح مفصل تسلم ايدك علي الشرح الجميل ده والي الامام دائما  :)

kokie cartoon
Joomla! Apprentice
Joomla! Apprentice
Posts: 17
Joined: Sun Apr 30, 2006 9:17 pm

Re: المدخل لتعريب القوالب

Post by kokie cartoon » Mon May 01, 2006 2:47 pm

أنا عم عرب قالب هلأ تبعاً للتعليمات بس في مشكلة صغيرة، إنه الترميز مكتوب بالملف كمتحول

$iso = split( '=', _ISO );echo '';?>

شو أعمل فيه هاد؟

وكمان في بمجلد القالب في ملفين مو ملف واحد
index.php, splitmenu.php

شو رأيكون؟ ???

ومشكورين سلف

User avatar
Mohammed
Joomla! Ace
Joomla! Ace
Posts: 1313
Joined: Thu Oct 27, 2005 11:20 pm
Location: Cairo , Egypt
Contact:

Re: المدخل لتعريب القوالب

Post by Mohammed » Mon May 01, 2006 2:57 pm

kokie cartoon wrote: أنا عم عرب قالب هلأ تبعاً للتعليمات بس في مشكلة صغيرة، إنه الترميز مكتوب بالملف كمتحول

$iso = split( '=', _ISO );echo '';?>

شو أعمل فيه هاد؟

وكمان في بمجلد القالب في ملفين مو ملف واحد
index.php, splitmenu.php

شو رأيكون؟ ???

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

Code: Select all

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
ملف splitmenu.php  يتولى أمر فصل الموديلات عن بعضها , و ليس له علاقة بالتعريب

الأفضل ترك ما ذكرت على حاله

سلامى
"Joomla! is science made clear."
Mohammed Sh. Abbas  -- Joomla! Fan !!

kokie cartoon
Joomla! Apprentice
Joomla! Apprentice
Posts: 17
Joined: Sun Apr 30, 2006 9:17 pm

Re: المدخل لتعريب القوالب

Post by kokie cartoon » Mon May 01, 2006 5:00 pm

المشكلة لساتها قائمة!!

السطر إلي تحته منضيف فيه الاتجاه
dir="rtl"

بس الترميز لحتى نبدله من
utf-8 or iso ->> windows-1256

وهاد الترميز مو موجود بالملف، وحسب معلوماتي المتواضعة إنه الترميز يا
encode or charset

والموجود هوي إنكود لكن قيمته معطاة كمتحول متل ماذكرت

فهاد كان سؤالي.. أو إذا كان اعتقادي خطأ ممكن بس تخبروني وين أجد الترميز.
مشكورين  :)

kokie cartoon
Joomla! Apprentice
Joomla! Apprentice
Posts: 17
Joined: Sun Apr 30, 2006 9:17 pm

Re: المدخل لتعريب القوالب

Post by kokie cartoon » Mon May 01, 2006 5:05 pm

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

داخل صفحة xml :


User avatar
Mohammed
Joomla! Ace
Joomla! Ace
Posts: 1313
Joined: Thu Oct 27, 2005 11:20 pm
Location: Cairo , Egypt
Contact:

Re: المدخل لتعريب القوالب

Post by Mohammed » Mon May 01, 2006 5:24 pm

kokie cartoon wrote: المشكلة لساتها قائمة!!

السطر إلي تحته منضيف فيه الاتجاه
dir="rtl"

بس الترميز لحتى نبدله من
utf-8 or iso ->> windows-1256

وهاد الترميز مو موجود بالملف، وحسب معلوماتي المتواضعة إنه الترميز يا
encode or charset

والموجود هوي إنكود لكن قيمته معطاة كمتحول متل ماذكرت

فهاد كان سؤالي.. أو إذا كان اعتقادي خطأ ممكن بس تخبروني وين أجد الترميز.
مشكورين  :)
طالما الترميز لا يوجد فى ملف القالب فهذه شغلة ملفات اللغة

لأن بعض القوالب يصممها أصحابها بحيث يجبر المستخدم على استخدام ترميز معين و يتجاهل الترميزات الأخرى

أساساً الترميز مهمة ملف اللغة و لكن إذا تم وضع كود ترميز معين فى القالب فجملة تتجاهل ما هو موجود بداخل ملف اللغة

أرجو يكون الأمر واضح

سلامى
"Joomla! is science made clear."
Mohammed Sh. Abbas  -- Joomla! Fan !!

murshed
Joomla! Apprentice
Joomla! Apprentice
Posts: 38
Joined: Fri Jul 28, 2006 10:08 am

Re: المدخل لتعريب القوالب

Post by murshed » Sun Jul 30, 2006 2:11 pm

سؤال اخي محمد بالنسبة للتعريب

حاولت ماتم ذكره هنا و قد نفع في أحد القوالب التي اعطيتني رابطها في موضوعي السابق, فحاولت عمل نفس مع قالب

rhuk_solarflare_ii

الخاص بجملة لتعريبه, و لكن حصلت لخبطة حيث ان الخط لم يتغير (يعني التاهوما لم يظهر) و ايضاً القائمة الرئيسة بقت على اليسار في حين ان التصويتات انتقلت من اليمين الى اليسار فقط

هل هناك مشكلة مع هذا القالب ان ماذا؟

murshed
Joomla! Apprentice
Joomla! Apprentice
Posts: 38
Joined: Fri Jul 28, 2006 10:08 am

Re: المدخل لتعريب القوالب

Post by murshed » Sun Jul 30, 2006 2:15 pm

فقط للتنبيه ان
rhuk_solarflare_ii

هو القالب الموجود مع جملة .. الاسود و الابيض

User avatar
Mohammed
Joomla! Ace
Joomla! Ace
Posts: 1313
Joined: Thu Oct 27, 2005 11:20 pm
Location: Cairo , Egypt
Contact:

Re: المدخل لتعريب القوالب

Post by Mohammed » Sun Jul 30, 2006 3:33 pm

نعم , أعتقد أن هذا القالب لديه مشكلة ما ....

يمكنك الاستفسار عنها فى قسم القوالب إعلاه أو اختيار قالب آخر , و أغلب القوالب يمكن تعريبها بطريقة سهلة من دون مشكلات

سلامى
"Joomla! is science made clear."
Mohammed Sh. Abbas  -- Joomla! Fan !!


Locked

Return to “القوالب و التصميم”