Pada artikel ini saya ingin memposting sedikit tentang cara membuat running text pada bagian bawah (footer) blog seperti pada gambar di bawah ini :
Pada gambar di atas terdapat 2 tulisan yang berbeda. Nah untuk Tulisan Pertama yang ada panahnya berwarna PINK kode Teks Scriptnya seperti ini :
Langkah-langkahnya seperti di bawah ini:
Berikut adalah langkah-langkahnya :
1. Pertama kali yang harus kita lakukan adalah login ke blogger
2. Pada menu Design -> Edit HTML
3. Letakkan kode dibawah ini diatas kode </body>
4. Dan Copy kode di atas dan letakan di atas kode </body>.
Untuk Tulisan yang berwarna Merah bisa kamu ganti sesuai dengan keinginan sendiri. Mulai dari warna tulisan (color), ukuran huruf (font-size), kecepatan tulisan (scrollamount) dan pergerakan arah tulisan (direction) dan untuk tulisan yang berwarna Biru kamu ganti isi Teksnya dan hasilnya seperti di bawah ini :
Sekarang untuk Tulisan Kedua yang ada panahnya berwarna HIJAU merupakan running text yang akan menampilkan postingan-postingan terbaru secara otomatis dan kode Teks Scriptnya seperti ini :
Langkah-langkahnya sama seperti di atas:
Berikut adalah langkah-langkahnya :
1. Pertama kali yang harus kita lakukan adalah login ke blogger
2. Pada menu Design -> Edit HTML
3. Dan Copy kode di atas dan letakan di bagian bawah mana aja. Kalau di blog ini saya letakan di atas kode <b:section-contents id='sidebar-left-1'>. Kode ini adanya di bagian bawah.
Untuk Tulisan yang berwarna Merah bisa kamu ganti sesuai dengan keinginan sendiri dan linknya juga bisa kamu ganti dengan link blog kamu. Cuma itu saja yang bisa saya sampaikan. Sekian dulu dari saya, selamat mencoba dan semoga berhasil. Terima kasih.
Pada gambar di atas terdapat 2 tulisan yang berbeda. Nah untuk Tulisan Pertama yang ada panahnya berwarna PINK kode Teks Scriptnya seperti ini :
<div id='running_teks' style='' width='100%'>
<marquee align='center' direction='left' scrollamount='5' style='font-size: 16px; color: #FF6600'>
<span style='font-family: Times,"Times New Roman",serif;'>
<span style='font-weight:bold;'>ISI TEKS</span></span>
</marquee></div>
<marquee align='center' direction='left' scrollamount='5' style='font-size: 16px; color: #FF6600'>
<span style='font-family: Times,"Times New Roman",serif;'>
<span style='font-weight:bold;'>ISI TEKS</span></span>
</marquee></div>
Langkah-langkahnya seperti di bawah ini:
Berikut adalah langkah-langkahnya :
1. Pertama kali yang harus kita lakukan adalah login ke blogger
2. Pada menu Design -> Edit HTML
3. Letakkan kode dibawah ini diatas kode </body>
4. Dan Copy kode di atas dan letakan di atas kode </body>.
Untuk Tulisan yang berwarna Merah bisa kamu ganti sesuai dengan keinginan sendiri. Mulai dari warna tulisan (color), ukuran huruf (font-size), kecepatan tulisan (scrollamount) dan pergerakan arah tulisan (direction) dan untuk tulisan yang berwarna Biru kamu ganti isi Teksnya dan hasilnya seperti di bawah ini :
Sekarang untuk Tulisan Kedua yang ada panahnya berwarna HIJAU merupakan running text yang akan menampilkan postingan-postingan terbaru secara otomatis dan kode Teks Scriptnya seperti ini :
<script type="text/javascript">
var jnWidth="100";
var jnScrollAmount="10";
<!--kecepatan running text-->
var jnScrollDelay="100";
<!--arah running text-->
var jnDirection="left";
var jntargetlink="yes";
<!--jumlah post terbaru yg akan ditampilkan-->
var jnnumPosts="6";
<!--simbol sebelum post running text-->
var jnBulletchar =">>>";
<!--menggunakan background gambar sebagai pengganti simbol panah-->
var jnimagebullet="no";
<!--jika menggunakan gambar untuk pengganti panah, maka letakkan di sini gambarnya-->
var jnimgurl="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4uEshgWxmIf0TIVBJou9Yrkj9Dhr73HKibcTnEy5PzpDrmhK2M01U6m9tR7nSI41nVCBjhpt5icmbQJdVSiUtyiy29ftLBaRp3a-ktl9wBp6vmud3bhzp6E7VEpWHFzavlpznhIQf-uB4/s1600/arrowe.gif";
<!--ukuran huruf-->
var jnfontsize="14";
<!--warna running text background-->
var jnbgcolor="FFFFFF";
<!--warna tulisan-->
var jnlinkcolor="2aace3";
<!--warna ketika mouse hover-->
var jnlinkhovercolor="FF6600";
</script>
<!--script-->
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/scrolling-recent/scrolling-recent-v3-ycode.js" type="text/javascript"></script>
<script src="http://warnetdjnet568.blogspot.co.id/feeds/posts/default?alt=json-in-script&callback=jnAdvRecentPostsScrollerv3&max-results="6" type="text/javascript"></script>
var jnWidth="100";
var jnScrollAmount="10";
<!--kecepatan running text-->
var jnScrollDelay="100";
<!--arah running text-->
var jnDirection="left";
var jntargetlink="yes";
<!--jumlah post terbaru yg akan ditampilkan-->
var jnnumPosts="6";
<!--simbol sebelum post running text-->
var jnBulletchar =">>>";
<!--menggunakan background gambar sebagai pengganti simbol panah-->
var jnimagebullet="no";
<!--jika menggunakan gambar untuk pengganti panah, maka letakkan di sini gambarnya-->
var jnimgurl="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4uEshgWxmIf0TIVBJou9Yrkj9Dhr73HKibcTnEy5PzpDrmhK2M01U6m9tR7nSI41nVCBjhpt5icmbQJdVSiUtyiy29ftLBaRp3a-ktl9wBp6vmud3bhzp6E7VEpWHFzavlpznhIQf-uB4/s1600/arrowe.gif";
<!--ukuran huruf-->
var jnfontsize="14";
<!--warna running text background-->
var jnbgcolor="FFFFFF";
<!--warna tulisan-->
var jnlinkcolor="2aace3";
<!--warna ketika mouse hover-->
var jnlinkhovercolor="FF6600";
</script>
<!--script-->
<script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/scrolling-recent/scrolling-recent-v3-ycode.js" type="text/javascript"></script>
<script src="http://warnetdjnet568.blogspot.co.id/feeds/posts/default?alt=json-in-script&callback=jnAdvRecentPostsScrollerv3&max-results="6" type="text/javascript"></script>
Langkah-langkahnya sama seperti di atas:
Berikut adalah langkah-langkahnya :
1. Pertama kali yang harus kita lakukan adalah login ke blogger
2. Pada menu Design -> Edit HTML
3. Dan Copy kode di atas dan letakan di bagian bawah mana aja. Kalau di blog ini saya letakan di atas kode <b:section-contents id='sidebar-left-1'>. Kode ini adanya di bagian bawah.
Untuk Tulisan yang berwarna Merah bisa kamu ganti sesuai dengan keinginan sendiri dan linknya juga bisa kamu ganti dengan link blog kamu. Cuma itu saja yang bisa saya sampaikan. Sekian dulu dari saya, selamat mencoba dan semoga berhasil. Terima kasih.
thx u gan
BalasHapusiya sama2.....
Hapus