[ 3 ] تطبيق التعريب على قالب لمدونات بلوجر - الجزء الأول


بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد النبي الأمين وعلى من سار الى هديه واستن بسنته الى يوم الدين أما بعد , السلام عليكم ورحمة الله وبركاته , كنت قد أعلنت سابقاً عن البدأ في افتتاح دروة لتعريب قوالب مدونات البلوجر , وبإذن الله اليوم سنبدأ ثالث دروسنا في دروة التعريب وسيكون عبارة عن تطبيق التعريب على قالب مدونات بلوجر , ولكي تتمكن من متابعة الدروة يتوجب عليك مشاهدة الدرس الأول من الدورة وكان بعنوان [ 1 ] شرح تنصيب الأدوات التي سنسخدمها في دروسنا مع بعض النصائح والتوجيهات .والدرس الثاني وكان تحت عنوان [ 2 ] شرح مكونات قالب مدونات البلوجر وخصائصه . , وبإذن الله اليوم سنقوم بشرح التعريب على قالب يسمى Poligon , قالب من تصميم Klodian صاحب مدونة Deluxetemplates.net والآن هذا لينك لتحميل القالب من هنـــا , ثم قم بإنشاء مدونة تجريبية نقوم بها بتجريب والتطبيق لدرس التعريب على هذه المدونة , قم برفع القالب الى المدونة التجريبية التي قمت بإنشائها سابقاً , وتابع معي الشرح
  • ادخل الى لوحة التحكم الخاصة بالمدونة التجريبية التي أنشأناها , وسنقوم بتطبيق درس التعريب عليها .
  • ادخل الى التصميم ثم تحرير html الخاص بالقالب . ثم قم بتوسيع القالب .
الآن أمامك أكواد قالبك الخاص الغير معرب , وهيا بنا لنبدأ أول خطوة في تعريب القالب ,
أولا لابد أن تعلم انا تعريب قوالب البلوجر هو تعديل في أكواد CSS فقط .

1. ابحث عن هذا الكود
<Variable name="startSide" description="Side where text starts in blog language"
             type="automatic" default="left" value="left">
   <Variable name="endSide" description="Side where text ends in blog language"
             type="automatic" default="right" value="right">
قم بتغير الكود السابق الى هذا الكود
<Variable name="startSide" description="Side where text starts in blog language"
             type="automatic" default="right" value="right">
   <Variable name="endSide" description="Side where text ends in blog language"
             type="automatic" default="left" value="left">
طبعاً لو نظرت الى الكود بالأعلى والكود الذي فوقه مباشرة , ستجدهما نفس الكود مع اختلاف الكلمات Left, Right , فكما قلت لكما سابقاً , نحن نقوم بالتعديل على أكواد ال CSS .

2. قم بالبحث عن هذا الكود
#header-inner {
ستجده على الشكل
#header-inner {
    background-position: center center;
    margin-left: auto;
    margin-right: auto;
 height: 89px;
}
#header {
    color: #FFFFFF;
    text-align: left;
}
قم باستبداله بهذا الكود
#header-inner {
    background-position: center center;
    margin-right: auto;
    margin-left: auto;
 height: 89px;
}
#header {
    color: #FFFFFF;
    text-align: right;
}

وأنت قم بملاحظة الاختلافات وما تغير , ستجدهما نفس الكود مع اختلاف الكلمات Left, Right , فكما قلت لكما سابقاً , نحن نقوم بالتعديل على أكواد ال CSS .

3. قم بالبحث عن هذا الكود
#outer-wrapper {
ستجده على هذه الهيئة
 #outer-wrapper {
    font: 110% Arial,Serif;
    margin: 0 auto;
    text-align: left;
    width: 960px;
}

قم بتغييره الى هذا الكود


