http://img15.imageshack.us/img15/416...1dp1qm3nm5.gif

http://up.arab-x.com/Feb10/uil04137.gif

http://1.bp.blogspot.com/_ZXEvc1YiIk...%84%D8%AF.jpeg




السلام عليكم





أولا شكرا خاص ل i-marco






للمشاهدة1 / DEMO1





للمشاهدة2 / DEMO2






أولا : من لوح تحكم مدونتك انتقل إلى صفحة التخطيط ثم ثم تصميم " تحرير HTML "



ثانيا : قبل إجراء أي تعديل احفظ نسخة احتياطية من القالب لاستعادتها عند الضرورة.



ثالثا : ضع علامة في خانة توسيع القوالب .



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





كود:






و ضع فوقه او اسفله هدا الكود



كود:




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





كود:
]]>




و ضع فوقه مباشرتا هدا الكود







كود:
#dafis-acc{ font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#333; background:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S-...ECSg/d/bg5.gif) repeat-y scroll left center #E7F7FB; padding:2px 0; border:1px solid #339DC6; } .dafis-label{ background:url(http://lh6.ggpht.com/_xcD4JK_dIjU/S-...nwmo/d/bg4.gif) repeat-x scroll 0 0 #E1F4FB; font-weight:bold; line-height:1.4em; overflow:hidden; white-space:nowrap; vertical-align: baseline; margin: 1px 3px; outline: none; cursor: pointer; text-decoration: none; padding: 2px 10px; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.3); border:1px solid #2F94BA; } .dafis-label:hover{ background:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S-...7qak/d/bg2.gif) repeat-x scroll 0 0 #E1F4FB; color:#003366; } .dafis-daf ol{ margin:0 0 0 30px !important; padding:0 !important; } .dafis-daf ol li{ background-color:#C9E9F4; line-height:1.5em; margin:1px 3px !important; white-space:nowrap; text-align:left; border:1px solid #339DC6; } .dafis-daf ol li a{ text-decoration: none !important; color:#333 !important; display:block; padding-left:10px; } .dafis-daf ol li a:hover{ background: #7BC4DF; border-left: 5px #333 solid; padding-left: 5px; text-shadow: 0 1px 1px rgba(0,0,0,.3); }






أخيرا : استعرض مدونتك ثم احفظ قالبك.




شرح كيفية الإستخدام




قم بكتابة تدوينتك بالطريقة المعتادة




و عندما تأتي للسطر الذي سوف تريد وضع فيه هته الخاصية,



أنتقل لوضع تحرير HTML و قم بوضع الكود بهذه الطريقة





أو يمكنك اضافة باضافة اداة HTML





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





لتحميل الكود



http://1.bp.blogspot.com/_ZXEvc1YiIk...0/Download.png





المصدر