[إضافات بلوجر] إضافة شريط آخر المواضيع لمدونات بلوجر

[إضافات بلوجر] إضافة شريط آخر المواضيع لمدونات بلوجر

مرحبا بك من جديد في إضافة جديدة من إضافات بلوجر على مدونة خطوات مطور، اليوم بإذن الله لدينا إضافة جميلة، خفيفة، تضفي على مدونتك لمسة من الإبداع والاختلاف عن باقي المدونات والتي هي إضافة شريط آخر الأخبار المتحرك لمدونات بلوجر، والذي يعرض آخر مواضيع مدونتك بشكل متحرك ورائع!
دعونا نمر الآن إلى طريقة تركيب الإضافة على قالب مدونتك:
أولا قم بالتوجه إلى </head> ثم أضف الكود التالي قبله/ فوقه:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <style type='text/css'> #beakingnews{width:980px;margin:0 auto;line-height:37px;;overflow:hidden; margin-bottom: 20px; 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:#21b8ff; -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>

مع العلم أنه بإمكانكم التعديل على اللون حسب رأيكم وذلك عن طريق تغيير الHex color.

الآن إبحث عن <div class='main-outer'> وألصق قبله/فوقه الكود التالي :
<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <div id='beakingnews'><span class='tulisbreaking'>أحدث الأخبار</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.dev-steps.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>
ثم قم باستبدال الرابط برابط مدونتك!

مواضيع ينصح بقراءتها:
[إضافات بلوجر 2015] زيّن مدونتك واجعلها احترافية مع صندوق الفيسبوك المطور (جديد 2015)
تعرف على أهمية إضافة صندوق صفحتك على الفيسبوك + طريقة الإضافة
[إضافات بلوجر] إضافات تابعنا عبر الشبكات الاجتماعية بشكلين احترافيين مختلفين
[إضافات بلوجر] إضافة شاهد أيضا لمدونتك على بلوجر
[خطوط بلوجر] تجميعة لأفضل وأروع خطوط الويب لسنة 2015

وبالنهاية أتمنى أن ينال هذا الموضوع إعجابك وأن يفيدك والسلام عليكم ورحمة الله تعالى وبركاته!
دمتم في رعاية الله وحفظه!