جديد الموقع
للحصول على جديد الموقع إضغط على الصورة أعلاه
المشاركات الشائعة
-
التسيقية الجهوية لأساتذة 3 غشت بجهة تادلة أزيلال تخوض إضراب لمدة اسبوع إبتداءا من يوم 14 دجنبر الجاري الى يوم 20 دجنبر من نفس الشهر بالإضا...
الخميس, فبراير 11, 2010 |
تعديل الرسالة
تعديل الرسالة
بسم الله الرحمن الرحيم .
نبدأ : بعد أن تعرفنا في الدرس السابق على بعض الأكواد التي سنستخدمها في تعريب القوالب , وعلى نبذة عن HTML و CSS الآن جاء وقت التطبيق على قالب من القوالب , وهو سهل التعريب , وسنشرح لكم كيفية تعريبنا له , من الألف إلى الياء .. بإذن الله تعالى .
ملاحظة :
القوالب تختلف في تعريبها , فهناك قوالب سهلة التعريب وهناك قوالب سهلة التعريب أيضاً ولكنّها تحتاج إلى جهد , وهناك قوالب فيها خاصية أنه يتعرب تنسيق بعض العناصر من خلال لغة المدونة ..
هذا القالب هو Relaxation وقد سبق وأن عربته لكم هناتعريبا بسيطا .. وهو لا يحتاج منا إلا إلى بضع دقائق فقط , ولذلك لن يحتاج إلا إلى موضوع واحد فقط ..
وهذه صورة القالب قبل أن نعرب فيه شيئا ..
ترون في الصورة التي أمامكم الآن 8 نقاط .. والنقاط التي تحتاج منا إلى تعديل التنسيق هي 5 نقاط فقط .. وهذه النقاط مرتبة :
نبدأ : بعد أن تعرفنا في الدرس السابق على بعض الأكواد التي سنستخدمها في تعريب القوالب , وعلى نبذة عن HTML و CSS الآن جاء وقت التطبيق على قالب من القوالب , وهو سهل التعريب , وسنشرح لكم كيفية تعريبنا له , من الألف إلى الياء .. بإذن الله تعالى .
ملاحظة :
القوالب تختلف في تعريبها , فهناك قوالب سهلة التعريب وهناك قوالب سهلة التعريب أيضاً ولكنّها تحتاج إلى جهد , وهناك قوالب فيها خاصية أنه يتعرب تنسيق بعض العناصر من خلال لغة المدونة ..
هذا القالب هو Relaxation وقد سبق وأن عربته لكم هناتعريبا بسيطا .. وهو لا يحتاج منا إلا إلى بضع دقائق فقط , ولذلك لن يحتاج إلا إلى موضوع واحد فقط ..
وهذه صورة القالب قبل أن نعرب فيه شيئا ..
ترون في الصورة التي أمامكم الآن 8 نقاط .. والنقاط التي تحتاج منا إلى تعديل التنسيق هي 5 نقاط فقط .. وهذه النقاط مرتبة :
- عنوان المدونة, ونلاحظ أن تنسيقه على اليمين ولا يحتاج إلى تعريب .
- التأريخ تنسيقه أيضا في اليمين ولا يحتاج إلى تعريب .
- عنوان الموضوع في الوسط وشكله غير مستساغ ,لذلك من الأفضل أن نجعل تنسيقه على اليمين.
- نص التدوينة يجب أن نجعل تنسيقه من اليمين إلى اليسار .
- إحصائيات الموضوع تنسيقها في اليمين ولا تحتاج إلى تعريب .
- الاشتراك في الرسائل , من الأفضل أن يكون تنسيقه من اليمين إلى اليسار بدلا من الوسط .
- عنوان عناصر القائمة الجانبية , يحتاج منا إلى إزالة التقطيع الموجود فيه , وجعل تنسيقه يمينيا .
- النص الذي تحت عناوين العناصر , يحتاج إلى تنسيق من اليمين إلى اليسار .
هنا اتضح لنا أنا سنغير تنسيق 5 عناصر فقط من القالب , وهو أمر سهل للغاية , لنبدأ معكم ..
تعريب القالب :
عادة أنا عندما أبدأ في تعريب قالب ما , أتجه إلى
كلمة Body تعني الجسم , وتعني جسم القالب كامل ..
نذهب إلى التخطيط ثم إلى تحرير Html رأينا القالب أمامنا بأكواد الاتش تي ام ال , نبحث الآن عن body { ..
ملاحظة : عند البحث استخدم CTRL+F لتسهيل عملية البحث .
وجدنا في القالب 2 body { .. هذا الأول ..
ونجد تحت هذا العنصر الخط وحجم الخط . font and font size
أما البدي الثاني : فهو المطلوب لنا تقريبا
نلاحظ تحت Body الثاني نغير center وهي التي تعني الوسط , إلى اليمين وتعني right لتصبح هكذا .
أيضاا دائما ما أضيف هذا العنصر
تعريب القالب :
عادة أنا عندما أبدأ في تعريب قالب ما , أتجه إلى
كود بلغة HTML:
body {نذهب إلى التخطيط ثم إلى تحرير Html رأينا القالب أمامنا بأكواد الاتش تي ام ال , نبحث الآن عن body { ..
ملاحظة : عند البحث استخدم CTRL+F لتسهيل عملية البحث .
وجدنا في القالب 2 body { .. هذا الأول ..
كود بلغة HTML:
body {
font-family: 'Trebuchet MS', 'Bitstream Vera Sans', Verdana, Arial, 'Lucida Sans', 'Lucida Sans Unicode', Helvetica, sans-serif;
font-size: 13px;
}أما البدي الثاني : فهو المطلوب لنا تقريبا
كود بلغة HTML:
body {
min-width: 714px;
color: #000;
background-color: #a9ac99;
text-align:center;
} كود بلغة HTML:
text-align:center;
كود بلغة HTML:
text-align:right;
أيضاا دائما ما أضيف هذا العنصر
كود بلغة HTML:
direction:rtl;
ليصبح Body في المحصلة النهائية هكذا وقد غيرنا فيه ما يلزم
كود بلغة HTML:
body {
min-width: 714px;
color: #000;
background-color: #a9ac99;
text-align:right;
direction:rtl;
} 
[ ألم أقل لكم أن التعريب سهل ]بقي لنا الآن أمران فقط , يحتاجان إلى تعريب , وإلى الآن , لم نستخدم إضافة Firebug [ راجع الدرس الأول ] , فلذلك قد جاء وقتها الآن .
إليكم هذا الفيديو
http://www.youtube.com/watch_popup?v=q5wgCG6OL5Q
كما تلاحظون في مقطع الفيديو فقد استخدمنا إضافة فاير بق , ونسخنا ذلك الذي يدل على العنوان الذي في القائمة الجانبية وهو
كود بلغة HTML:
#beta h2 { كود بلغة HTML:
letter-spacing:0.3em; ثم أضفنا تحته , عنصر التنسيق من اليمين إلى اليسار وهو ذا
كود بلغة HTML:
text-align:right; بقي علينا تعريب أمر واحد فقط , وهو تعريب النص الذي تحت عناوين القائمة الجانبية , وأمره بسيط جدا ..
انظر الصورة
ننسخ هذه العبارة الموجود في الصورة ثم نضعها في مربع البحث |, مثل الفيديو السابق . . ونغير left إلى right في القالب .
وهكذا سيكون القالب معرب بالكامل في واجهته الرئيسية .. تحديث تمت إضافة الصورة
هذه النتيجة التي نريد منكم أن تصلوا إليها
- في الدرس القادم , سنغير خط القالب . وسنكمل بعض الأشياء .
- نستقبل أسئلتكم حول تعريب القالب .
منقول من هنا
ملاحظة :
لتحميل القالب الغير معرب من هنا http://btemplates.com/2008/03/09/relaxation/demo/
اذا اعجبتك هذه التدوينة فلا تنسى ان تشاركها وتساعدنا على نشر المدونة ، كما يسعدنا ان تنضم الى قائمة المشاركين في سما بلوجر من خلال
(نشرات rss)المصحف الالكتروني
0 التعليقات:
إرسال تعليق