Membuat Komentar Terbaru dengan Gambar

Halo sobat blog trik dan tips, kali ini kita akan membuat komentar terbaru dengan gambar. Widget ini menggunakan javascript dan sangat mudah untuk diinstal. Sobat dapat memasang widget ini pada blog anda untuk sekedar memperindah atau mempercantik blog. Anda dapat mengetahui apabila seseorang berkomentar pada blog anda. Gambar komentator ditampilkan dalam bentuk lingkaran sehingga memberikan efek yang sangat menarik. Jika sobat ingin memasangnya pada blog ikuti langkah berikut ini:

1. Login ke Blogger
2. Masuk ke Rancangan --> Edit Laman
3. Tambahkan gadjet lalu pilih HTML/Javascript
4. Masukan kode berikut ini:

<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 30,
roundAvatar = true,
characters = 30,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b-recent-comments-w-gravatar.js"></script>
<script type="text/javascript" src="http://blogtrikdantips.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

5. Selanjutnya sobat tinggal menganti kode berwarna merah dengan url blog anda.
6. Jika sobat ingin mengedit tampilan widget ini berikut adalah penjelasannya:
- Kode berwarna hijau adalah jumlah komentar yang ditampilkan
- Kode berwarna biru aadalah ukuran gambar komentator
- Kode berwarna orens adalah rincian komentar dari komentator
7. Terakhir simpan gadjet anda.

Demikian adalah sekilas penjelasan bagaimana membuat komentar terbaru dengan gambar atau istilah lainnya yaitu membuat recent comment dengan avatar. Semoga dengan widget ini tampilan blog anda lebih menarik serta lebih banyak yang berkomentar. Sekian dan salam blogging....

Komentar , Tips dan Triks

Membuat Komentar Area Paling Keren ala IntenseDebate

Blog Trik dan Tips ingin memberikan apresiasi serta 2 jempol untuk IntenseDebate karena telah mengembangkan komentar area dengan fitur yang sangat menarik. Untuk membuat komentar area menjadi stylis biasanya membutuhkan banyak waktu untuk mengedit template anda, namun dengan IntenseDebate, anda bisa membuat komentar area menjadi lebih mudah dan terlihat keren. Pengunjung yang datang ke blog anda akan memperoleh kemudahan serta menyukai komentar area yang anda miliki. Beberapa fitur yang ditawarkan IntenseDebate yaitu, threaded comment, email notifikasi, profil komentator, moderasi serta blacklist, open id, integrasi twitter, facebook dan rss, plugin api, dan widget. Jika sobat tertarik untuk membuatnya ikuti petunjuk dibawah ini:

1. Simpan template anda terlebih dahulu untuk mencegah terjadi kesalahan editing
2. Kunjungi situs IntenseDebate lalu daftarkan diri anda (Isi Username, password, email)
3. Lakukan konfirmasi email untuk aktivasi akun IntenseDebate
4. Setelah itu instal IntenseDebate (masukan url blog anda)

5. Selanjutnya upload template blog anda ke IntanseDebate, dimana secara otomatis template anda akan dimodifikasi.
6. Kopi kode yang telah dimodifikasi
7. Lalu login ke Blogger, masuk ke Rancangan --> Edit HTML
8. Centang Expand Template Widget
9. Hapus semua kode tersebut lalu paste kode yang telah kita kopi dari IntenseDebate
10. Simpan template anda lalu lihat hasilnya

Mudah sajakan untuk membuat komentar area IntenseDebate pada blog anda. Anda juga dapat menambah widget dari intense debate seperti blog stat, komentar terbaru, popular blog post, top user widget dan my recent comment widget. Lengkap semua fiturnya yang pasti sangat bermanfaat. Demikian tutorial blog trik dan tips semoga bermanfaat.

Komentar , Widget

Cara Aktifkan dan Non-aktifkan Kotak Komentar

Salah satu cara untuk berinteraksi dengan pengunjung pada blog yang anda kelola yaitu dengan mengaktifkan kotak komentar. Dengan mengaktifkan komentar maka pengunjung blog akan memiliki pilihan untuk menanggapi posting yang anda terbitkan. Jika anda menggunakan template blogger yang baru maka kini blogger telah mendukung threaded komentar. Kotak komentar ada berbagai macam tampilan, misalnya ada yang berbentuk pop-up, dibawah entri, atau full entri. Ada juga sebagian blog yang memilih untuk menyembunyikan kotak komentar blogger mereka. Tentunya hal ini dikarenakan mereka telah menggunakan kotak komentar lain misalnya kotak komentar facebook. Jika sobat ingin mengaktifkan atau menonaktifkan kotak komentar maka ikuti langkahnya dibawah ini:

1. Log in ke Blogger
2. Masuk ke Setelan lalu pilih tab Komentar

3. Jika anda ingin menampilkan kotak komentar maka pilih "Tampilkan", namun jika ingin disembunyikan pilih "Sembunyikan"
4. Jangan lupa untuk Simpan Setelan di halaman bawah.

