0 كيفية اضافة خاصية " اتصل بنا " للمدونة

السلام عليكم 

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

اولا يجب علينا الدخول لهذا الموقع : http://www.foxyform.com/
ثم نختار كما هو موضح : عنوان الرسالة ، الاسم ، الاميل ، المحتوى، موقعك 

اختيار الوان الخاصية ونوع وحجم الخط ....

البريد الالكتروني الخاص بك التي تود ان تصلك الرسائل اليه 

ثم نضغط على :







ثم يظهر كود نقوم بنسخه 

ثم نذهب الى لوحة تحكم في المدونة ثم الصفحات وننشا صفحة جديدة (صفحة فارغة )
نختار html ثم نلصق الكود في المشاركة ، ونضع عنوان للصفحة باسم اتصل بنا 
ومبروك عليك 
ان اعجبك الموضوع ضع اعجاب او مشاركة 

تابع القراءة

0 كيفية تغيير قالب المدونة وتنزيل نسخة احتياطية منه

السلام عليكم

درسنا لهذا اليوم هو كيفية تنزيل نسخة احتياطية للقالب (مهم عند اجراء تعديل لصفحة html )، وكيفية  تغيير قالب جديد للمدونة 

اولا نذهب من لوحة التحكم نختار قالب 

تظهر لنا هذه اللافتة الموضحة في الصورة :

تحرير html : وهي صفحة html الخاصة بالمدونة 

تخصيص : وهو التغيير اليدوي للقالب من الوان وقياسات

نسخ احتياطي/استعادة : وهو الذي يهمنا في هذا الدرس  ، نضغط عليها وستظهر لافتة اخرى 

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

ولذلك عند الخطا نستطيع الرجوع الى القالب الاول 

الزر الثاني وهو تغيير القالب نضغط عليه ثم نحدد مكان القالب المراد وضعه

 ثم نضغط على تحميل ومبروك عليك القالب الجديد 

الى هنا ينتهي درسنا لهذا اليوم 

تابع القراءة

0 كيفية فتح مدونة وانشاء مشاركة جديدة

السلام عليكم

درسنا لهذا اليوم هو كيفية فتح مدونة بلوجر 

اولا يجب ان يكون لدينا حساب gmail  ولمعرفة كيفية التجسجيل من هنا 

وعند التسجيل في gmail ندخل لهذا الموقع https://www.blogger.com/start

وندخل اليه بحساب gmail

ثم تظهر لنا لافتة نملأها كما هو موضح 

الفراغ الاول يمثل عنوان المدونة

الفراغ الثاني لرابط المدونة 

ثم نختار القالب 

ونضغط على create blog

ومبروووك عليك 

هذه هي نافذة لوحة التحكم والشرح في الصورة 

هنا لكتابة موضوع نضغط على انشاء مشاركة جديدة 

ثم يظهر لنا هكذا :

1- قوائم التحكم في النص

2- التسميات : مثلا هذا الموضوع ندرجه فيي مجال انترن ، برامج ، دروس ، ....الخ 

3-تحديد تاريخ العرض

4-الرابط : وهو مهم جدااااا نضغط عليه ونكتب الكلمات الدلالية مثلا انا اكتب موضوع في html اذهب الى الرابط ثم اختار الخيار الثاني واكتب الكلمات الدلالية التي تدخل ضمن الموضوع مثلا html-site-web- وهكذا حتى يدخل الموضوع في محرك قوقل 

وهذه الكلمات تساعدك لنشر مواضيعك بسهولة 

5-المكان واضح

6- اتركها كما هي

7-اذا اردت كتابة الموضوع عادي بالصورة والكتابة العادية

8-كتابة موضوع بالـ html 

9-لحفظ الموضوع

10-معاينة الموضوع

11-انهاء او اغلاق

12-نشر الموضوع عند الانتهاء 

__________

الى هنا ننهي درسنا لهذا اليوم 

تابع القراءة

0 كيفية كتابة فقرة وتخطي السطر

السلام عليكم 

نتطرق اليوم الى درس حول كيفية كتابة فقرة ، وكيفية تخطي السطر (الرجوع الى سطر جديد )

1-كتابة فقرة :

وسم كتابة فقرة او نص هو <p> ويغلق بـ </p> اي اننا عندما نكمل الفقرة نضع هذا الوسم في اخرها

