تعديل كامل وشامل لقالب مدونة ذؤيب التي بات يستخدمها عشرات المدونين عبر شبكة الإنترنت نظرا لما تتميز به من خصائص جميلة تلائم وتناسب جل المدونات ولما تحتويه من اضافات يحتاج اليها أي مدون، بالإضافة الى تنسيقها وتصميمها الجيد كاللون والخط والحجم وغيرها من المميزات الفريدة.
باذن الله سنتطرق الى تعديل معظم الأدوات والإضافات والإعدادات الأساسية والهامة بالقالب وسيكون النقاش مفتوح لطرح اي استفسار أو مشكلة تصادفك بالقالب وسيتم الإجابة عن استفساراتكم حول القالب بالتدوينة نفسها أي في كل مرة يتم طرح نقطة جديدة لم تذكر في التدوينة يتم شرحها واضافتها الى التدوينة نفسها.
تعديـــــــــــــــل الشعـــــــــــــــــــار
width='425 اللون الأزرق عرض الشعار
height='122 اللون الأخضر ارتفاع الشعار
حجم الشعار لايجب أن يتجاوز 100ك ب يمكنك ضغط الصورة باحدى برامج ضغط الصور أو المواقع المخصصة لذالك ويمكنك حذف الشعار نهائيا بحذف الكود السابق (الكود داخل الإطار) وحفظ قالب المدونة.
تعديل الشريط الأفقي (القائمة الأفقية)
يمكنك تعديل القائمة الأفقية للمدونة واضافة أقسام أو صفحات أخرى لمدونتك قم بالبحث عن الكود <ul class='left clearfloat' id='page-bar'> ستجد الكود بالشكل التالــــــي :
اذا أردت تغيير اي من الصفحات قم بادراج رابط الصفحة التي تود توجيه الزوار اليها مكان الرابط باللون الأزرق وتغيير اسم الصفحة مكان الكلمات باللون الأحمر.
اذا أردت حذف صفحة معينة قم بتحديد سطر لصفحة معينة كما هو موضح بالصورة واحذفه بالكامل واحفظ قالب المدونة.
اذا أردت اضافة صفحة جديدة قم بنسخ سطر ولصقه مرة اخرى مباشرة تحت السطر السابق وهكذا وقم بتغيير الرابط والتسمية فقط للصفحة الجديدة.
حذف مربع البحث من الشريط الأفقي
ابحث عن الكود <div id='search'> ثم قم بمسح الكود التالـــــــــــــــــــــــــــي :
تعديل حجم الصفحة (صفحة عرض التدوينات او الرسائل)
ابحث عن الكود #headline { ستجد الكود بالشكل التالـــــي :
قم بتغيير القيمة width:600px الى الحجم الذي يلائم مدونتك.
ابحث عن الكود #head { ستجده بالشكل التالــــي :
قم بتغيير القيمة 960 واحفظ القالب
قم بتعديل القيمة 940 الى ما يناسب مدونتك
تغيير لون تظليل خط الأدوات الجانبية للمدونة أثناء المرور بمؤشر الماوس
ابحث عن الكود التـــــــــــــــــــــــــــــــالي :
باذن الله سنتطرق الى تعديل معظم الأدوات والإضافات والإعدادات الأساسية والهامة بالقالب وسيكون النقاش مفتوح لطرح اي استفسار أو مشكلة تصادفك بالقالب وسيتم الإجابة عن استفساراتكم حول القالب بالتدوينة نفسها أي في كل مرة يتم طرح نقطة جديدة لم تذكر في التدوينة يتم شرحها واضافتها الى التدوينة نفسها.
تعديـــــــــــــــل الشعـــــــــــــــــــار
- تعديل شعار القالب واستبداله بشعار خاص بمدونتك
- من لوحة التحكم
- اختر قالب
- تحرير html
- علم خانة - توسيع قوالب عناصر واجهة المستخدم
- اضغط على المفتاح f 3 وابحث عن الكود <div class='left' id='logo'> ستجده بالشكل التالـــــي :
<div class='left' id='logo'>
<a expr:href='data:blog.homepageUrl'><img alt='' border='0' height='122' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgM4iKEFhthnRO3WVazIV0bc96-4oRNxJ-p616Qn12Ar3k9yu_PDyrwu25srBsNgrQwZccxns45QTzUnE95i3zCVOPmvtegOfrfW5s2IDQ1SVvif2blYWnsMHzBvZmEJ0GyBtIPnW35jI/' width='425'/></a>
<div id='tagline'><data:description/></div>
</div>
قم باستبدال الرابط باللون الأحمر برابط صورة الشعار الخاص بمدونتك ولتغيير حجم الشعار عدل النسب التالية
width='425 اللون الأزرق عرض الشعار
height='122 اللون الأخضر ارتفاع الشعار
حجم الشعار لايجب أن يتجاوز 100ك ب يمكنك ضغط الصورة باحدى برامج ضغط الصور أو المواقع المخصصة لذالك ويمكنك حذف الشعار نهائيا بحذف الكود السابق (الكود داخل الإطار) وحفظ قالب المدونة.
تعديل الشريط الأفقي (القائمة الأفقية)
يمكنك تعديل القائمة الأفقية للمدونة واضافة أقسام أو صفحات أخرى لمدونتك قم بالبحث عن الكود <ul class='left clearfloat' id='page-bar'> ستجد الكود بالشكل التالــــــي :
<ul class='left clearfloat' id='page-bar'>
<li><a expr:href='data:blog.homepageUrl'>الرئيسية</a></li>
<li><a href='http://blogger-onlin.blogspot.com/2012/11/blog-post_12.html'>فهــــرس المدونــــة</a>
</li>
<li><a href='http://blogger-onlin.blogspot.com/2012/11/blog-post_6864.html'>اطلب مساعدة من الزوار </a>
</li>
<li><a href='http://blogger-onlin.blogspot.com/2012/11/blog-post_7235.html'>الدعم المباشر من الإدارة </a>
</li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"'>التعليقات </a></li>
</ul>
اذا أردت تغيير اي من الصفحات قم بادراج رابط الصفحة التي تود توجيه الزوار اليها مكان الرابط باللون الأزرق وتغيير اسم الصفحة مكان الكلمات باللون الأحمر.
اذا أردت حذف صفحة معينة قم بتحديد سطر لصفحة معينة كما هو موضح بالصورة واحذفه بالكامل واحفظ قالب المدونة.
اذا أردت اضافة صفحة جديدة قم بنسخ سطر ولصقه مرة اخرى مباشرة تحت السطر السابق وهكذا وقم بتغيير الرابط والتسمية فقط للصفحة الجديدة.
حذف مربع البحث من الشريط الأفقي
ابحث عن الكود <div id='search'> ثم قم بمسح الكود التالـــــــــــــــــــــــــــي :
<form action='/search' id='searchform' method='get'><div id='search'><input class='field' id='s' name='q' type='text' value=''/><input class='button' id='searchsubmit' type='submit' value='بحـــث'/></div></form>
تعديل حجم الصفحة (صفحة عرض التدوينات او الرسائل)
ابحث عن الكود #headline { ستجد الكود بالشكل التالـــــي :
#headline {
width:600px;
float:right;
background:#fff;
قم بتغيير القيمة width:600px الى الحجم الذي يلائم مدونتك.
تعديل حجم رأس الصفحة
ابحث عن الكود #head { ستجده بالشكل التالــــي :
#head {width:960px;margin:0px auto;
margin-top:15px;;
قم بتغيير القيمة 960 واحفظ القالب
تعديل الحجم الإجمالي للمدونة
ابحث عن الكود التــــــــــــــــــــــــــــــــــالي:
#page {
width:940px;
margin:0px auto;
padding:10px;
قم بتعديل القيمة 940 الى ما يناسب مدونتك
تغيير لون تظليل خط الأدوات الجانبية للمدونة أثناء المرور بمؤشر الماوس
ابحث عن الكود التـــــــــــــــــــــــــــــــالي :
#sidebar ul li a:hover{ /*hover state CSS*/color: #005b7f;background-color: #F3F3F3;}
اذا أردت تغيير لون الخط أثناء المرور فوقه بمؤشر الماوس color: #005b7f
اذا أردت تغيير لون السحابة المضللة (الخلفية) أثناء المرور بمؤشر الماوس فوق الخط background-color: #F3F3F3
تعديل لون الشريط الأفقي الأزرق
/* Navigation Bar*/
#page-bar li:hover {
#page-bar a, #page-bar a:visited {
تعديل عنوان التدوينة لون وحجم ونوع الخط
a:link, a:visited {
a:hover, a:active {
#headline div.title {
#page-bar li:hover {
#page-bar a, #page-bar a:visited {
تعديل عنوان التدوينة لون وحجم ونوع الخط
a:link, a:visited {
a:hover, a:active {
#headline div.title {
تغيير لون شريط المشاراكات الشائعة
#headline h2 { font:1em Tahoma;
تغيير لون شريط الأدوات الجانبية
#sidebar h2 {