Demikian tutorial singkat dari saya semoga anda dapat terbantu. Jika anda pertanyaan yang ingin ditanyakan maka anda bisa kirimkan komentar anda pada blog saya. Terima kasih...

Komentar

Cara Menggunakan Komentar OpenID

Saat berkomentar sobat pasti sering menemukan blog yang mengijinkan pengunjung berkomentar dengan OpenID. OpenID adalah standar terbuka yang memungkinkan pengguna aktif layanan OpenID untuk login ke situs OpenID yang didukung dengan satu set login. User dengan OpenID dapat mengakses layanan komentar pada blog. Layanan OpenID pada blog anda merupaksan cara untuk mengotentikasi pengguna komentar di blog, tanpa memerlukan pembaca untuk memiliki akun Google. Contohnya, jika teman anda Upin dari Wordpress, yang tidak memiliki Akun Google. Dengan OpenID, ia dapat berkomentar di blog Anda menggunakan akses OpenID dan mengidentifikasi dirinya sebagai pemilik wordpress tersebut

Cara mengaktifkan layanan OpenID pada blog?
Untuk mengaktifkan layanan OpenID masuk ke Settings lalu pilih Komentar. Pada sebelah kiri halaman anda akan menemukan tulisan "siapa yang boleh berkomentar" lalu pilih "Pengguna Terdaftar - Termasuk OpenID". Setelah itu klik tombol "Simpan Pengaturan" di bagian bawah halaman. Jika anda memilih "Siapa pun" untuk berkomentar maka terkadang pengunjung dapat menggunakan komentar Anonim sehingga anda tidak dapat mengetahui orang yang berkomentar. Beberapa pengguna anonim terkadang menggunakan spam, atau kata-kata kotor pada kotak komentar anda. Jika anda ingin mencegahnya maka aktifkan "Pengguna Terdaftar"

Cara Menggunakan identitas OpenID?
Ketika anda berkunjung ke sebuah blog coba gunakan identitas OpenID ketika berkomentar. Caranya yaitu: pilih penyedia OpenID dari drop down menu di sebelah opsi "Sign-in", Jika penyedia OpenID tidak ada dalam daftar, silakan pilih "Setiap ID" pilihan. Selanjutnya, login dengan OpenID anda. Tulis komentar anda dan klik "Publikasikan Komentar Anda". Anda akan diarahkan ke penyedia OpenID Anda untuk mengotentikasi ID anda. Setelah otentikasi dengan provider, anda akan kembali ke halaman komentar dan secara otomatis komentar anda akan diposting.

Komentar

Cara Mengetahui Komentar Facebook yang Masuk di Blog

Jika anda mempunyai komentar facebook yang terpasang pada blog, maka anda akan bertanya bagaimana cara melihat komentar facebook yang masuk di blog. Ada pasti kesulitan menggunakan komentar facebook karena sulit mengetahui komentar terbaru yang masuk. Seringkali kita juga kesulitan untuk membalas komentar yang masuk bahkan tidak mengetahuinya. Hal ini disebabkan karena kita tidak menerima notifikasi apabila ada komentar yang masuk. Namun jangan cemas karena ada cara yang kita bisa lakukan untuk mengetahui komentar facebook yang masuk pada blog anda. Untuk itu ikuti tutorialnya dibawah ini:

1. Login ke facebook menggunakan akun sobat!
2. Masukan url dibawah ini di address bar anda

http://developers.facebook.com/tools/comments/?id=FACEBOOK_ID&view=queue

3. Ganti tulisan FACEBOOK_ID dengan ID facebook anda (kode berwarna merah)

4. Setelah itu anda akan masuk ke Alat Moderisasi Komentar -- (Komentar Publik)
5. Untuk melihat artikel atau posting klik Pandangan Moderator disini anda bisa memoderisasi komentar facabook yang masuk di blog
6. Sedangkan untuk pengaturan komentar anda bisa klik link Pengaturan disamping kanan browser
7. Untuk memudahkan anda dalam melihat komentar facebook yang masuk, dapat anda bookmark halaman tersebut.

Sekian tutorial dari saya, semoga dengan posting ini dapat membantu anda mengelola komentar facebook yang masuk pada blog anda. Semoga artikel ini bermanfaat dan selamat mencoba!

Komentar

Membuat Komentar Facebook Berdampingan dengan Komentar Blogger

Hai sob bagaimana kabar akhir pekan anda yang pasti menyenangkan bukan. Kebetulan karena suasana yang menyenangkan ini saya akan memberikan tutorial gimana cara membuat komentar facebook dan blogger berdampingan di blog anda. Trik yang satu ini udah saya terapkan di Blog trik dan Tips dan hasilnya sangat bagus. Oke langsung saja kita ikuti langkah-langkahnya ya: Apa itu Harlem Shake