هذا هو الكود :

1 2	<p> اخواني متابعي مدونة لنرتقي، نتطرق اليوم الى درس حول كيفية كتابة فقرة، وكيفية تخطي السطر </p>

<p> وسم لبداية الفقرة 
</p> وسم الغلق اي اننا انهينا كتابة الفقرة 
ثم نحفظ العمل وتكون النتيجة عادية 

2- تخطي السطر او الرجوع الى سطر جديد 

لا شك اننا رايك في كل برامج التحرير ان الضغط على Entrée يسمح لنا بالرجوع الى سطر جديد 
لكن في لغة html ليس هكذا بل نحن من نقود الفقرة ونوجها بدون الضغط على Entrée  
سنلاحظ ذلك :
علمنا سابقا كتابة الفقرة او المحتوى الذي يظهر في الصورة يكون بين الوسمين <body> و </body> 
هنا ضغطت على Entrée  

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

<html> <head> <title> عنوان الصفحة </title> </head> <body> <p> اخواني متابعي مدونة لنرتقي، نتطرق اليوم الى درس حول كيفية كتابة فقرة،وكيفية تخطي السطر </p> </body> </html>

 لاحظ النتيجة هنا ان السطورمتتابعة وليس هنالك تخطي رغم اننا نشاهد ذلك في المحرر :

اضغط على الصورة لرؤيتها بحجم طبيعي

ولحل هذا المشكل علينا بوضع وسم تخطي السطر وهو </br>
نلاحظ انه به علامة / اي انه وسم وحيد بدون الوسم الاول ، ويكتب بعد السطر الذي نريد تخطيه مباشرة 
والمثال يوضح ذلك :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

<html> <head> <title> عنوان الصفحة </title> </head> <body> <p> اخواني متابعي مدونة لنرتقي، نتطرق اليوم الى درس حول كيفية كتابة فقرة، </br>  وكيفية تخطي السطر </p> </body> </html>

والنتيجة كما تلاحظون :

اضغط على الصورة لرؤيتها بحجم طبيعي

تلخيص :
لكتابة فقرة يجب وضعها بين الوسمين <p> و </p> 
لتخطي سطر او الرجوع الى سطر جديد نضع الوسم </br> في اخر السطر المراد تخيطه

الى هنا اودعكم اخواني
ان اعجبك الموضوع ضع اعجاب او مشاركة 
الى درس اخر ان شاء الله

تابع القراءة

0 كيفية عمل قائمة

السلام عليكم 

درسنا لهذا اليوم هو كيفية عمل قائمة 

قبل ذلك ننوه انه هناك نوعين من القوائم 

-قائمة غير مرتبة • ،• .....

-قائمة مرتبة 1 ، 2 ، 3 .....

1- القائمة غير المرتبة :

الوسم هو <ul> ويتم غلقه بـ </ul> 

ونقوم بوضع العناصر التي نريدها على شكل قائمة بين الوسم <li> ونغلقه بـ </li>

مثل هذا الكود : 

1 2 3 4 5 6

<ul>         <li>برامج </li>         <li> انترنت </li>         <li> العاب </li> </ul>

والنتيجة كما ترون 

نستخلص اذا انه مابين <ul> و</ul>  هي القائمة كاملة 

اما مابين <li> و</li>  هو تحديد عناصر القائمة 

2- القائمة المرتبة :

الوسم الخاص بها هو <ol> ونغلقه بـ </ol> 

ونقوم بوضع العناصر التي نريدها على شكل قائمة بين الوسم <li> ونغلقه بـ </li>

مثل القائمة السابقة فقط تغيير الوسم الاول فقط 

والكود هو : 

1 2 3 4 5 6

<ol>         <li>برامج </li>         <li> انترنت </li>         <li> العاب </li> </ol>

والنتيجة كما ترونها :

نستخلص اذا انه مابين <ol> و</ol>  هي القائمة كاملة 

اما مابين <li> و</li>  هو تحديد عناصر القائمة 

اتمنى ان يكون الموضوع في مستوى الشرح 

ان اعجبك لا تبخل باعجاب ومشاركة 

الى درس اخر بحول الله 

تابع القراءة

0 كيفية تغيير نوع وحجم ولون الخط

السلام عليكم 

