كيفية تعديل انماط المدونة

841 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
841
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

كيفية تعديل انماط المدونة

  1. 2. كيفية تعديل الأنماط في المدونة
  2. 4. <ul><li>للبدء بتعديل أنماط المدونة قم باتباع الخطوات التالية بعد إنشاء مدونة : </li></ul><ul><li>الدخول إلى قسم المدونات في حسابك </li></ul><ul><li>قم بالضغط على خصائص الخاصة بالمدونة المطلوبة </li></ul><ul><li>قم بالضغط على حرر التصميم </li></ul><ul><li>ثم اضغط على </li></ul><ul><li>سيظهر لديك مربع يحتوي على أكواد برمجية HTML وهذا المربع يدعى كود النمط </li></ul>
  3. 5. <ul><li>في هذا المربع نجد أقسام رئيسية في المدونة هي التالية : </li></ul><ul><li>Main Areas النقاط الرئيسية بالمدونة : حجم الصفحة، خلفية المدونة ككل، لون الخط وحجمه </li></ul><ul><li>Blog Header رأس المدونة </li></ul><ul><li>Blog Sidebar العمود الجانبي للمدونة </li></ul><ul><li>Footer ذيل المدونة </li></ul><ul><li>Profile Area مربع التعريف بالشخصية </li></ul>
  4. 6. <ul><li>Main Area النقاط الرئيسية للمدونة </li></ul><ul><li>هذا الجزء يحدد خصائص الخلفية للمدونة : </li></ul><ul><ul><ul><li>Margin الحواشي وتقاس ب pxl </li></ul></ul></ul><ul><ul><ul><li>color لون الخط ويكون عبارة عن كود </li></ul></ul></ul><ul><ul><ul><li>Background لون الخلفية يكون كذلك عبارة عن كود </li></ul></ul></ul><ul><ul><ul><li>Font نوع الخط </li></ul></ul></ul><ul><li>لأكواد ألوان الخطوط والخلفية نعطيك موقعاً كمثال توضيح لا تحديد، فللمستخدم حرية الاختيار : </li></ul><ul><li>http://www.computerhope.com/htmcolor.htm </li></ul><ul><li>وفي حال رغبتك بإيجاد مواقع أخرى، قم بكتابة ”كود HTML للألوان“ في محركات البحث مثل Google . </li></ul>
  5. 7. <ul><li>Blog Header رأس المدونة </li></ul><ul><li>في هذا الجزء تستطيع التحكم برأس المدونة : </li></ul><ul><ul><ul><li>اللون </li></ul></ul></ul><ul><ul><ul><li>صورة الخلفية </li></ul></ul></ul><ul><ul><ul><li>حواشي الرأس </li></ul></ul></ul><ul><ul><ul><li>عنوان المدونة </li></ul></ul></ul><ul><ul><ul><li>حجم عنوان المدونة </li></ul></ul></ul><ul><ul><ul><li>حاشية العنوان </li></ul></ul></ul><ul><ul><ul><li>لون الخط </li></ul></ul></ul><ul><li>لتغيير اللون استعمل الأكواد نفسها الموجودة في النقطة السابقة </li></ul><ul><li>لتغيير الخلفية : </li></ul><ul><ul><li>قم بتحميل الصورة المطلوبة إلى إدارة الملفات في قسم مواقع </li></ul></ul><ul><ul><li>انسخ عنوان الصورة الذي يظهر في المتصفح مثال : http://support.jeeran.com/add_html.JPG </li></ul></ul><ul><ul><li>ضع العنوان الذي نسخته مكان عنوان الصورة بعد background: url بين القوسين </li></ul></ul><ul><ul><li>فيصبح العنوان background: url(http://support.jeeran.com/add_html.JPG); </li></ul></ul>
  6. 8. <ul><li>Blog Sidebar العمود الجانبي للمدونة </li></ul><ul><li>القسم الأول لحجم العمود الجانبي ولونه </li></ul><ul><li>Sidebar-box لحجم الإطار وتنسيق </li></ul><ul><li>الكلمات . </li></ul><ul><li>Sidebar ul il لخلفية العمود إذا كنت </li></ul><ul><li>تريدها أن تكون صورة </li></ul>
  7. 9. <ul><li>Footer ذيل المدونة </li></ul><ul><li>لتغيير خلفية ذيل المدونة </li></ul><ul><li>قم بنسخ عنوان الصورة ال URL بعد background-image: url </li></ul><ul><li>Height لتحديد ارتفاع الذيل </li></ul>
  8. 10. <ul><li>Profile Area مربع التعريف بالشخصية </li></ul><ul><li>Profile –box h1 </li></ul><ul><ul><ul><ul><li>Font size حجم الخط </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Font weight عريض أو مائل أو مخطط </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Color لون الخط </li></ul></ul></ul></ul><ul><li>Profile -image الصورة الشخصية </li></ul><ul><ul><ul><ul><li>Border حجم الإطار </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Width عرض الصورة </li></ul></ul></ul></ul>
  9. 11. <ul><li>Profile -image –box صندوق الصورة الشخصية </li></ul><ul><ul><ul><ul><li>Width عرض الصورة </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Padding الفراغات </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Background Image: url لنسخ عنوان الصورة لتظهر في خلفية صندوق الصورة الشخصية . </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Background –repeat لتحديد إن كنت تريد للخلفية أن تتكرر أم لا </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Background –position موقع الخلفية . </li></ul></ul></ul></ul>
  10. 12. <ul><li>أسفل الكود الخاص بالأنماط ستجد عدة خيارات هي التالية </li></ul><ul><li>تستطيع استعراض التغييرات لترى التغييرات التي قمت بتعديلها قبل حفظها . </li></ul><ul><li>بعد حفظ التغييرات قد ترغب باسترجاع الكود الأصلي للمدونة لإلغاء التعديلات . </li></ul><ul><li>أو قد ترغب بالرجوع عن التعديل قبل حفظ التغييرات </li></ul>

×