إضافة جميلة وهي اخر اخبار المدونة أوآخر التدوينات

السلام عليكم ورحمة الله تعالى وبركاته
الكثير يبحث عن الأجمل والأفضل لتطوير مدونته

سأقدم لكم اليوم إضافة جميلة وهي اخر اخبار المدونة او اخر التدوينات

ويمكن أن يعطي نتائج جيدة بإذن الله

فعلى بركة الله نتوكل

بسم الله الرحمن الرحيم

كنز المعرفة .....عالم بلا حدود

اولا ابحث عن الكود التالي :

كود بلغة HTML:

<head/>

واضف هذا الكود قبله :

كود بلغة HTML:

<b:if cond='data:blog.pageType != "static_page"'>

<b:if cond='data:blog.pageType != "item"'>

#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>

تانيا ابحث عن الكود التالي

كود بلغة HTML:

ونلصق قبله هذا الكود

كود بلغة HTML:

<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>

<div id='recentpostbreaking'>Loading...</div>

</div>

//<![CDATA[

$(document).ready(function () {

var url_blog = 'http://www.karker.blogspot.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://karker.blogspot.com/ برابط مدونتك و مبروك عليك الإضافة

و لتغيير لون احدث الاخبار بما يناسب لون مدونتك ابحث عن الكود التالي

كود بلغة HTML:

#beakingnews

ثم داخل هدا الكود ابحث عن background:#f88c00
و غير ما باللون الاحمر باللون الذي يناسب مدونتك

كما يمكنك إستبدال آخر الأخبار بأحدث المواضيع