Pada artikel sebelumnya pernah kami tuliskan cara menciptakan breaking news pada blog, hanya saja instruksi yang digunakan untuk widget breaking news pada artikel tersebut sudah tidak berfungsi lagi. Nah, pada kesempatan ini kami akan menuliskan kembali cara menciptakan breaking news atau headline news pada blog. Konsep headline news hampir sama dengan widget artikel terbaru, bedanya widget artikel terbaru biasanya diletakkan pada sidebar blog sedangkan headline news biasanya terpasang dibawah header atau hidangan tab sebuah blog, apalagi dengan tampilan judul artikel berjalan pada headline news akan mempercantik tampilan blog.
Langsung saja berikut cara menciptakan headline news pada Blog :
1. Login akun blogger Anda.
2. Pilih hidangan tab Tema >> Klik Edit HTML.
3. Kemudian cari instruksi </head> (Gunakan Ctrl+F untuk mempercepat pencarian)
4. Copy paste instruksi berikut diatas instruksi </head>
Ganti namablog.blogspot.com dengan URL blog Anda.
Ganti angka var jumlah_post = 9; untuk menampilkan jumlah posting yang ditampilkan.
Ganti angka var marquee_speed =”5”; untuk memilih kecepatan text berjalan.
Ganti var close_button=false menjadi var close_button=true untuk menampilkan tombol close.
5. Selanjutnya cari instruksi </body> copy paste instruksi berikut diatas </body>
7. Kemudian untuk menampilkan headline news, copy paste instruksi berikut pada HTML/JavaScript dengan cara masuk ke hidangan tab blogger Tata Letak >> Tambahkan Gadget >> HTML/JavaScript, letakkan dibawah hidangan navigasi atau footer.
Nah, itu tadi cara menciptakan headline news pada blogger, cukup gampang kan? Dapat Anda praktekkan pada blog dan supaya berhasil.
Langsung saja berikut cara menciptakan headline news pada Blog :
1. Login akun blogger Anda.
2. Pilih hidangan tab Tema >> Klik Edit HTML.
3. Kemudian cari instruksi </head> (Gunakan Ctrl+F untuk mempercepat pencarian)
4. Copy paste instruksi berikut diatas instruksi </head>
<style type="text/css">
/*Breaking News id-pemula.blogspot.com*/
#breaking-newsticker{margin:15px 0;position:relative}
#post_breakingnews{position:relative;z-index:9;overflow:hidden;padding:8px;width:100%!important;box-sizing:border-box;box-shadow:0 5px 5px -5px #3339}
.breakingnewstitle{float:left;background-color:#f54b4b;color:#fff;padding:7px 10px;font-weight:bold;border-radius:4px;text-transform:uppercase;position:relative}
.breakingnewstitle:after{height:0;width:0;position:absolute;content:" ";pointer-events:none;margin-top:1px;border-left:13px solid #f54b4b;border-top:10px solid transparent;border-bottom:10px solid transparent;-moz-transform:scale(.9999);margin-left:9px;z-index:9}
.breakingnews marquee{width:80%;position:absolute}
@media screen and (max-width:800px){.breakingnews marquee{width:70%}}
@media screen and (max-width:500px){.breakingnews .breakingnewstitle{width:90px;font-size:11px;font-weight:normal}.breakingnews .breakingnewstitle:after{content:none}.breakingnews marquee{width:55%}}
.breakingnews marquee a{color:#1893fc;margin:0 15px;line-height:2}
#post_breakingnews .breakingnews{width:1120px;max-width:100%;margin:0 auto}
</style>
<script type='text/j4vascript'>
var url_breaking = "https://namablog.blogspot.com";
var jumlah_post = 9;
var marquee_speed = "5";
var close_button = false;
var info_text = true;
</script>
Keterangan : /*Breaking News id-pemula.blogspot.com*/
#breaking-newsticker{margin:15px 0;position:relative}
#post_breakingnews{position:relative;z-index:9;overflow:hidden;padding:8px;width:100%!important;box-sizing:border-box;box-shadow:0 5px 5px -5px #3339}
.breakingnewstitle{float:left;background-color:#f54b4b;color:#fff;padding:7px 10px;font-weight:bold;border-radius:4px;text-transform:uppercase;position:relative}
.breakingnewstitle:after{height:0;width:0;position:absolute;content:" ";pointer-events:none;margin-top:1px;border-left:13px solid #f54b4b;border-top:10px solid transparent;border-bottom:10px solid transparent;-moz-transform:scale(.9999);margin-left:9px;z-index:9}
.breakingnews marquee{width:80%;position:absolute}
@media screen and (max-width:800px){.breakingnews marquee{width:70%}}
@media screen and (max-width:500px){.breakingnews .breakingnewstitle{width:90px;font-size:11px;font-weight:normal}.breakingnews .breakingnewstitle:after{content:none}.breakingnews marquee{width:55%}}
.breakingnews marquee a{color:#1893fc;margin:0 15px;line-height:2}
#post_breakingnews .breakingnews{width:1120px;max-width:100%;margin:0 auto}
</style>
<script type='text/j4vascript'>
var url_breaking = "https://namablog.blogspot.com";
var jumlah_post = 9;
var marquee_speed = "5";
var close_button = false;
var info_text = true;
</script>
Ganti namablog.blogspot.com dengan URL blog Anda.
Ganti angka var jumlah_post = 9; untuk menampilkan jumlah posting yang ditampilkan.
Ganti angka var marquee_speed =”5”; untuk memilih kecepatan text berjalan.
Ganti var close_button=false menjadi var close_button=true untuk menampilkan tombol close.
5. Selanjutnya cari instruksi </body> copy paste instruksi berikut diatas </body>
<script src='http://yourj4vascript.com/153651797/breakingnews-idpemula.js' type='text/j4vascript'></script>
<script type='text/j4vascript'>
//<![CDATA[
document.getElementById("breaking-newsticker").appendChild(document.getElementById("post_breakingnews"));
//]]>
</script>
6. Terakhir Simpan tema. <script type='text/j4vascript'>
//<![CDATA[
document.getElementById("breaking-newsticker").appendChild(document.getElementById("post_breakingnews"));
//]]>
</script>
7. Kemudian untuk menampilkan headline news, copy paste instruksi berikut pada HTML/JavaScript dengan cara masuk ke hidangan tab blogger Tata Letak >> Tambahkan Gadget >> HTML/JavaScript, letakkan dibawah hidangan navigasi atau footer.
<div id='breaking-newsticker'/>
8. Kemudian klik Simpan. Nah, itu tadi cara menciptakan headline news pada blogger, cukup gampang kan? Dapat Anda praktekkan pada blog dan supaya berhasil.
Sumber http://id-pemula.blogspot.com
