عودتي بعد مدة طويلة

السلام عليكم
بعد مدة طويلة من عدم وضع اي مواضيع جديدة ان شاء الله ساكمل المشوار لاني انقطعت عن الكتابة لعدة ضروف ومنها عدم الردود على المواضيع لاني حسيت اني لا افيد بشيئ مع ان الردود هي التي يعرف بها المدون هل هو على صح ام العكس ولاسباب اخرى في الحياة الدنيوية واتمنى ان هده العودة تكون احسن من الاول ان شاء الله وساكمل الدورة تابعونا

حل مشكلة التعليق في مدونات بلوجر


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

هو تحميل متصفح جوجل كروم google chrome وتنصيبه على الجهاز 
عند الانتهاء من التنصيب ادخل على المتصفح جوجل كروم تم ادخل على حسابك في بلوجر تم ادهب لاي مدونة اخرى او مدونتك واكتب الرد واضغط على كتابة رد سيضاف ان شاء الله ممكن ادا لم يضف الرد اضغط على معاينة تم اضافة الرد هدا هو ما حصل معي بالتوفيق 

نبدة مختصرة عن اهم وسوم html و تقنية css

السلام عليكم اليوم ان شاء الله سنرى الجزء الاول من  دورة تصميم واجهة مدونة بتقنية html/css  لنبدا على بركة الله
قبل ان نبدا اشير الى هدين الموضوعين :

هل تود تعلم لغة html حقا

طريقك لتعلم لغة css2



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

اولا التعرف على html 

هي لغة تستعمل لبناء الصفحات وهي اختصار لجملة Hyper Text Markup language وهي ليست
كباقي اللغات لا تحتاج الى مترجم او بالاحرى ليست لغة برمجة متل php و asp.net و .... الخ
والوسوم في Html تكون على الشكل التالي :
<tag>هنا الجزء الدي سيتاتر بالوسم tag</tag>
الان عرفنا كيف نكتب الوسوم في لغة html ادا لنتعرف عن اهم وسوم html التي لا يمكن كتابة اي صفحة بدون وهده الوسوم تكون على الشكل التالي  :
<html>
  <head>
  </head>
<body>
</body>
</html>
الان لنشرح لمادا تصلح هده الوسوم
اولا وسم <html> كما نلاحض لقد بدانا به واقفلناه  ب </html> كما راينا سابقا
ان بداخل وسم html نضع محتويات الصفحة ودلك اما المحتوى الدي سيضهر لزائر الصفحة سنشرحها
في body او التي سيقراها المتصفح متل title و كما سنشرحه في head
الان وسم <head></head> هدا الوسم نضع بداخله وسم
<title> </title> الدي نضع بداخله عنوان الصفحة ادا كنت تتصفح المواقع لابد انك تلاحض اسماء الصفحات
في البار في الفوق من المتصفح وهدا عمل وسم title
الان الوسم <body> الدي يكون بداخله جميع محتوى الصفحة من فقرات
وصور و جداول ... الخ

اهم الوسوم المستعملة في لغة html

<p></p> 
وهو وسم لفقرات في html
<br />
وسم لرجوع الى السطر يعمل كعمل entrer في الكيبورد هدا الوسم من الوسوم المفردة ويمكن
كتابته <br></br> ويستحسن كتابته هكدا <br />
 <img src="هنا عنوان الصورة" alt="هنا وصف الصورة وهده هامة لكسب صداقة محركات البحت " />
لاضافة صورة الى الصفحة
<pre></pre>
لكتابة النص كما كتبته اي ادا ضغطت على enter تحتسب رجوع الى السطر ولا تحتاج لوسم <br /> ليس متل الوسم <p>
<a href ="هنا عنوان الرابط"></a>
وسم الروابط هدا الوسم هام جدا لاضافة روابط لصفحة
<ul></ul>
هدا الوسم للقوائم الغير متسلسلة متال
  • html
  • css
  • html/css
<ol></ol>
هدا للقوائم المتسلسلة اي مرقمة متال
  1. html
  2. css
  3. html/css
الى هنا نتوقف الى الجزء التاني وهو css ان شاء الله سيكون في نفس الموضوع
 