درسنا لهذا اليوم هو كيفية تغيير نوع الخط ، وحجمه ولونه :

حيث يفيدنا في كتابة النصوص داخل الصفحة 

نبدا اولا بالوسم وهو font 

1- استعمال الوسم في تغيير نوع الخط :

ووسم نوع الخط هو face اي نكتب font face

نكتب الكود هكذا :

1 2 3

<font face ="arial">مدونة لنرتقي </font> <font face ="Andalus">مدونة لنرتقي </font> <font face ="tahoma">مدونة لنرتقي </font>

ونلاحظ في الكود انه يتكون من :

font وهو وسم الخط 

face وهو وسم تحديد نوعا الخط 

arial ,tahoma ... هي انواع الخطوط 

حيث نكتب 

<font face ="tahoma">

بعدها نكتب النص 

ثم نغلق الوسم </font>

نضع الكود السابق كمثال :

والنتيجة :

ملاحظة : لايمكن ان نضع خط لا يوجد في الجهاز ولو وضعنا هذا سيقوم الجهاز بوضع الخط الافتراضي اوتوماتيكيا 

كما يمكننا ان نضع عدة انواع من الخطوط في ترتيب 

هكذا مثلا :

1	<font face ="Arial, tahoma, andalus">مدونة لنرتقي </font>

وهنا اخترنا arial هو الاول فاذنا لم بكن هذا الخط عند الشخص الذي يشاهد الصفحة اوتوماتيكيا يتحول الى نوعا الخط الموالي وهكذا ..

2- استعمال الوسم في تغيير حجم الخط :

وسم حجم الخط هو size اي نكتب font size 

نكتب الكود هكذا حيث ان يكون من 1 الى 7 لمراعاة الحجم الافتراضي للمتصفح 

1 2 3 4 5 6 7 8

<font size="1">مدونة لنرتقي </font> <font size="2">مدونة لنرتقي </font> <font size="3">مدونة لنرتقي </font> <font size="4">مدونة لنرتقي </font> <font size="5">مدونة لنرتقي </font> <font size="6">مدونة لنرتقي </font> <font size="7">مدونة لنرتقي </font>

والنتيجة 

3- استعمال الوسم في تغيير لون الخط :

وسم اللون هو color اي نكتب font color

1 2 3

<font color="red">مدونة لنرتقي </font> <font color="green">مدونة لنرتقي </font>

ويمكن كتابة كود اللون كالذي نراه في برامج التصميم مثلا لون برتقالي رمزه هكذاf5b509 #

فنكتب الكود هكذا :

1 2	<font color="#f5b509">مدونة لنرتقي </font>

وهذه النتيجة باللون الاحمر 

____________________________

والان نقوم بجمع نوع وحجم ولون الخط معا :

هذا هو الكود

1 2	<font face="arail" color="green" size="7" >مدونة لنرتقي </font>

والنتيجة :

تم بحمد الله

اذا اعجبك الموضوع لاتبخل باعجاب 

الى هنا اودعكم الى درس اخر ان شاء الله

تابع القراءة

0 كيفية تغيير اتجاه الصفحة

السلام عليكم

درسنا لهذا اليوم هو تحديد اتجاه الصفحة من اليمين الى اليسار او العكس ولعمل ذلك 

لاننا مثلا في اللغة العربية نكتب من اليمسن الى اليسار والعكس لابنسبة للنجليزية او الفرنسية ...الخ

نبدا بشفرة :

 من اليمين الى اليسار وتسمى rtl اي right to left 

ونكتبها مع وسم html لانه يمثل بداية الصفحة 

1	<html dir="rtl">

   ولو اردنا ان نكتبها من اليسار الى اليسار نغيرها بـ ltr اي left to right 

1	<html dir="ltr">

  وهذا هو الكود الكامل من اليمين الى  اليسار:

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<html dir="rtl"> <head> <title> مدونة لنرتقي </title> </head> <body> مرحبا بكم في مدونة لنرتقي </body> </html>

وهذا الكود من اليسر الى اليمين :

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<html dir="ltr"> <head> <title> مدونة لنرتقي </title> </head> <body> مرحبا بكم في مدونة لنرتقي </body> </html>

جرب وسترى بنفسك ^^

