Iklan Billboard 970x250

Cara Membuat Breaking News di Blogger

Iklan 728x90

Cara Membuat Breaking News di Blogger

Cara Membuat Breaking News di Blogger

kali ini blog haliminfo akan berbagi widget artikel terbaru yang dikemas atau ditampilkan dengan model breaking news berjalan diblogger. .

widget ini mengambil artikel terbaru dari blog atau web kita, yang memiliki tampilan seperti berita berjalan di acara-acara tv, dalam widget breaking news ini hanya menampilkan judul dari artikel-artikel terbaru di blog kita, tanpa adanya thumbnail atau yang lainya.

buat sobat yang ingin mencoba widget ini silahkan ikuti langkah-langkah dibawah ini.

1. buka blogger sobat dan edit html dari template yang sobat pakai.
2. cari dan temukan kode </body>
3. pastekan kode dibawah ini tepat diatas atau sebelum kode </body>
<!-- Breaking News -->
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<script src='https://raw.githack.com/halim04/BreakingNews/master/breakinpixie.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){0==$(".blog-posts").has("article").length&&$(".blog-pager").remove()});
// Breaking News
document.getElementById("breaking-newsticker").appendChild(document.getElementById("post_breakingnews"));
//]]>
</script>
</b:if>
4. jika sudah cari lagi kode ]]></b:skin> dan latakan kode dibawah ini tepat diatasnya
/* Breaking News */
#breaking-newsticker{margin:20px auto 0 auto;position:relative}
#post_breakingnews{padding:10px;position:relative;z-index:9;overflow:hidden;width:100%;border:1px solid rgba(0,0,0,0.08)}
.breakingnewstitle{background:#111;float:left;color:#fff;text-transform:uppercase;padding:7px 15px;letter-spacing:1px;position:relative;font-weight:700;font-size:13px;border-radius:2px;margin:0 10px 0 0}
.breakingnews marquee{color:#888;width:83%;font-size:12px;font-weight:400;position:absolute;bottom:12px;}
.breakingnews marquee a{color:#888;margin:0 15px;line-height:2;transition:all .6s}.breakingnews marquee a:hover{color:#222}
@media screen and (max-width:800px){.breakingnews marquee{width:80%}}
@media screen and (max-width:500px){.breakingnews .breakingnewstitle{font-size:11px;padding:7px 10px}}
5. cari dan temukan lagi kode </head>
6. letakan lagi kode dibawah ini tepat diatasnya.
<!-- Breaking News -->
<script type='text/javascript'>
var url_breaking = &quot;/&quot;;
var jumlah_post = 10;
var marquee_speed = &quot;4&quot;;
var close_button = false;
var info_text = true;
</script>
7. untuk kode yang terakhir ini bersifat optional, teman-teman bebas mau meletaannya dimana saja sesuai keinginan sobat sendiri.
<!-- Breaking News -->
<div id='breaking-newsticker'/>

kode diatas diambil dari temlate Viral Go 3 dari arlina design. untuk melihat hasilnya silahkan lihat pada blog berikut.
SHARE

Related Posts

Subscribe to get free updates

Post a Comment

Iklan Tengah Post

get more nice stuff
in your inbox

instantly by Subscribing to us. So you will get email everytime we post something new here

Contact Form

Name

Email *

Message *