دورة تصميم واجهة مدونة بتقنية html/css




السلام عليكم
اخواني اخواتي الكرام ان شاء الله ساضع دورة تصميم واجهة مدونة بتقنية html/css تتكون من ثلات اجزاء كما موضح في الاسفل وهدف هده الدورة هي معرفة كيف تنشئ صفحات الويب و ساستعمل بعد تقنيات css3 وهده الدورة بداية لدورات احترافية قادمة

لمن هده الدورة 

  • للجديد في عالم تصميم صفحات الويب
  • لمن اراد معرفة بعض تقنيات css3 الحديثة



اجزاء الدورة

  • الجزء الاول من دورة تصميم واجهة مدونة : نبدة مختصرة عن اهم وسوم html و تقنية css
  • الجزء التاني من دورة تصميم واجهة مدونة : وضع محتوى التصميم ب html
  • الجزء الثالت من دورة تصميم واجهة مدونة : تنسيق الواجهة بتقنية css 
لقد فتحت هدا الموضوع لمعرفة عدد المهتمين لدورة وان شاء الله سيكون اول درس 23 من يوليوز.

قوالب بلوجر معربة - قالب Twit Plus معرب

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

1 - مميزات القالب :
  • عمود ايمن
  • خاصية اقرا المزيد
  • ملف تعريف في الرئيسية



2 - اعدادات القالب
قبل ان ابدا للبحت عن الاكود يجب ان تدهب الى تصميم --> تحرير html --> توسيع القالب --> Ctrl+f وفي خانة البحت انسخ الكود وعدل كما تشاء وما لون بالازرق هو ما يجب تغيره لنبدا بسم الله الرحمان الرحيم

  • عنوان المدونة
ابحث عن هدا الكود

<div class='logo'><a expr:href='data:blog.homepageUrl'><h2>Twit Plus</h2></a></div>
  • ملف التعريف

ابحث عن هدا الكود

 <div class='authorimg'>
     <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj96Gzd7Ue9ser_jXYCOmmv13TucHtemtlNy7JR06WElwHqV0uKbi7bbeCxCJBalm63ZtwtfPIrSLXVJZQf0YbpmpFuWgISIjhBsWB55NWEz8mcVa2SVuGDCVvBgt9xxO88xNflpZFd3VWR/s1600/default_pic.png'/>
</div>
<div class='authorinfo'>
     <span class='name'><h3>عرب ويب ديازين</h3></span>
     <span class='location'><h4>ايوب ميدان</h4></span>
     <span class='bio'>هي مدونة تهتم بتصميم المواقع و كل ما يتعلق بتقنية CSS وhtml وقوالب بلوجر معربة ودروس تتعلق بتعريب القوالب وكل ما جد في ويب ديازين.</span>
</div>
  •  مشاركة عبر البريد و الفيسبوك وتويتر

ابحث عن هدا الكود

<div id='follow'>
<div class='twitter'><a href='http://twitter.com/#!/ayoubmido'><b>299</b></a><span class='bot'>Followers</span></div>
<div class='facebook'><a href='http://www.facebook.com/pages/%D8%B9%D8%B1%D8%A8-%D9%88%D9%8A%D8%A8-%D8%AF%D9%8A%D8%A7%D8%B2%D9%8A%D9%86/177567075632873?sk=wall'><b>299</b></a><span class='bot'>Fans</span></div>
<div class='feedburner'><a href='http://feeds.feedburner.com/blogspot/NvDLL'><b>299</b></a><span class='bot'>Subscribers</span></div>
</div>
ادا اعجبك الموضوع تسجل اخي في اشترك معنا ليصلك الجديد




قوالب بلوجر - قالب Oustine معرب

السلام عليكم
قالب Oustine معرب الرائع سريع التصفح دو قائمة جانبية في اليمين به اضافة اقراء المزيد ويتميز بالسلايدشو سهلة التعديل وقائمة افقية رائعة ويتميز بالوانه الهادئة صراحتا من اروع قوالب بلوجر







  •  التعديل على السلايدشو
 من لوحة تحكم المدونة ادهب الى تصميم تم تحرير html تم توسيع القالب وابحت عن هدا الكود