#outer-wrapper {
    font: 110% Arial,Serif;
    margin: 0 auto;
    text-align: right;
    width: 960px;
}
4. قم بالبحث عن هذا الكود
#main-wrapper {
ستجده على هذه الهيئة
#main-wrapper {
    float: left;
    margin-left: 0;
    margin-top: 5px;
    overflow: hidden;
    text-shadow: 0 1px 0 #FFFFFF;
    width: 610px;
    word-wrap: break-word;
}
قم بتغييره الى هذا الكود
#main-wrapper {
    float: left;
    margin-left: 0;
    margin-top: 5px;
    overflow: hidden;
    text-shadow: 0 1px 0 #FFFFFF;
    width: 610px;
    word-wrap: break-word;
}
 وأنت قم بملاحظة الاختلافات وما تغير , ستجدهما نفس الكود مع اختلاف الكلمات Left, Right , فكما قلت لكما سابقاً , نحن نقوم بالتعديل على أكواد ال CSS .

5.  قم بالبحث عن هذا الكود
#sidebar-wrapper {
ستجده على هذه الهيئة
#sidebar-wrapper {
    background: url("http://3.bp.blogspot.com/-oPzvRPephTQ/TaxbsP2kH8I/AAAAAAAAB1s/fULKnXBxc70/s1600/content-top.png") repeat-x scroll right top transparent;
    float: right;
    margin-right: -10px;
    margin-top: -10px;
    overflow: hidden;
    text-shadow: 0 1px 0 #FFFFFF;
    width: 329px;
    word-wrap: break-word;
border: 1px solid #D0D7E2;
}
قم بتغييره الى هذا الكود
#sidebar-wrapper {
    background: url("http://3.bp.blogspot.com/-oPzvRPephTQ/TaxbsP2kH8I/AAAAAAAAB1s/fULKnXBxc70/s1600/content-top.png") repeat-x scroll right top transparent;
    float: left;
    margin-left: -10px;
    margin-top: -10px;
    overflow: hidden;
    text-shadow: 0 1px 0 #FFFFFF;
    width: 329px;
    word-wrap: break-word;
border: 1px solid #D0D7E2;
}
 وأنت قم بملاحظة الاختلافات وما تغير , ستجدهما نفس الكود مع اختلاف الكلمات Left, Right , فكما قلت لكما سابقاً , نحن نقوم بالتعديل على أكواد ال CSS .

والآن تم الانتهاء من الجزء الأول من الدرس الثالث من دورة تعريب القوالب .
انتظروا قريباً الجزء الثاني بإذن الله .

المصدر : مدونة ملتقى الدروس

59 تعليق على [ 3 ] تطبيق التعريب على قالب لمدونات بلوجر - الجزء الأول

~الامل,,مــ الله ـــع~ يقول...

