صفحة 1 من 2 12 الأخيرةالأخيرة
النتائج 1 إلى 15 من 25

الموضوع: شرح طريقة تعريب قوالب ووردبريس

  1. #1
    عضو فعال
    تاريخ التسجيل
    Sep 2006
    المشاركات
    1,310

    شرح طريقة تعريب قوالب ووردبريس





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

    نظراً للطلبات المتزايدة بتعريب قوالب معينّة ولأنه لا يمكن
    الإستجابة لكل طلب تعريب أقدّم لكم هذا الشرح المفيد
    والذي يعطي فكرة أوليّة مهمة عن تعريب القوالب.

    يمكن تكون هناك نقاط لم أذكرها بشكل دقيق او نقاط
    نسيتها وكل أخ او أخت يستطيع أن يحسّن هذا الموضوع
    مدعو للكتابة او لمراسلتي لتعديل الموضوع حتى تكون
    الفائدة من هذا الشرح كبيرة قدر الامكان.

    خطوات أولية عليك إعدادها قبل بدء التعريب:

    1.
    إختيار قالب معيّن للتعريب.
    هنالك قوالب انجليزية كثيرة على هذا الرابط:
    http://themes.wordpress.net/
    كبداية مفضل ان تختار قالب بسيط حتى نتعلم ونتقن الشيئ.
    مثلا هذا قالب بسيط:
    http://www.dakars.info/go.php?http:/...65/flowery-20/

    2.
    تركيب سيرفر محلي على الجهاز.
    حتى نفحص التغييرات على الجهاز بدلا من فحصها على الشبكة ,
    وهذا يضمن سهولة وسرعة في العمل.
    هذا الموضوع يفيد بالنسبة لتركيب سيرفر محلي:
    http://www.ar-wp.com/showthread.php?...D3%ED%D1%DD%D1

    3.
    برنامج لمعالجة ملفات المدونة يعمل بترميز utf-8
    شخصياً أستعمل برنامج notepad ++
    موجود هنا: http://www.ar-wp.com/showthread.php?...hlight=notepad

    4.
    بعد ان قمنا بتركيب السيرفر المحلي وركبنا المدونة عليه واخترنا القالب نبدأ بالعمل.

    بداخل مجلد القالب الذي اخترناه توجد ملفات php و css وصور. كلها مسؤولة
    عن الشكل الخارجي للقالب.

    ______________________________________

    بالنسبة لملفات ال php علينا تغيير الكلمات الانجليزية الى العربية وتغيير تركيبة اليوم والتاريخ.
    نفتح الملفات بواسطة برنامج nptepad ++ ونغير الترميز
    الى utf-8 (من FORMAT) ونبدأ بالترجمة.
    نحن لا نغيّر كل الكلمات الانجليزية للعربية.
    فقط الكلمات التي تظهر بالمدونة.
    مثلاً:

    كود:
    <h2 class="posttitle" align="right"><?php _e('Not Found'); ?></h2>
    		<p align="right"><?php _e('Sorry, but no posts matched your criteria.'); ?></p>
    		<?php include (TEMPLATEPATH . '/searchform.php'); ?>
    بعد التعريب:

    كود:
    <h2 class="posttitle" align="right"><?php _e('Not Found'); ?></h2>
    		<p align="right"><?php _e('عذراً , لم يتم العثور على نتائج مناسبة'); ?></p>
    		<?php include (TEMPLATEPATH . '/searchform.php'); ?>
    هنالك كلمات انجليزية ممنوعون من تغييرها للعربية
    وهي كلمات او اوامر مسؤولة عن برمجة القالب.

    عندما تستعمل برنامج notepad++ فهو يظهر لك الكلمات
    القابلة للتعريب حيث يكون لونها رمادي فاتح وتكون بين فواصل علوية مثل هذه ' او هذه ".

    كود:
    			<div class="postentry">
    				<?php the_content(__('Read the rest of this entry &raquo;')); ?>
    				<?php wp_link_pages(); ?>
    			</div>
    في ملفات ال PHP علينا أيضاَ تغيير تركيبة التاريخ. بالانجليزية يكون على هذا النمط:

    كود:
    ('F jS, Y')
    حتى يلائم العربية نغيره الى:

    كود:
    ’j F, Y‘
    ______________________________________

    بعد ان انتهينا من تعديل ملفات PHP ننتقل الى ملف الستايل: STYLE.CSS
    هذا الملف مهم جدا وهو عمليا مسؤول عن الشكل الخارجي للمدونة من ناحية الاتجاهات (يمين شمال).
    اذا اردت ان تتعمق بال CSS هنالك كتاب عربي يشرح لك ذالك خطوة خطوة تجده هنا:
    http://www.ar-wp.com/showthread.php?...t=%DF%CA%C7%C8

    طبعا لازم تكون عندك خلفية معينة عن ال CSS ولو كانت بسيطة.

    العمل على هذا الملف يكون أسهل وعملي أكثر من الترجمة.

    1.

    لتغيير اتجاه الصفحة من اليسار لليمين نتوجه الى قسم ال body في
    ملف الستايل ونضيف اليه direction: rtl; كالتالي:

    كود:
    body {
    	margin: 0;
    	padding: 0;
    	background: #4E5706 url(images/bg.gif);
    	color: #000;
    	font-size: x-small;
    	font-family: "Lucida Sans Unicode", Tahoma, Arial, sans-serif;
    	text-align: center;
    	voice-family: "\"}\""; 
    	voice-family: inherit;
    	font-size: small;
    	direction: rtl;
    }
    2.

    الان نصل الى تغيير الاتجاهات يمين يسار في تصميم القالب
    مثل العناوين القوائم وما الى ذالك ...

    نبحث عن الكلمات left او right ونغيرها حسب الحاجة.

    مثلا:

    كود:
    }
    #header {
    	margin: 0 auto;
    	width: 765px;
    	height: 85px;
    	background: url(images/header.gif) no-repeat;
    	text-align: left;
    	overflow: hidden;
    }
    نشاهد باللون الأحمر أنّ الانحياز او اتجاه الخط هو لليسار.
    اليسار يلائم اللغة الانجليزية ونحن نحتاج العربية.
    لذالك نغيّر left الى right.

    من المهم ذكره انه توجد كلمات left أو right يمنع تغييرها بتاتا
    لانها لا تكون ضمن المتغيرات التي يمكن ان نعدل عليها.

    مثلا هنا لا نغير كلمة RIGHT بالمرة:

    كود:
    #wp-calendar caption {
    	margin: 1.2em 0 0 0;
    	padding: 0.4em 0;
    	border-top: 1px solid #000;
    	border-right: 1px solid #000;
    	border-left: 1px solid #000;
    	background: url(images/sidebarheader.gif) no-repeat 50% -2px;
    	color: #212503;;
    	font-weight: bold;
    }
    والسبب هو ان كلمة right تشير الى
    جزء معين من القالب (اسم) وليست ضمن
    المتغيرات.

    3.
    بالنسبة لل margin, border,padding (في كتاب شرح ال css الذي ذكرته بالبداية يوجد شرح
    لهذه المتغيرات) فهذه المتغيرات الثلاث ممكن ان تلبس أكثر من صورة.
    ما يهمنا هو الصورة التي يظهر بها 4 ارقام حيث نبدّل الرقم الثاني
    مع الرقم الرابع.

    مثال قبل التغيير:

    كود:
    #content {
    	float: right;
    	padding: 0 38px 0 23px;
    	width: 538px;
    	background: url(images/content.gif) no-repeat 100% 0;
    	voice-family: "\"}\""; 
    	voice-family: inherit;
    	width: 477px;
    }
    وبعد التغيير:

    كود:
    #content {
    	float: right;
    	padding: 0 23px 0 38px;
    	width: 538px;
    	background: url(images/content.gif) no-repeat 100% 0;
    	voice-family: "\"}\""; 
    	voice-family: inherit;
    	width: 477px;
    }
    هذه الأرقام الاربعة تصف المتغيرات بالنسبة لفوق يمين تحت يسار حسب الترتيب.
    ما يهمنا هو يمين يسار ولذالك غيرنا الثاني والرابع فقط.

    4.

    في القالب محتمل تكون قوائم على شكل صورة.
    بشكل عام تغيير الاتجاه من اليسار لليمين يحل المشكلة.
    لكن احيانا المشكلة تبقى ويمكن حلها بواسطة:

    قبل التغيير -

    كود:
    background: url(images/bullet.gif) no-repeat;
    لتغيير اتجاهها -

    كود:
    background: url(images/bullet.gif) right no-repeat;
    5.

    الخطوط - نبحث عن font-family وعن font-size لتغيير
    نوع الخط وحجمه.

    بهذا نكون قد انتهينا من ملف الستايل.

    ______________________________________

    الان نقوم بتغيير اتجاه الصور من مجلد ال Images.
    يعني نعمل للصورة flip افقي بواسطة برنامج لمعالجة الصور.
    مثال على قبل وبعد:
    http://www.rasheed-b.com/wp_files3/flip.jpg





    __________________
    مدونة رشيد
    عرب ووردبريس
    فوتوكينز للتصوير الرقمي
    سبحان الله, الحمد لله, لا اله إلا الله, الله أكبر
    لا تستوحش قلة السالكين ولا يغرنّك كثرة الهالكين


  2. #2
    عضو نشيط
    تاريخ التسجيل
    Sep 2006
    المشاركات
    258


    شكرا رشيد . هدا شرح رائع و يستحق التثبيت في قسم القوالب





    __________________
    Zhra.Net

  3. #3


    بارك الله عملك وجهدك ..
    وأحسن اليك ..
    وشكراً الف ...
    _________
    تحياتي ..





    __________________
    www.qmah.com
    شبكة قمة المتخصصة لخدمة المصمم العربي
    قمة بمعنى الكلمة ....
    qmah @ qmah.com

  4. #4
    عضو فعال
    تاريخ التسجيل
    Sep 2006
    المشاركات
    1,310


    Zhra
    الباسل ,

    جزاكم الله خير





    __________________
    مدونة رشيد
    عرب ووردبريس
    فوتوكينز للتصوير الرقمي
    سبحان الله, الحمد لله, لا اله إلا الله, الله أكبر
    لا تستوحش قلة السالكين ولا يغرنّك كثرة الهالكين

  5. #5
    مشرف قسم اسماء النطاقات
    تاريخ التسجيل
    May 2004
    المشاركات
    2,791


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





    __________________
    تبي تقنص نطاق؟ شراء نطاق من سيدو؟ حجز أو تجديد؟ نقل نطاق بين شركتين؟ استشاره أو نصيحه؟
    خدمات النطاقات بشكل عام.. راسلني و ابشر!

    لمراسلتي

  6. #6
    عضو فعال
    تاريخ التسجيل
    Sep 2006
    المشاركات
    1,310


    اخي DOMAIN : بارك الله فيك





    __________________
    مدونة رشيد
    عرب ووردبريس
    فوتوكينز للتصوير الرقمي
    سبحان الله, الحمد لله, لا اله إلا الله, الله أكبر
    لا تستوحش قلة السالكين ولا يغرنّك كثرة الهالكين

  7. #7
    عضو نشيط
    تاريخ التسجيل
    Oct 2003
    المشاركات
    154


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

    اخوي رشيد

    بارك الله فيك وجزاك الله خيراً

    وتسلم اخوي على هذا الشرح الجميل ونتظر في جديدك

    في امان الله





    __________________
    سبحان الله وبحمده سبحان الله العظيم

  8. #8
    عضو فعال
    تاريخ التسجيل
    Sep 2006
    المشاركات
    1,310


    رياض: حياك الله اخوي





    __________________
    مدونة رشيد
    عرب ووردبريس
    فوتوكينز للتصوير الرقمي
    سبحان الله, الحمد لله, لا اله إلا الله, الله أكبر
    لا تستوحش قلة السالكين ولا يغرنّك كثرة الهالكين

  9. #9
    عضو فعال
    تاريخ التسجيل
    Aug 2004
    المشاركات
    1,327


    فعلا شكر على الشرح بارك الله فيك





    __________________
    اقم صلاتك قبل مماتك اقم صلاتك تنعم بحياتك
    صلى قبل ان يصلى عليك - لا حول ولا قوه الا بالله
    فزلكة وحداقه | خدمات الشبكات والانترنت | طريق الاستضافه

  10. #10
    عضو فعال
    تاريخ التسجيل
    Sep 2006
    المشاركات
    1,310


    hunter_rare : العفو ..





    __________________
    مدونة رشيد
    عرب ووردبريس
    فوتوكينز للتصوير الرقمي
    سبحان الله, الحمد لله, لا اله إلا الله, الله أكبر
    لا تستوحش قلة السالكين ولا يغرنّك كثرة الهالكين

  11. #11


    جزاك الله خيرا
    بالفعل موضوع يسهل علينا الكثير من الأمور
    تحياتي







  12. #12
    عضو فعال
    تاريخ التسجيل
    Sep 2006
    المشاركات
    1,310


    ابو جهاد: تسلم ...





    __________________
    مدونة رشيد
    عرب ووردبريس
    فوتوكينز للتصوير الرقمي
    سبحان الله, الحمد لله, لا اله إلا الله, الله أكبر
    لا تستوحش قلة السالكين ولا يغرنّك كثرة الهالكين

  13. #13
    عضو نشيط
    تاريخ التسجيل
    Sep 2006
    المشاركات
    154


    بارك الله فيك ورفع قدرك يا رشيـد
    جهد رائع , تقوم به انت من خلال تطوير المدونات وما يلزمها


    استمر ولك من الجميع الدُعاء بإذن الله عز و جل






  14. #14


    تسلم يا رشيد





    __________________
    كنت هنا ..

  15. #15
    عضو سوبر نشيط
    تاريخ التسجيل
    Apr 2004
    المشاركات
    832


    جزاك الله خيراً اخي رشيد

    وبالتوفيق للجميع ان شاء الله





    __________________
    فريق التطوير استضافة مواقع، تأجير وإدارة السيرفرات وحجز الدومينات وشهادات SSL
    Egypt Museum - موقع متحف مصر، مدونة أجنبية تهتم بعلم المصريات والآثار المصرية بالإضافة إلى صور عن الحضارة المصرية القديمة.

صفحة 1 من 2 12 الأخيرةالأخيرة




ضوابط المشاركة

  • لا تستطيع إضافة مواضيع جديدة
  • لا تستطيع الرد على المواضيع
  • لا تستطيع إرفاق ملفات
  • لا تستطيع تعديل مشاركاتك
  •  
0
أضف موقعك هنا