• Posted by : Ariel Nicho May 31, 2013

    Cara Membuat Recent Comments Dengan Efek Marque/Bergerak
    SELAMAT DATANG DI -LAVIXTA STAR~BLOG-


    Hi sobat-sobat ku dimanapun anda berada.
    Berjumpa lagi di Lavixta Star Blog, blog sederhana saya.

    Kali ini saya akan mengshare satu tips yang sangat membantu yaitu 
    "Cara Membuat Recent Comment Keren - SEO".

    Pada artikel/posting saya sebelumnya, saya sudah mengshare bagaimana Cara Membuat Recent Comment Keren - SEO. Diposting tersebut saya memberikan efek lingkaran pada avatar/gambar profil sipengomentar. Dan saya memberikan juga efek dengan javascript SEO - agar tidak menambah berat blog sobat.

    Kali ini saya akan merubah efeknya dengan menambahkan efek marque, yang artinya widget Recent Commentsnya akan bergerak dari bawah ke atas. Widget ini akan terlihat lebih keren karena ada efek marque tersebut, widget ini bukan seperti widget yang sebelumnya yang hanya terdiam, tetapi widget ini akan bergerak terus.

    Penasaran? Berikut ulasannya untuk anda.

    Feature
    • Membantu admin untuk meninjau komentar yang baru
    • Membantu visitors untuk seberapa menariknya artikel tersebut sehingga ramai komentar
    • Sangat user friendly ( tidak merepotkan siapapun dalam menggunakannya )
    requirements
    • Koneksi yang lancar
    • Internet Browser yang memadai
    • Berpengalaman dalam mengedit HTML atau sejenisnya
    • Sediakan minuman segar dan cemilan ringan untuk merilekskan pikiran

    screenshot & Demo
    Screen Shot General Mode
    Screen Shot Hover Mode


    View Demo


    • Loggin di blogger.com
    • Tentukan blog yang akan dimodifikasi
    • Dari Dasbor, pilih "Tata Letak"
    • Pastikan terlebih dahulu dimana widget akan ditampilkan.
    • Jika sudah, klik "Tambah Gadget"
    • Pilih "HTML/JavaScript"
    Lihat gambar untuk lebih jelas :

    Gambar 1 : Pilihan menu "Tata Letak" pada dasbor
    Gambar 2 : Pilihan "Tambah Gadget" pada halaman Tata Letak
    Gambar 3 : Pilihan "HTML/JavaScript" pada halaman Tambah Gadget,
    klik kotak biru tsb untuk menambah Widget/Gadget baru.
    • Copy dan letakkan kode dibawah ini pada kotak kontennya

    Code
    <style type='text/css'>
    #LVkomen{background:aqua;box-shadow:0px 0px 30px 0px black, 0px 0px 20px 0px blue;color:black;text-shadow:0px 0px 0px 15px white;padding: 4px 4px 4px 4px;border-radius: 15px;}
    #LVkomen:hover {background:black;box-shadow:0px 0px 30px 0px aqua, 0px 0px 20px 0px blue, 1px 1px 10px 1px black; color:white; text-shadow: 1px 1px 15px aqua, 2px 2px 10px white;}
    .rcw-comments a {text-transform: capitalize;color:white; text-shadow:1px 0px 10px red, 0px 0px 10px violet;} 
    .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;box-shadow: 0px 0px 5px 0px white;}
    </style><div id="LVkomen">
    <marquee align='left' direction='up' height='300' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='3' width='100%'><script style=text/javascript src=http://lavixtastar-code.googlecode.com/files/lavixtastar-moving-recent-comments.js></script><script style=text/javascript >var a_rc=10;var m_rc=false;var n_rc=true;var o_rc=100;</script>
    <script src=http://lavixtastar.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></marquee></div></script></marquee></div>
    <script>
    document.write("<div style=\"display:scroll;position:fixed;top:0;left:0;color:black;font-size:1px;\"><a href=\"http:\/\/lavixtastar.blogspot.com\">.<\/a><\/div>");
    </script>

    height='300' → berfungsi untuk mengatur tinggi widgetnya, sobat bisa mengganti 300 dengan sesuka sobat.
    width='100%' → berfungsi untuk mengatur lebar widgetnya, sobat bisa mengganti 100% dengan sesuka sobat.
    var a_rc=10 → berfungsi untuk mengatur banyaknya komentar yang akan ditampilkan, sobat bisa mengganti 10 dengan sesuka sobat.
    var o_rc=100 → berfungsi untuk mengatur banyaknya karakter yang akan ditampilkan, sobat bisa mengganti 100 dengan sesuka sobat.
    Ganti lavixtastar.blogspot.com dengan URL/alamat blog/web sobat.

    SEBAIKNYA KETERANGAN KE-1 - 4 TIDAK PERLU DIRUBAH, AGAR HASILNYA LEBIH MEMUASKAN.

    • Jika sudah, klik "Simpan" untuk menyimpan gadget/widget yang telah dibuat.
    • Coba sobat buka blog sobat, dan... TAADDAAA... selamat, widgetnya sudah terpasang diblog sobat!



    Kerusakan template dan teknis lainnya tidak menjadi tanggung jawab Lavixta Star ~ Blog's.





    Sekian dulu pemberitahuan dari saya..
    See you in my next pages..
    Bye gan..!!


    *jangan lupa komentarnya ya gan.. :D

    Terima Kasih atas kunjungannya DI -LAVIXTA STAR~BLOG- God Blees U.

    { 6 comments... read them below or Comment }

    1. nice artikel gan ,, sangat membantu bwt blog saya ne .. :-q
      follow balik ya gan my blog baru bwt gan ,, http://blogharun26.blogspot.com/

      ReplyDelete
    2. thx ilmunya gan,, salam kenal dari saya http://zainelhasany.blogspot.com/

      ReplyDelete
    3. Asyik brow hasilnya, cuma mau tanya gimana cara ngilangin bayangan pada kotaknya.....

      ReplyDelete
    4. Info yang bermanfaat gan...
      Thanks gan...

      ReplyDelete
    5. gimana caranya kalo komennya gak pake muter alias tetep diem + ngasih scroll gimana ya mas?
      biar lebih ga ribet gitu ngeliat komennya :|

      ReplyDelete
    Peraturan yang harus diikuti ketika membuat komentar :
    1. Tidak Membuat Link Aktif
    2. Tidak SPAM
    3. Menggunakan Bahasa Yang Sopan
    4. Tidak Berhubungan Dengan SARA, Seks, dan Judi

    Selamat Berkomentar..
    Terima Kasih Atas Kerjasamanya.. ^_^

    Show Konversi KodeHide Konversi Kode Show Emoticon

  • Copyright © 2013 - Nisekoi - All Right Reserved

    ANS Home Powered by Blogger - Designed by Johanes Djogan