اضف لسايد بار مدونتك الوان جميلة جدا
بسم الله الرحمن الرحيم
اخواني الكرام انا سابقا وعدت بأن اقدم اضافات ودروس ولكني قدمة بعض الأضافات ولكني لم اقدم دروس تطوير المدونة وفي هذا التدوينة سأفوي بالعهد وسأقدم درس اتوقع انه سيلقى استحسانكم اخواني الكرام سأقدم اضافة تضيف على المدونة او قالب المدونة لمسة جميلة من الأوان وهاذه الأضافة متعلقة بالسايد بار لأنه تضيف لون لكل اداة بشكل جميل وجذاب
واضفت هذا الدرس لأني قرات عدت اسئلة وعدت اسفسارات عن هذا الأمر وخصوصا في مدونة الرافدين الرائعة التي يكتبها احمد ولأسئلة كانت في تدوينة تقسيم التصنيفات الى قسمين في بعض الأخوان سؤلوه عن الأضافة هاذه فقال انها شبيها بنفس كود التقسيم ولذلك لأخ احمد له ايضا فضل بهذا الدرس والحمد لله بفضل الأخت سهام صاحبة مدونة قرطاسية نت التي اعطتني الكثير من الأمور التي تتعلق في اكواد css الذي هو اصل هاذه الأضافة انا اطلت عليكم بالمقدمة لنبدء بالشرح قبل الشرح :.
لمعاينة الأضافة والدرس اضغط هنا
لنبداء الأن بالشرح
اذهب الى المسار التالي
لوحة التحكم الرئيسية>تخطيط/تصميم>تحريرhtml
واضف اعلاه اي فوقه مباشرة اضف هذا الكود
الأدوات التي سيحدث عليها التغير
1-LinkList3 - LinkList2 - LinkList1. (قائمة الروابط)
2-HTML3 - HTML2 - HTML1. (اكواد الجافا سكربت)
3-Label1 (التصنيفات).
4- Feed2 - Feed1 (التغذية التدوينات تغذية التعليقات)
5-BlogArchive1 (الأرشيف)
6-Followers1 (المتابعون)
7- Profile1 (الوضع اي من انا )
8- Image1 (صورة)
9- Text1 (نص)
اتمنا اني افويت الشرح وانشالله ان يكون الشرح وافي ومفيد وانشالله سأقدم ستيلات اخرى من نفس الأضافة قريبا بأذن الله
اخواني الكرام لدي سؤال للجميع هل الدرس والشرح يستاهل كلمة شكرا ؟؟
اخواني الكرام انا سابقا وعدت بأن اقدم اضافات ودروس ولكني قدمة بعض الأضافات ولكني لم اقدم دروس تطوير المدونة وفي هذا التدوينة سأفوي بالعهد وسأقدم درس اتوقع انه سيلقى استحسانكم اخواني الكرام سأقدم اضافة تضيف على المدونة او قالب المدونة لمسة جميلة من الأوان وهاذه الأضافة متعلقة بالسايد بار لأنه تضيف لون لكل اداة بشكل جميل وجذاب
واضفت هذا الدرس لأني قرات عدت اسئلة وعدت اسفسارات عن هذا الأمر وخصوصا في مدونة الرافدين الرائعة التي يكتبها احمد ولأسئلة كانت في تدوينة تقسيم التصنيفات الى قسمين في بعض الأخوان سؤلوه عن الأضافة هاذه فقال انها شبيها بنفس كود التقسيم ولذلك لأخ احمد له ايضا فضل بهذا الدرس والحمد لله بفضل الأخت سهام صاحبة مدونة قرطاسية نت التي اعطتني الكثير من الأمور التي تتعلق في اكواد css الذي هو اصل هاذه الأضافة انا اطلت عليكم بالمقدمة لنبدء بالشرح قبل الشرح :.
لمعاينة الأضافة والدرس اضغط هنا
لنبداء الأن بالشرح
اذهب الى المسار التالي
لوحة التحكم الرئيسية>تخطيط/تصميم>تحريرhtml
*/مهم\*
احفظ القالب لتفادي اي مشاكل لأسترجاعه عند الحاجة.
اضغط cntrl+f للبحث عن الأكواد ابحث عن هذا الكود
]]></b:skin>
اخواني الكرام بعض الملاحظات المهمة:.#LinkList1 {
color:#E41B17;
}
#LinkList1 h2 {
background-image:url('http://i47.tinypic.com/f38knk.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#LinkList1 a {
color:#E41B17;
}
#LinkList2 {
color:#717D7D;
}
#LinkList2 h2 {
background-image:url('http://i47.tinypic.com/2zemseh.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#LinkList2 a {
color:#717D7D;
}
#LinkList3 {
color:#ECD872;
}
#LinkList3 h2 {
background-image:url('http://i48.tinypic.com/9h59jm.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#LinkList3 a {
color:#ECD872;
}
#HTML1 {
color:#8D38C9;
}
#HTML1 h2 {
background-image:url('http://i49.tinypic.com/23u613o.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#HTML1 a {
color:#8D38C9;
}
#HTML2 {
color:#1589FF;
}
#HTML2 h2 {
background-image:url('http://i50.tinypic.com/6favyp.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#HTML2 a {
color:#1589FF;
}
#HTML3 {
color:#C8BBBE;
}
#HTML3 h2 {
background-image:url('http://i48.tinypic.com/wuqvxl.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#HTML3 a {
color:#C8BBBE;
}
#Label1 {
color:#717D7D;
}
#Label1 h2 {
background-image:url('http://i47.tinypic.com/2zemseh.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#Label1 a {
color:#717D7D;
}
#Feed1 {
color:#E41B17;
}
#Feed1 h2 {
background-image:url('http://i47.tinypic.com/f38knk.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#Feed1 a {
color:#E41B17;
}
#Feed2 {
color:#1589FF;
}
#Feed2 h2 {
background-image:url('http://i50.tinypic.com/6favyp.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#Feed2 a {
color:#1589FF;
}
#BlogArchive1 {
color:#C031C7;
}
#BlogArchive1 h2 {
background-image:url('http://i49.tinypic.com/23u613o.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#BlogArchive1 a {
color:#C031C7;
}
#Followers1 {
color:#726E6D;
}
#Followers1 h2 {
background-image:url('http://i48.tinypic.com/wuqvxl.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#Followers1 a {
color:#726E6D;
}
#Profile1 {
color:#717D7D;
}
#Profile1 h2 {
background-image:url('http://i47.tinypic.com/2zemseh.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#Profile1 a {
color:#717D7D;
}
#Image1 {
color:#FDD017;
}
#Image1 h2 {
background-image:url('http://i48.tinypic.com/9h59jm.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#Image1 a {
color:#FDD017;
}
#Text1 {
color:#717D7D;
}
#Text1 h2 {
background-image:url('http://i47.tinypic.com/2zemseh.gif');
color:#ffffff;
padding:10px 6px 0 0;
height:20px;
font-size:15px;
}
#Text1 a {
color:#717D7D;
}
الأدوات التي سيحدث عليها التغير
1-LinkList3 - LinkList2 - LinkList1. (قائمة الروابط)
2-HTML3 - HTML2 - HTML1. (اكواد الجافا سكربت)
3-Label1 (التصنيفات).
4- Feed2 - Feed1 (التغذية التدوينات تغذية التعليقات)
5-BlogArchive1 (الأرشيف)
6-Followers1 (المتابعون)
7- Profile1 (الوضع اي من انا )
8- Image1 (صورة)
9- Text1 (نص)
اتمنا اني افويت الشرح وانشالله ان يكون الشرح وافي ومفيد وانشالله سأقدم ستيلات اخرى من نفس الأضافة قريبا بأذن الله
اخواني الكرام لدي سؤال للجميع هل الدرس والشرح يستاهل كلمة شكرا ؟؟
الاشتراك في:
تعليقات الرسالة (Atom)
4 تعليق على اضف لسايد بار مدونتك الوان جميلة جدا
مشكور ويتم الآن التجربة
اهلين اخي محمد شرفت المدونة
بارك الله فيك اخي مهند على هذه الأضافة الرائعة
مرحبا اخي مجتبي وشكرا على المرور .
إرسال تعليق