مـدونــة مـدينـة الاحـلام: 2012

الاثنين، 19 مارس 2012

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

بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد النبي الأمين وعلى من سار الى هديه واستن بسنته الى يوم الدين أما بعد , السلام عليكم ورحمة الله وبركاته , كنت قد أعلنت سابقاً عن البدأ في افتتاح دروة لتعريب قوالب مدونات البلوجر , وبإذن الله اليوم سنبدأ ثالث دروسنا في دروة التعريب وسيكون عبارة عن تطبيق التعريب على قالب مدونات بلوجر , ولكي تتمكن من متابعة الدروة يتوجب عليك مشاهدة الدرس الأول من الدورة وكان بعنوان [ 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;
}

5. قم بالبحث عن هذا الكود

#sidebar-wrapper {

ستجده على هذه الهيئة

#sidebar-wrapper {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIU0WkhyphenhyphenwOCk7zz_5VUzgpYPlzZFzBH_cuaPiGrXPpacFp5kn6GPKZtVimLU1WJQjDTSrpBGaScm6xCu_5u96n5MyICP8LLGLfNzsasYMgPZSLYUskWc_rzAJw0UY_ifrMlxM3cx4C_HI/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("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIU0WkhyphenhyphenwOCk7zz_5VUzgpYPlzZFzBH_cuaPiGrXPpacFp5kn6GPKZtVimLU1WJQjDTSrpBGaScm6xCu_5u96n5MyICP8LLGLfNzsasYMgPZSLYUskWc_rzAJw0UY_ifrMlxM3cx4C_HI/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 .

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

الأربعاء، 14 مارس 2012

My secret is that I have fallen in love with you

Dear My Love

I want to tell you something I have never told you before. It is a little secret
that I have been keeping. I think I have known you long enough to finally tell
you this secret, but I am still a little afraid of what you might think. This is
a pretty big secret, and you would be the first person I have ever broken its
secrecy with. I am so nervous, that I am unable to tell you in person. I am
forced to open up this secret with paper and pen and hope that you will take its
importance to heart.

This secret is very special to me. And the only reason I am entrusting it to you
is because our relationship is becoming very important to me and I think it is
only fair for you to know. It is something that you should know and need to
know, otherwise our relationship would be at a standstill. I only hope you will
understand as soon as I reveal to you this mystery.

I am sure you will understand why I am so nervous. It is not a terrible secret
nor some heinous skeleton in the closet. I have done nothing wrong in my life
and I am not trying to keep anything from you. Actually, this secret only
developed quite recently and I have been reluctant to accept it. But now I know
that it is real and it is here to stay. And all I can do is to hope that you
will be happy when I tell you. Be gentle, for my whole heart is on the line.

My secret is that I have fallen in love with you.

All My Love

{ Said Elassal }