Tampilkan postingan dengan label komentar. Tampilkan semua postingan
Cara Memasang Tombol Buka Komentar Blog ini merupakan penggabungan yang saya gunakan dengan memanfaatkan kode buka tutup atau yang biasa disebut spoiler yang sudah banyak beredar di internet. Dan ini memasang tombol buka tutup di kotak komentar ini saya dapakan ketika berkunjung ke beberapa blog yang saya dapati menggunakan tombol buka tutup ini. Ternyata banyak juga teman-teman blogger yang telah memasang tombol buka tutup di kotak komentar blog mereka.
Saya pun mencoba melihat kode yang digunakan dalam memasang tombol buka tutup komentar tersebut ternyata kode yang terpasang sedikit membuat kening saya berkerut, berpikir... hmm kodenya seperti itu ya, menggunakan script,, bagaimana kalau tidak menggunakan script ya? saya pun berpikir lagi dan ting! Dapat! Tanpa menggunakan script, kita bisa memanipulasi tampilan dari tombol buka tutup untuk komentar blog ini seperti contoh berikut ini
Jadi, tombol buka tutup ini tidak menyembunyikan komentar yang telah ada tapi hanya menutup kotak komentarnya saja atau hanya mengganti link Poskan Komentar
Berikut Cara Memasang Tombol Buka Tutup di Kotak Komentar
Saya pun mencoba melihat kode yang digunakan dalam memasang tombol buka tutup komentar tersebut ternyata kode yang terpasang sedikit membuat kening saya berkerut, berpikir... hmm kodenya seperti itu ya, menggunakan script,, bagaimana kalau tidak menggunakan script ya? saya pun berpikir lagi dan ting! Dapat! Tanpa menggunakan script, kita bisa memanipulasi tampilan dari tombol buka tutup untuk komentar blog ini seperti contoh berikut ini
Jadi, tombol buka tutup ini tidak menyembunyikan komentar yang telah ada tapi hanya menutup kotak komentarnya saja atau hanya mengganti link Poskan Komentar
Berikut Cara Memasang Tombol Buka Tutup di Kotak Komentar
- Masuk ke akun Blogger anda
- Pilih menu Template >> Edit HTML >> centeng Expands Widget Template >> tekan tombol Ctrl+F di keyboard
- Cari kode <b:includable id='comment-form' var='post'>
- Letakkan kode berikut diantara kode <b:includable id='comment-form' var='post'> dan </b:includable>
<div align='left' style='margin: 5px 0px 0px;'><div class='normalfont' style='margin-bottom: 2px;'><input onclick='if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') {this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
this.innerText = ''; this.value = 'Silahkan tutup kalau tidak mau berkomentar dan terimakasih atas kunjungan anda..'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Silahkan tinggalkan komentar anda...'; }' style='color: blue; margin: 0px; padding: 5px; width: 100%; text-align: left;' type='button' value='Silahkan tinggalkan komentar anda...'/></div><div class='alt2'><div style='display: none;'><div style='border: medium none; padding: 10px; text-align: left;'>
Kode Komentar Di Template
</div></div></div></div>
Hasilnya pemasangan<b:includable id='comment-form' var='post'>
<div align='left' style='margin: 5px 0px 0px;'><div class='normalfont' style='margin-bottom: 2px;'><input onclick='if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
this.innerText = ''; this.value = 'Silahkan tutup kalau tidak mau berkomentar dan terimakasih atas kunjungan anda..'; } else {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Silahkan tinggalkan komentar anda...'; }' style='color: blue; margin: 0px; padding: 5px; width: 100%; text-align: left;'
type='button' value='Silahkan tinggalkan komentar anda...'/></div><div class='alt2'><div style='display: none;'><div style='border: medium none; padding: 10px; text-align: left;'>
<div class='comment-form'>
<a name='comment-form'/>
<h4 id='comment-post-message'/>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='230' id='comment-editor' name='comment-editor' src='' width='507'/>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
</script>
</div>
</div></div></div></div>
</b:includable> - Selesai. Silahkan preview terlebih dahulu perubahan template anda, jika tidak ada error. Simpan template
- Lihat hasilnya di artikel blog anda
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Cara Memasang Tombol Buka Tutup Komentar Blog
Cara Memasang Tombol Buka Tutup di Kotak Komentar Menggunakan Script - Pada artikel sebelumnya saya sudah menjelaskan tentang memasang tombol buka tutup komentar tanpa menggunakan script yang tentunya lebih mudah dibuat dan lebih cepat dalam urusan loadingnya. Masih dengan topik yang sama yaitu memasang tomobl buka tutup di kotak komentar, jika pada artikel sebelumnya tidak menggunakan script tapi untuk artikel ini, kita akan menggunakan script dalam memasang tombol buka tutup di kotak komentar.
Meskipun memiliki kode yang berbeda tapi fungsi yang dihasilkan adalah tetap sama yaitu sama-sama memiliki tombol buka tutup di kotak komentar blog! Memasang tombol buka tutup (spoiler) itu sendiri memiliki fungsi untuk menyembunyikan kotak komentar agar (mungkin) tampilan dari artikel blog yang dibuat bisa minimalis padahal tanpa menggunakan script, blogger sendiri sudah menyediakan tampilan buka tutup dibagian menu Komentar yang bisa di setting sesuai keinginan. Ya, namanya juga manusia, individu unik yang tentunya tidak memiliki kesamaan yang sama dengan individu lainnya, tampil beda adalah sesuatu yang lumrah yang bisa dilakukan oleh setipa manusia termasuk dalam memodifikasi blog yang mereka miliki.
Dan berikut contoh tampilan gambar tombol buka tutup di kotak komentar menggunakan script yang telah saya terapkan untuk blog saya yang lain
Demo
Jika anda ingin memasang tombol buka tutup ini, berikut panduannya
Okey, jika ada pertanyaan atau ada kode yang tidak berfungsi dari kode diatas, silahkan tinggalkan komentar anda untuk artikel ini, Cara Memasang Tombol Buka Tutup di Kotak Komentar Menggunakan Script
Meskipun memiliki kode yang berbeda tapi fungsi yang dihasilkan adalah tetap sama yaitu sama-sama memiliki tombol buka tutup di kotak komentar blog! Memasang tombol buka tutup (spoiler) itu sendiri memiliki fungsi untuk menyembunyikan kotak komentar agar (mungkin) tampilan dari artikel blog yang dibuat bisa minimalis padahal tanpa menggunakan script, blogger sendiri sudah menyediakan tampilan buka tutup dibagian menu Komentar yang bisa di setting sesuai keinginan. Ya, namanya juga manusia, individu unik yang tentunya tidak memiliki kesamaan yang sama dengan individu lainnya, tampil beda adalah sesuatu yang lumrah yang bisa dilakukan oleh setipa manusia termasuk dalam memodifikasi blog yang mereka miliki.
Dan berikut contoh tampilan gambar tombol buka tutup di kotak komentar menggunakan script yang telah saya terapkan untuk blog saya yang lain
Demo
Jika anda ingin memasang tombol buka tutup ini, berikut panduannya
- Masuk ke akun Blogger anda
- Pilih menu Template >> Edit HTML >> tekan tombol Ctrl+F di keyboard
- Cari kode ]]></b:skin>
- Letakkan kode berikut tepat diatas ]]></b:skin>
a.openpanel {display:block;width: 100% ;height: 30px ;padding:0px 0px;text-align:center;font-weight:bold;line-height:30px;background: #9E9E9E ;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;position:relative;}
a.openpanel em {width:0px;height:0px;display:block;position:absolute;top:15px; right:15px;border:6px solid transparent;border-top-color:white;}
a.openpanel.active {background-color:#;}
a.openpanel.active em {top:6px;border color:transparent transparent white transparent;}
div.paneline {height:0px;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;}
div.openclosePanel {padding:10px 20px 20px;margin:0px 0px !important;} - Cari kode </head>
- Letakkan kode berikut tepat diatas </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'> //<![CDATA[
var panelSelector = '#comments',
openPanelText = "Buka Komentar",
closePanelText = "Tutup Komentar",
slideDownPanelSpeed = 600;
slideUpPanelSpeed = 400;
//]]>
</script>
<script src='http://panduan-template-blog-id-id.googlecode.com/files/openclosepanel.js'/> - Selesai. Silahkan preview terlebih dahulu perubahan template anda, jika tidak ada error. Simpan template
- Keterangan :
Hapus <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"> jika ditemplate anda sudah terpasang kode script tersebut
Okey, jika ada pertanyaan atau ada kode yang tidak berfungsi dari kode diatas, silahkan tinggalkan komentar anda untuk artikel ini, Cara Memasang Tombol Buka Tutup di Kotak Komentar Menggunakan Script
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Cara Memasang Tombol Buka Tutup di Kotak Komentar Menggunakan Script
Cara Membuat Kolom Komentar Facebook di Blog yang saya tulis ini adalah sekian cara yang telah ada dan dibahas oleh teman-teman blogger tanah air dan mungkin cara yang saya buat ini adalah cara termudah dalam membuat kolom komentar facebook di blog. Kenapa saya bilang mudah? Karena hanya sedikit kode-kode yang perlu ditambahkan kedalam halaman pengeditan template blog anda. Cara membuat kolom komentar Facebook di blog ini telah saya terapkan kedalam blog saya sendiri tapi bukan di blog ini karena sudah banyak kode-kode yang telah saya pasang untuk blog ini.
Sebelum melanjutkan pembahasan mengenai cara membuat kolom komentar Facebook di blog ini, sedikit perlu saya jelaskan manfaat adanya kolom komentar Facebook di blog yaitu akan meningkatkan jumlah pengunjung blog anda melalui Facebook. Kok bisa? Karena setiap anda berkomentar maka komentar anda akan tampil di halaman beranda (biasanya ada di sidebar sebelah kanan Facebook) facebookers yang lain dan jika facebookers tersebut membaca update-an komentar anda dan mengkilk tautan komentar tersebut maka secara langsung facebookers tersebut akan diarahkan ke blog anda. Tapi ingat! kolom komentar Facebook di blog ini akan berfungsi maksimal jika yang berkomentar sedang dalam keadaan aktif dengan akun facebooknya atau tidak mencentang Post to Facebook yang ada didalam kolom komentar.
Okey, dan berikut cara membuat kolom komentar Facebook di blog
Sebelum melanjutkan pembahasan mengenai cara membuat kolom komentar Facebook di blog ini, sedikit perlu saya jelaskan manfaat adanya kolom komentar Facebook di blog yaitu akan meningkatkan jumlah pengunjung blog anda melalui Facebook. Kok bisa? Karena setiap anda berkomentar maka komentar anda akan tampil di halaman beranda (biasanya ada di sidebar sebelah kanan Facebook) facebookers yang lain dan jika facebookers tersebut membaca update-an komentar anda dan mengkilk tautan komentar tersebut maka secara langsung facebookers tersebut akan diarahkan ke blog anda. Tapi ingat! kolom komentar Facebook di blog ini akan berfungsi maksimal jika yang berkomentar sedang dalam keadaan aktif dengan akun facebooknya atau tidak mencentang Post to Facebook yang ada didalam kolom komentar.
Okey, dan berikut cara membuat kolom komentar Facebook di blog
- Buatlah sebuah aplikasi yang akan mengintegrasikan blog anda dengan Facebook. Untuk membuatnya, silahkan baca Cara membuat aplikasi Facebook
- Jika sudah selesai membuat aplikasi facebooknya, buka akun blogger anda
- Pilih menu Template >> Edit Html >> centang Expand Template Widget >> tekan tombol Ctrl+F di keyboard
- Cari kode <b:skin><
- Keterangan
- Ganti profil.sriwahyuni dengan nama akun Facebook anda
- Ganti 259054834227698 dengan ID Aplikasi Facebook anda yang telah anda buat
- Cari kode <div class='post-footer-line post-footer-line-3'/> dan tambahkan kode berikut tepat dibawah <div class='post-footer-line post-footer-line-3'/>
<b:if cond='data:blog.pageType == "item"'>
<div class='fb-comments' data-num-posts='10' data-width='550' expr:data-href='data:post.url'/>
</b:if>
- Keterangan
- data-num-posts='10' merupakan jumlah komentar yang tampil. Silahkan anda ganti jika ingin menampilkannya lebih banyak
- data-width='550' merupakan lebar kolom komentar. Silahkan diganti dengan menyesuaikan lebar area postingan blog. Bukan lebar blog
- Selesai dan simpan Template blog anda. Lihat hasilnya di bagian bawah artikel atau diatas kolom komentar Blogspot
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Cara Membuat Kolom Komentar Facebook di Blog