بارك الله فيكم جداً واضح الشرح
قد أفادني
شاكره لكم بحجم السماء وأكثر..........(؛

{.، شيخة ع. م. يقول...

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

تحية

Ahmed Nefzaoui يقول...

أرجو زيارة مدونتي التقنية
التقنية بلغتك : هي مدونة جديدة في عالم التقنية
مصادر جديدة و مقالات جديدة
يمكنك زيارتنا على
http://artech-lang.blogspot.com/
شكرا

Bastoka يقول...

الى صاحب الموقع
لو بتحب اضيفلك قوالب بلوجر معربة جديدة
ضيفني من هنا
bastoka.egypt@yahoo.com

هاشم فوزي يقول...

الكود الرابع لم يتغير هو هو

حصاد الخير يقول...

مـــــــــــــــــا شاء الله..بارك الله فيك ورفع الله قدرك...

هذا من أحسن ما رأيته على المدونات...الله يعطيك العافيو وايهنيك...

وفقك الله لاتمام الدورة...يا رب

تدوينى يقول...

شكرا جزيلا

che3a3-tech يقول...

الموضوع جميل جدا أخي بارك الله فيك

che3a3-tech يقول...

الموضوع جميل أخي بارك الله فيك

che3a3-tech يقول...

اجمبل جدا أخي بارك الله فيك

look_my_2010 يقول...

موافق دائما فى مواضيعك ولكن اريد منك مساعدة اخى الكريم

هذه مدوانتى اريد اعدل الصفحات الثابتة التى بجوار هوم اعدلها ازاى وعايز انقصها واتمنى ليك الخير وجزالك الله خير

http://furniture7shopping.blogspot.com/

houda يقول...

شرح رائع حقا لكــــن لا أعرف هل اني لم أعرف كيفية البحث ام ماذا مع اني استخدمت التحديد Ctrml+A لكن هناك بعض الأكواد لم أجدها ؟؟
هل من طريقة اخرى رجاءً
و شكرا مرة أخرى

mbr7 يقول...

تعلم اللغة الانجليزية | learn english
http://learnnenglish.blogspot.com
شكرا لك

سلامات سلامات يقول...

السلام عليكم أحسنت الشرح لكن نسيت تحويل الخط من اليمين لليسار ؟؟؟

غير معرف يقول...

اخى الكريم هذة اول زيارة لى لموقعك الكريم و اشكرك على جهدك و لكن لى ملحوظة صغيرة اتمنى ان تقبلها
بالنسبة للاكواد التى تقوم بعرضها فانها تظهر ناحية اليسار و لكن الفاصلة المنقوطة تظهر فى اليمين مما يربك المتعلم لذلك من فضلك قم باضافة اللامر التالى الى كود css المسؤل عن تنسيق الكود
direction: rtl;
و قم باضافة الامر التالى الى نموذج ادخال التعليق
direction: rtl;
text-align:right;
تقبل تحياتى
جاسر

Dantteck يقول...

جميل جداً .. بالتوفيق لكم ،،

،،

نتمنى المزيد ،،

راما يقول...

فعلا مدونه ممتازه

Admin يقول...

أخي الكريم جزاك الله ألف خير على هذه المدونة الرائعة

لي ملاحظة بخصوص إعلانات أدسنس فقد ظهر موقع مسيحي في الإعلان الذي يوجد أعلى المواضيع ،، أتمنى أن تقوم بفلترة الإعلانات مستعينا بهذا الموقع http://adsense-list.com

جزاك الله ألف خير

test يقول...

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

habib يقول...

chokran laka a5iii

Boutahar يقول...

thx friend i think this articleis very helpful
http://full-windows8.blogspot.com/

صفا يقول...

لكم جزيل الشكر
ايه المدونه اللذيذه دي

aLi Djawhara يقول...

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

كروكيه يقول...

شكرا جزيلا أخي

توب موفيز يقول...

راااااااائع

أخبار اليوم يقول...

تسلم ايديك

الحبيب يقول...

merci

الربح من الانترنت يقول...

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

حواء يقول...

ممتاز

عروض الأزياء يقول...

راااائع

أكلات رجيم يقول...

تسلم ياباشا

البشرة والشعر يقول...

مدونة جميلة

حواء يقول...

موضوع رائع

أكلات رجيم يقول...

thanx

Dev Nasser يقول...

موضوع جيد
يا ريت لو نرى مستوى اكثر تقدما في هذا المجال فالقوالب التي يتم تعريبها قديمة في الغالب بينما يواجه الشباب مشاكل في تعريب الجديدة منها ... مع انني شخصيا لا اؤيد هذه المسالة من اولها فالاحسن لو تكن هناك برمجة من اولها للقالب وليس تعريب لقوالب موجودة
لكن الموضوع يبقى جيدا
على فكرة ... مدونتك متناسقة وجية جدا ما عدا ملاحظة بسيطة عن شكل الاعلان على اليسار ^^!
اجمل تحياتي

ماتش كورة يقول...

شرح جميل
http://www.matchkora.com/

وظائف خالية يقول...

تسلم

وظائف خالية يقول...

مشكووووووووووووررررر

Sure يقول...

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

اسرار السيو يقول...

thanx

غير معرف يقول...

موضوع رائع جداً ومفيد , شكراً لك عزيزي ..

اتمني ان يعجبكم هذا الموقع لمشاهدة افلام اونلاين :-
مشاهدة افلام اونلاين

قوالب بلوجر عربية ومجانية يقول...

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

الربح من الانترنت يقول...

مشكووووووووووور .. موضوع ممتاز

وظائف خالية يقول...

شكرا على الشرح الممتاز

اخبار اليوم يقول...

تسلم ايديك على الموضوع
اخبار اليوم-اخبار مصر

الربح من الانترنت يقول...

تسلم ايديك على الموضوع
الربح من الانترنت-وظائف خالية

التسويق الالكتروني يقول...

تسلم ياغالى على الموضوع والمدونة الرائعة

Übersiedlung يقول...

شكراااااً كتير ع المجهود :)

Aziz يقول...

شكرا على الشرح
أتمنى زيارة مدونتي المتخصصة بالربح من الأنترنت
http://dzarab.blogspot.com

Entrümpelung wien يقول...

Dank den Themen .... Ich hoffe, mehr von den Themen

معهد خبراء بلوجر يقول...

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

قوالب بلوجر
تعريب قوالب بلوجر
إضافات بلوجر
دروس بلوجر

entrümpelung wien يقول...

Vielen Dank ... Wo neue Themen?

لعبة زوما يقول...

مجهوود رائع وشرح سهل شكراا

Entrümpelung wien يقول...

شكرا على الموضوع ..))