1. Login ke Blogger
2. Masuk ke Rancangan --> Klik Edit HTML
3. Centang Expand Template Widget
4. Carilah kode <div class='comments' id='comments'>
5. Setelah ketemu paste kode dibawah ini dibawah kode <div class='comments' id='comments'>

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Komentar Facebook
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Komentar Blogger
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>

Keterangan: kode warna merah adalah lebar kotak komentar, tinggal anda sesuaikan

6. Kemudian letakkan kode dibawah ini diatas kode </head>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='BlogTrikDanTips' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>

7. Ganti ID Facebook (BlogTrikDanTips) dengan ID Facebook anda
8. Cari lagi kode /* atau #comments
9. Letakan kode berikut ini dibawah kode tadi

.comments-page { background-color: #f2f2f2;}
#blogger-comments-page { padding: 0px 5px; display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}

Sekian tutorial dari saya selamat mencobanya.

Komentar

Membuat Avatar pada Komentar Anonymous di Blog

Ada cara untuk mengganti gambar default anonymous komentar pengunjung ke gambar lain yang lebih menarik. Gambar atau avatar pada komentar dapat kita ganti dengan emoticon, gambar kaskus, dan lain-lain. Kita akan menggunakan script jquery sehingga mudah saja untuk memasangnya. Gambar tersebut akan muncul ketika sesorang tanpa id (anonymous) memberikan komentar pada blog anda. Penasaran bagaimana cara membuatnya, ikuti tutorial yang berikut ini: Apa itu Harlem Shake

1. Log in ke blogger.
2. Pilih Rancangan --> Edit HTML
3. Carilah kode </body>
4. Kemudian tambahkan kode dibawah ini diatas kode </body>

<!-- Avatar Komentar by www.blogtrikdantips.blogspot.com start --><script src='http://code.jquery.com/jquery-latest.js'/>
<script>
$("img[src='http://img1.blogblog.com/img/anon36.png']")
.attr('src', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEig2A3BJ6yCcFcmRu4Hpvxa65lX90wr0XW4wJ173QLLOOtowunlmcuGsZSj4sj1ae1o5QcH_D9_hUdLEDth5JzeHqa9HRQW5tBm4XXh11UKL4SJHzQjCLJ_CzsQ_eJM2aTHr2EjCLZnYIg/s1600/anon5.png')
.ssyby('blank')
</script><!-- Avatar Komentar by www.blogtrikdantips.blogspot.com end -->

Keterangan:
- Anda tidak perlu memasang script jquery seperti diatas apabila telah terpasang pada template anda.
- Anda dapat mengganti kode warna merah dengan url gambar yang anda inginkan

5. Simpan template anda lalu lihat hasilnya

Sekian trik dan tips dari saya. Semoga dengan penampilan avatar yang baru pada blog anda akan semakin menarik pengunjung untuk berkomentar. Semoga tutorial singkat ini bermanfaat, selamat mencoba.

Komentar

Membuat Tulisan Admin pada Komentar Anda

Biasanya kita menggunakan highlighter untuk membedakan komentar admin dan pengunjung. Namun ada cara lain untuk kita membuat komentar admin berbeda dengan komentar pengunjung, yaitu dengan membuat tulisan ADMIN pada sudut dari kotak komentar admin. Komentar admin ini akan berbeda pada threaded comments sehingga kita dapat membedakan antara pengujung dan admin. Untuk melihat contohnya anda bisa lihat digambar samping atau pada komentar di Blog Trik dan Tips. Jika anda ingin membuatnya ikuti langkah berikut ini: Apa itu Harlem Shake

1. Login ke Blogger
2. Masuk ke Rancangan --> Klik Edit HTML
3. Cari kode </body>
4. Paste kode dibawah ini diatas kode </body>

<script src='http://code.jquery.com/jquery-latest.js'/>
<!-- Admin comments by www.blogtrikdantips.blogspot.com start-->
<script>
$(function() {
function highlight(){
$('.user.blog-author,.ssyby').closest('.comment-block')
.css('border', '1px solid #e1e1e1')
.css('background','#f1f1f1 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgThKwXUMle_c8vb-S_qxp1WEWIgSZCM05yvnzVUqEGhy8m27-03qggpsCpYKUQ-6OtbsXosPojjl-ancpazuGMBVPGz1LxsQDd9flmtIqNpm2k_YFfZguZZHulhe3PmRd745iD13sCOEY/s1600/admin2.png") no-repeat bottom right')
.css('padding', '10px');
}
$(document).bind('ready scroll click', highlight);
});
</script>
<!-- Admin comments ends -->

Keterangan:
- kode merah adalah garis pinggir
- kode biru adalah warna background
- kode hijau adalah gambar tulisan admin
- kode orens adalah jarak garis pinggir ke tulisan

5. Terakhir simpan template anda lalu lihat hasilnya

Sangat mudah kan untuk membuat tulisan komentar admin di daftar komentar blog anda. Silahkan dicoba aja yang pasti akan membuat blog anda semakin tambah bagus untuk dilihat.

Komentar