- Halo sobat setia pengunjung share pengalaman, Pada artikel kali ini aku akan mengembangkan sebuah tutorial cara menciptakan breaking news di blog dengan gampang akan aku berikan tutorialnya kepada semua teman-teman.
Sebelum kita lanjut pada langkah-langkah cara menciptakan breaking news lebih mendalam lagi, aku akan memperlihatkan delusi dari tampilan breaking news yang sedang kita bahas di dalam artikel ini.
Breaking news ialah sebuah kata dari bahasa inggris yang dapat diartikan ke dalam bahasa indonesia info terbaru. Breaking news yang akan kita buat nantinya akan tampil di bab atas tampilan blog, kalian juga dapat mengaturnya ditempat lain, tapi aku sarankan di atas tampilan pertama yang gampang untuk dilihat oleh para pengunjun, maka mereka juga akan mengetahui update artikel terbaru dari blog tersebut dengan pengaruh judul artikel tampilan slow berjalan-jalan.
Jika memang sudah mengenal apa itu breaking news, pribadi saja kita masuk pada tahap cara menciptakan breaking news di blog, simak langka-langkah di bawah ini.
Cara Membuat Breaking News Di Blog
- Pertama-tama silahkan masuk ke halaman www.blogger.com
- Selanjutnya silahkan klik hidangan Tema > Edit Html.
- Silahkan cari isyarat </head> dan pastekan isyarat di bawah ini di bab atas isyarat </head>.
<style scoped='scoped' type='text/css'> #news { background:#49505a; border-bottom: 4px solid #1194f2; border-top: 0px solid #333; display: block; float: left; height: 25px; 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: -2px 0px 0px 150px;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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFAs_RJX1luwMaGk1zbIIxJ69CSnwU-s7ZLBKrOmjmoXUXsrWXCQlLvqgYbW_ByedN8tZlENT7mftBg1kLjlEq4QchyphenhyphengAh_3Dfjg2K6I8-UYXWn5j1blim3iSAP2VqZ96vdJ7X8l2rQvHZ/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-newspaper-o fa-lg'/> BREAKING <span style='color:#ff4f4f;'>NEWS</span> :</span> <div id='ltsposts'> Loading...</div> </div> <script type='text/javascript'> //<![CDATA[ $(document).ready(function () { var url_blog = 'http://www.nama blog anda.com/', // Ganti dengan URL blog agan numpostx = 10; // Maximum info 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> - Selanjutnya silahkan klik Simpan Templeat dan pribadi lihat hasilnya.
Demikianlah artikel cara menciptakan breaking news di blog supaya dapat menjadi bermafaat, sekian dan terimakasih.