Ell top يقول...

شكرا على الموضوع
BookMark
BookMark
BookMark
BookMark

ahmed MOLY يقول...

شكرا اخى على الشرح الواضح ..
http://learn-price-action.blogspot.com

محمد سلامه يقول...

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

أولا / لقد ركبت قالبك الممتاز لمدونتي ولكن كيف اعرف أن روابط الصور لا تنتهي بع ذلك ، ( يعني كيف أحتفظ بتصميم الرائع هذا على الدوام ؟ ) حيث اني أريد الثبات عليه لنه بسيط ومنسق ويحقق غايتي من التدوين ..

ثانيا / وهذا شيء مهم جدا جدا لي ، لأن هناك أشياء لم تعد مفعله طبعا في لوحة بلوجر من الداخل نتيجة إضافتي لقالبك هذا ، لكن لا يهم ، ( تغور بلوجر ) فقالبك ممتاز ، لكن لي شيء لا أستطيع الإستغناء عنه ، وهو اني اعدل صورة الهيدر ، كل فترة وأخرى وخيار حذف عنوان المدونة ووصفها لم يعد مفعلا ، كما أن طريقة حذف عنوان المدونة ووصفها من الهيدر بطريقة html لم تعد معروفه لدي طبعا لأن قالبك مختلف .. فهل تدلني على كود html لإخفاء ، (إخفاء فقط من الهيدر وليس حذف ) عنوان ووصف المدونة حتى اكون حرا في إضافة واجهة لمدونتي بين الحين والآخر ..

أنتظر ردك أخي وادعوا لك وأشكرك شكرا جزيلا على مجهودك الذي ساعدني كثيرا ً .. مدونتي .
http://mohamed-salama.blogspot.com/

karthik sekar يقول...

Free Blogger Templates Daily Updates Free Blogger Template and template blogspot. Blogger template 1, 2, 3, 4 column, seo blogger template, magazine style blogger template and daily updates free blogspot template on bigmasstemplate.blogspot.in

chahine DZ يقول...

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

إرسال تعليق

Older Posts Home
Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
سياسة الخصوصية | التعليقات المنشورة لا تعبر عن رأي كاتب مدونة " قوالب بلوجر معربة " ولا أتحمل أي مسؤولية قانونية حيال ذلك ( ويتحمل كاتبها مسؤولية النشر )