Artikel terbaru,klik untuk membaca
loading...
  • Kode HTML widget breaking news untuk blogger

    loading...
    Pada halaman ini saya menulis artikel dengan judul kode HTML widget breaking news untuk blogger

    Widget breaking news ini mempunyai tampilan teks bergerak dari bawah ke atas dan teks tersebut adalah judul posting artikel blog atau situs yang memasang widget ini

    Widget ini berfungsi sebagai sarana promosi artikel blog kepada pengunjung blog atau situs karena penempatannya berada di bagian atas dari tubuh blog atau situs

    Apabila anda tertarik untuk memasangnya di blog anda silahkan copy kode HTML widget breaking news untuk blogger di bawah ini

    <!-- breaking news sampingkanan.com -->
    <style scoped='scoped' type='text/css'>
    #news { background:#2a474c; border-bottom: 1px solid #ff0000; border-top: 0px solid #333; display: block; float: left; height: 60px; 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'/> BREAKING <span style='color:#E6A816;'>NEWS</span> :</span>
    <div id='ltsposts'>Loading...</div>
    </div>

    <script type='text/javascript'>
    //<![CDATA[
    $(document).ready(function () {
    var url_blog = 'URL BLOG ANDA', // Ganti dengan URL blog anda
    numpostx     = 10; // Maximum berita yang akan muncul
    $.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> 



    Untuk memasangnya di blog atau situs anda silahkan membaca panduannya pada artikel saya yang berjudul cara membuat widget breaking news untuk blogger

    Demikian semoga bisa mendatangkan manfaat
    loading...
  • Menarik untuk di baca

Berlangganan posting sampingkanan.com

Di kirim oleh
FeedBurner

Donasi