إضافة شريط أخر الأخبار في مدونة blogger - شرح تركيب شريط إخباري javestcrip 

في هذا المقال سوف أتطرق لي كيفية إضافة شريط آخر الأخبار في مدونة بلوجر وكيفية تركيبه حتى يصبح جاهز ويعمل. 

ماهو الشريط الإخباري    

أهمية شريط آخر الأخبار في مدونة بلوجر 

ماهي أضرار شريط آخر الأخبار على مدونة بلوجر 

كيفية تركيب شريط آخر الأخبار في مدونة بلوجر  

2️⃣ :  من بعد النقر عليه سوف تظهر تلك الصفحة ومن بعد النزول إلى الأسفل والنقر على تخطيط أو تنسيق كما في الصورة.

     كود تحريك النص HTML 

<script style='text/javascript'> function rssticker(t){for(var a=0;a<numeroposts;a++){entradas=t.feed.entry[a],titulosposts[a]=entradas.title.$t;for(var e=0;e<entradas.link.length;e++)if("alternate"==entradas.link[e].rel){enlaceposts[a]=entradas.link[e].href;break}}startrssticker()}function startrssticker(){postactual=-1,largoactual=0,enlaces=document.getElementById("enlace"),runticker()}function runticker(){var t;0==largoactual&&(postactual++,postactual%=numeroposts,titulo=titulosposts[postactual].replace(/"/g,'"'),enlace=enlaceposts[postactual],enlaces.href=enlace),enlaces.innerHTML=titulo.substring(0,largoactual),largoactual!=titulo.length?(largoactual++,t=retardocaracter):(largoactual=0,t=retardopost),setTimeout("runticker()",t)} var numeroposts = 7; //عدد المواضيع المرغوب ظهورها في الشريط var retardocaracter = 100; //عدد الأحرف var retardopost = 1; //التحكم بالسرعة var titulosposts = new Array(); var enlaceposts = new Array(); var entradas = ""; </script> <div class='rssticker'> <span class="encabezado">اخر الاخبار</span> <a id='enlace'></a> <script src='/feeds/posts/default?alt=json-in-script&callback=rssticker' style='text/javascript'></script> </div> <style> .rssticker{position:relative!important;width:100%;height:30px;overflow:hidden;white-space: nowrap;text-overflow: ellipsis;margin:0 auto;color:#fff;background:#fff;font-size:14px;float:right; font-family: 'Droid Arabic Kufi'line-height:40px;} .encabezado{display:inline-block;margin:0 0 0 10px;padding:0 10px;line-height:30px;background:#2388dc;float:right;box-sizing:border-box;} .rssticker a{color:#333;margin:0;padding:5px;float:right;text-decoration:none;} .rssticker a:hover{text-decoration:none;color:#2388dc;} </style>

عندما تلصق هذا الكود قم بتبديل رابط تلك المدونة برابط مدونتك.