<div id='myGallery'>
ملحوضة : لتسهيل عملية البحت اضغط على Ctrl+F ستضهر قائمة بالاسفل واكتب الكود في مكان البحت
ستجد تحته هدا الكود مباشرة وهدا الكود هو الدي يهمنا الان

<div class='imageElement'>
<h3>عنوان الموضوع</h3>
<p>ضع وصف الموضوع هنا متال هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي .</p>
<a class='open' href='http://ar-webdesign.blogspot.com/' title='This is featured post 1'/>
<img alt='' class='full' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggfNI_f_tKFql9KI9nn33AX-ANpEnjpvQ9Lt7RTiBrsc1Mid0CE_82dRvpnlRa1-AXa6x3-gCbqf0IgKWTexTIBLVMaJB5pR3zWIGVTQbLg0V_MvTfCWbdbJ71OkDmXgoUGnhmaHOmQAkk/s1600/1.jpg'/>
</div>
<div class='imageElement'>
<h3>عنوان الموضوع</h3>
<p>ضع وصف الموضوع هنا متال هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي .</p>
<a class='open' href='http://ar-webdesign.blogspot.com/' title='This is featured post 1'/>
<img alt='' class='full' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggfNI_f_tKFql9KI9nn33AX-ANpEnjpvQ9Lt7RTiBrsc1Mid0CE_82dRvpnlRa1-AXa6x3-gCbqf0IgKWTexTIBLVMaJB5pR3zWIGVTQbLg0V_MvTfCWbdbJ71OkDmXgoUGnhmaHOmQAkk/s1600/1.jpg'/>
</div>
<div class='imageElement'>
<h3>عنوان الموضوع</h3>
<p>ضع وصف الموضوع هنا متال هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي .</p>
<a class='open' href='http://ar-webdesign.blogspot.com/' title='This is featured post 1'/>
<img alt='' class='full' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggfNI_f_tKFql9KI9nn33AX-ANpEnjpvQ9Lt7RTiBrsc1Mid0CE_82dRvpnlRa1-AXa6x3-gCbqf0IgKWTexTIBLVMaJB5pR3zWIGVTQbLg0V_MvTfCWbdbJ71OkDmXgoUGnhmaHOmQAkk/s1600/1.jpg'/>
</div>
<div class='imageElement'>
<h3>عنوان الموضوع</h3>
<p>ضع وصف الموضوع هنا متال هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي .</p>
<a class='open' href='http://ar-webdesign.blogspot.com/' title='This is featured post 1'/>
<img alt='' class='full' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggfNI_f_tKFql9KI9nn33AX-ANpEnjpvQ9Lt7RTiBrsc1Mid0CE_82dRvpnlRa1-AXa6x3-gCbqf0IgKWTexTIBLVMaJB5pR3zWIGVTQbLg0V_MvTfCWbdbJ71OkDmXgoUGnhmaHOmQAkk/s1600/1.jpg'/>
</div> 
<div class='imageElement'>
<h3>عنوان الموضوع</h3>
<p>ضع وصف الموضوع هنا متال هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي هدا نص تجربي .</p>
<a class='open' href='http://ar-webdesign.blogspot.com/' title='This is featured post 1'/>
<img alt='' class='full' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggfNI_f_tKFql9KI9nn33AX-ANpEnjpvQ9Lt7RTiBrsc1Mid0CE_82dRvpnlRa1-AXa6x3-gCbqf0IgKWTexTIBLVMaJB5pR3zWIGVTQbLg0V_MvTfCWbdbJ71OkDmXgoUGnhmaHOmQAkk/s1600/1.jpg'/>
</div>

  1. اللون الاحمر : غيره بعنوان الموضوع
  2. اللون الازرق : غيره بوصف لموضوعك او مقتطف صغير من موضوعك
  3. اللون البنفسجي : غير رابط مدونتي برابط الموضوع
  4. اللون الوردي : غيره بعنوان رابط صورة الموضوع
لاحضتم سهولت تعديل السلايدشو, لا تحرمونا من ردودكم

الى هنا السلام