اضافة شريط يعرض اخر مواضيع المدونة بالالوان التي تناسب مدونتك
بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
سأقدم لكم اليوم إضافة جميلة وهي اضافة شريط يعرض اخر اخبار المدونة او اخر التدوينات بأشكال جميلة ورائعة وايضا الوان حسب اختيارك
تابعو الشرح اخواني الكرام
اولا ابحث عن الكود التالي :
<head/>
واضف هذا الكود قبله :
<style type='text/css'> #beakingnews{width:980px;margin:0 auto;line-height:37px;;overflow:hidden; margin-bottom: 0px; max-height: 37px; overflow: hidden; background: #fff; -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset; -webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset; background-clip: padding-box;border-left: none;max-height: 37px;} #beakingnews .tulisbreaking{display:block;float:right;padding:0 7px;;color:#FCFCFC;background:#f88c00; -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset; -webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset; box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset; color: #FFF;font-family:GE SS Two Medium,droidkufi-bold;font-size: 14px; line-height: 37px;padding-right: 10px;padding-left: 10px;font-weight: normal; text-transform: uppercase;} #recentpostbreaking{float:right;padding-right: 15px;} #recentpostbreaking ul,#recentpostbreaking li{list-style:none;margin:0;padding:0} #recentpostbreaking li a{color:#333; font-family:GE SS Two Medium,droidkufi-bold;font-size:14px;} </style></b:if></b:if>
تانيا ابحث عن الكود التالي :
<div class='main-outer'>
ونلصق قبله هذا الكود :
<b:if cond='data:blog.pageType != "static_page"'> <b:if cond='data:blog.pageType != "item"'> <div id='beakingnews'><span class='tulisbreaking' style='height: 74px; width: 100px; padding-right: 20px;'>أحدث الأخبار</span><!-- tag pembuka tempat Breaking News--> <div id='recentpostbreaking'>Loading...</div><!-- tag tempat daftar Breaking News ditampilkan--> </div><!-- tag penutup tempat Breaking News--> <script type='text/javascript'> //<![CDATA[ $(document).ready(function () { var url_blog = 'http://www.zooma-info.com', // alamat blogmu contoh http://mkr-site.blogspot.com numpostx = 10; // Jumlah artikel yang di tampilkan $.ajax({ url: '' + url_blog + '/feeds/posts/default?alt=json-in-script&max-results=' + numpostx + '', type: 'get', dataType: "jsonp", success: function(data) { var posturl, posttitle, skeleton = '', entry = data.feed.entry; if (entry !== undefined) {skeleton = "<ul>";for (var i = 0; i < entry.length; i++) { for (var j=0; j < entry[i].link.length; j++) { if (entry[i].link[j].rel == "alternate"){ posturl = entry[i].link[j].href; break; } } posttitle = entry[i].title.$t; skeleton += '<li><a href="' + posturl + '" target="_blank">' + posttitle + '</a></li>'; } skeleton += '</ul>'; $('#recentpostbreaking').html(skeleton); // kode untuk efek pada breaking news function tick(){ $('#recentpostbreaking li:first').slideUp( function () { $(this).appendTo($('#recentpostbreaking ul')).slideDown(); }); } setInterval(function(){ tick () }, 5000); } else { $('#recentpostbreaking').html('<span>No result!</span>'); } }, error: function() { $('#recentpostbreaking').html('<strong>Error Loading Feed!</strong>'); } }); }); //]]> </script> </b:if></b:if>
الان قم باستبدال الرابط التالى http://www.zooma-info.com برابط مدونتك و مبروك عليك الإضافة 
و لتغيير لون احدث الاخبار بما يناسب لون مدونتك ابحث عن الكود التالي :
#beakingnews
ثم داخل هدا الكود ابحث عن background:#f88c00
و غير ما باللون الاحمر باللون الذي يناسب مدونتك 
============================
والى هنا نكون قد انهينا شرحنا نتمنى ان نكون في حسن ضنكم واستودكم الله الدي لا تضيع ودائعه
شارك الموضوع عبر المواقع الاجتماعية
الكاتب: سعيد موافق الادريسي
عمري 16 سنة ,اهتم بالتدوين والتصميم كثيرا ,وعملت هذه المدونة لكي اتعلم واعلم ,ودائما ابحث لكم عن الجديد كي احضره لكم أنا مهوس بجديد التقنية، و، احب أن أوظف خبرتي في كل ما لي به من علم في هذاالمجال المعلوماتي ولاأبخل بأي شيئ عليكم، ، فأرجوا ان لاتبخلوا علي أيضا بمتابعتكم لمواضيعي كما ان تعليقاتكم تهمني
