Cara Membua Headline Breaking News Untuk Blogger

Apa Itu Headline Breaking News - Untuk Memberitahu atau Menampilkan Postingan Terbaru dari Blog Kita. Contohnya Kalian Bisa Liat Di SS Bawah Ini Atau di Blog Saya Ini ....



Caranya Cukup Mudah ... Kalian Ikuti Langkah - langkah berikut ini :
  1. Kalian Login Dahulu Di Blogger.com
  2. Buka Tata Letak => Tambahkan Gadget
  3. Kemudian Pilih HTML/JavaScript 
  4. Copy Script Di Bawah ini dan Masukan Ke Dalam HTML/JavaScript 
  5. <!-- breaking news kangibay.net -->
    <style scoped='scoped' type='text/css'>
    #news { background:#4399cd; border-bottom: 4px solid #16e6e6; border-top: 0px solid #333; display: block; float: left; height: 30px; line-height: 25px; overflow: hidden; padding: 8px 0 0 0px; width: 100%; }
    .titlenews {color: #fff; display: block; float: left; font: bold 12px/22px Tahoma; padding: 6px 0 0 10px;margin: -7px 0 0 0; position: absolute; }
    #ltsposts {float: left;margin: -3px 0px 0px 137px;text-align: left;}
    #ltsposts ul,#ltsposts li{list-style:none;margin:0;padding:0;}
    #ltsposts li a { background: none !important; color:#fff !important; font: bold 12px/22px Tahoma; text-decoration: none; }
    ul.shsocial { background:#333; float: right; margin: -8px 0; }
    ul.shsocial li {float:left;list-style: none outside none;border:none;}
    ul.shsocial li a{background-color:transparent;background-image:url(http://4.bp.blogspot.com/-Pe-J5S7YCa0/UdXsJoN7GLI/AAAAAAAAL68/ongZAtcNF1E/s1600/spice-social-gadget-sprite.png);background-repeat:no-repeat;background-size:auto 96px;border:0 none;color:white;direction:ltr;display:block; height:32px;overflow:hidden;text-align:left;text-decoration:none;text-indent:-999em;transition:all 0.2s ease 0s;width:32px}
    ul.shsocial li.fb a{ background-position:0 0}
    ul.shsocial li.gp a{ background-position:-96px 0}
    ul.shsocial li.rs a{ background-position:-192px 0}
    ul.shsocial li.tw a{ background-position:-256px 0}
    ul.shsocial li.fb a:hover{ background-position:0 -32px}
    ul.shsocial li.gp a:hover{ background-position:-96px -32px}
    ul.shsocial li.rs a:hover{ background-position:-192px -32px}
    ul.shsocial li.tw a:hover{ background-position:-256px -32px}
    </style>

    <div id='news'><span class='titlenews'><i aria-hidden='true' class='fa fa-bookmark'/> RECENT <span style='color:#ebfb00;'>POSTS</span> :</i></span>
    <div id='ltsposts'>Wait...</div>
    </div>

    <script type='text/javascript'>
    //<![CDATA[
    $(document).ready(function () {
    var url_blog = 'http://blogdaimonz.blogspot.co.id/',
    numpostx     = 10;
    $.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>';
                $('#ltsposts').html(skeleton);
                function tick(){
                $('#ltsposts li:first').slideUp( function () { $(this).appendTo($('#ltsposts ul')).slideDown(); });
                }
            setInterval(function(){ tick () }, 3000); // kecepatan yang diinginkan
            } else {
                $('#ltsposts').html('<span>No result!</span>');
            }
        },
        error: function() {
                $('#ltsposts').html('<strong>Error Loading Feed!</strong>');
           }
    });
    });
    //]]>
    </script>
      KETERANGAN : 
      ~ RECENT - POSTS : Kalian Bisa Merubah Kata-kata Tersebut 
      ~ var url_blog = : Kalian Ganti Dengan Blog Kalian
      ~ numpostx     =  : Jumblah Postingan Yang Akan Muncul 

  6. Selesai Samua Kalian Ganti Tinggal Klik Simpan dan Liat Hasilnya ...
Kalian Yang Ingim Bertanya Tentang " Cara Membua Headline Breaking News Untuk Blogger "
Kalian Bisa Komen Di Bawah Atau Melalu Fanpage [FP-Daimon Z]

Belum ada Komentar untuk "Cara Membua Headline Breaking News Untuk Blogger"

Posting Komentar