اضافة شريط اخبار عاجلة متحرك اعلى مدونة بلوجر Breaking News

اضافة شريط اخبار عاجلة متحرك اعلى مدونة بلوجربشكل مميز وبدون اخطاء وعن تجربة .

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

اضافة شريط اخبار عاجلة من اهم اضافات بلوجر فهى تقوم بعرض اخر المشاركات المضافة فى مدونتك عن طريق عرض العناوين بشكل متغير ومنسق ودون ان تسبب اى ثقل للمدونة لأن الاكواد كاملة يتم وضعها داخل قالبك بدون رفع اكواد على استضافة اخرى فهى ملكا لك .

صورة لشكل الاضافة :

كما تلاحظون بالصورة السابقة شكل الاضافة بعد تركيبها فهى تعرض لكم عناوين المواضيع بشكل متغير متوالى فأذا كانت هذه الاضافة تريد وضعها فى مدونتك فعليك بمتابعة طريقة التركيب . 

شرح اضافة شريط اخبار عاجلة الى مدونة بلوجر 

قبل اضافة اى اكواد يجب اخذ نسخة احتياطية قبل وضع اى اكواد ومن هنا درس بسيط يعلمك طريقة اخذ نسخة احتياطية الان ناتى الى الطريقة فى البداية ادخل الى لوحة تحكم مدونتك ومن بعدها اضغط على القالب الأن اضغط على تحرير HTML

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

</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:25px;height:25px;background:#E1E1E1;overflow:hidden;margin-top:5px;}

#beakingnews .tulisbreaking{display:block;float:right;padding:0 7px;margin:0 0px 0 0;color:#FCFCFC;background:#CA2027}

#recentpostbreaking{float:right;padding:0 7px;margin:0 0px 0 0}

#recentpostbreaking ul,#recentpostbreaking li{list-style:none;margin:0;padding:0}

</style>

  </b:if></b:if>

     ملحوظة هامة :     

الكود المحدد باللون الأحمر خاص باللون محيط الاخبار

الكود المحدد باللون الازرق خاص بمحيط اخبار عاجلة 

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

</body>

ضع قبلة مباشرة هذا الكود :

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>

<b:if cond='data:blog.pageType != &quot;item&quot;'>

<script type='text/javascript'>

//<![CDATA[

$(document).ready(function () {

var url_blog = 'http://www.kingnt.com/', //replace with your Domain

    numpostx  = 10; //Posts want to display

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

     ملحوظة هامة :     

ضع رابط مدونتك مكان رابط مدونة كينج نت المحدد باللون الأحمر

بالاخير ضع هذا الكود فى اى مكان تريدة :

<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'>عاجل...</div><!-- tag tempat daftar Breaking News ditampilkan-->

</div><!-- tag penutup tempat Breaking News-->

  </b:if></b:if>

<div style='clear: both;'/>

     ملحوظة هامة :     

بأمكانك تغيير كلمة اخبار عاجلة الى كلمة اخرى من خلال الكلمة المحددة باللون الاحمر

اذا كنت تريد تغيير كلمة عاجل وهى تظهر اثناء عملية التحميل المحددة باللون الازرق

اتمنى بأن تدوينة اضافة شريط اخبار عاجلة متحرك اعلى مدونة بلوجر Breaking News افادات الجميع 

(( لا خير فى كاتم العلم ))