الى هنا نختم موضوعنا لهذا اليوم والى موضوع اخر باذن الله

تابع القراءة

0 حل مشكل اللغة العربية في برنامج النوتباد Notepad++

السلام عليكم

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

نشاهد صورة المشكل 

بعد ان نكتب عنوان او محتوى الصفحة بالعربية تظهر لنا هذه الرموز :

اضغط على الصورة  لرؤيتها بحجمها الطبيعي

ولحل المشكل :

1- نذهب الى القائمة الافقية للبرنامج ونختار Encodage

ثم نغير الخيار الثاني بالخيار الثالث ونختار Encoder en UTF-8 

كما في الصورة :

اضغط على الصورة لرؤيتها بحجمها الطبيعي

والنتيجة : تم حل المشكل بحمد الله

اضغط على الصورة لرؤيتها بحجمها الطبيعي

وهنا نختم الموضوع واياكم الى درس اخر بحول الله

تابع القراءة

0 كيفية كتابة بعض الاكواد الاساسية ومعرفة مهامها (الدرس 4)

السلام عليكم 

في هذا الدرس اخواني 

نتطرق الى كيفية كتابة بعض الاكواد الاساسية ومعرفة مهامها  .

اولا ننبه ان جميع في html تبدا باسم وتنتهي بنفس الاسم لكن تزيد على الاسم الاول بعلامة / ( اي عند وجود علامة / تعرفنا ان عمل هذا الوسم انتهى ) ، وهي محصورة بين مزدوجتين <> وسنرى ذلك في الدرس .
ولبدا العمل نفتح برنامج النوتباد  Notepad++ولتحميله من هنا 

ولتعلم اللغة بشكل اسرع قم انت بكتاتبة الاوسام ودعك من النقل واللصق ^^ 

1-  الوسم html 

1 2 3

<html>   </html>

وهو وسم اساسي يجمع كل محتوى الصفحة اي كل ما يوجد في الصفحة هو مابين الوسم الاول <html> و الوسم الاخير </html>

اذن اي صفحة نبداها يجب ان تبدا بالوسم <html> وتنتهي بالوسم </html> 

2- الوسم head

1 2 3 4 5

<html> <head>   </head> </html>

 ياتي وراء وسم <html> مباشرة وهو راس الصفحة و غير مرئي  ،وظيفته هو تقديم بعض المعلومات الدلالية للصفحة ووصفها لتساعد على البحث عنها في محركات البحث  ...الخ 

1-2  شرح الوسم title  : 

وسم هام لكتابة عنوان الصفحة اذا ان لكن صفحة او موقع له عنوان ، كما أشرنا سابقا بان العنوان وكل الكلمات الدلالية للصفحة لاتظهر لنا اي انها في راس الصفحة بين الوسمين <head> و <head/>

لنقوم بعمل ذلك سويا :

مثلا اضع عنوان باسم : مدونة لنرتقي 

1
2
3
4
5

<html>
<head>
<title> مدونة لنرتقي </title>
</head>
</html>

الان نحفظ العمل ، 
وللقيام بذلك سهل مثل باقي البرامج اذهب الى fichier >enregistrer sous  ثم اختار مكان الحفظ وليكن سطح المكتب
تابع الصور :

انقر على الصورة لمشاهدتها بحجمها الطبيعي 

ثم نحفظها بامتداد html  وهو مهم هنا مثلا انا سميتها texte فنحفظها هكذا texte.html
كما في الصورة :

انقر على الصورة لمشاهدتها بحجمها الطبيعي

هذه هي  :

والنتيجة كما تلاحظون :

انقر على الصورة لمشاهدتها بحجمها الطبيعي 

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

3- الوسم body

هذا وسم رئيسي في الصفحة ، وهو محتوى الصفحة الذي يظهر لنا على الشاشة ، 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

<html> <head> <title> عنوان الصفحة </title> </head> <body> جسم الصفحة (المحتوى الذي يظهر لنا) </body> </html>

ولاحظوا ان مكانه وراء وسم </head> المغلق لان مهامه انتهت 
نحفظ العمل وسنرى النتيجة :

انقر على الصورة لمشاهدتها بحجمها الطبيعي

الى هنا نختم معكم هذا الدرس ، الى درس اخر بحول الله حول تغيير اتجاه الصفحة .

تابع القراءة