Membuat Kolom Komentar Offline

Membuat Kolom Komentar Offline - Beberapa hari ini saya mempunyai kesibukan yang mengakibatkan saya jarang online dan tidak bisa membalas komentar sahabat blogger. Oleh karena itu, saya menon-aktifkan kolom komentar. Saya berfikir dari pada banyak komentar yang tidak terbalas, lebih baik sayanon aktifkan saja kolom komentar.

Rupanya ada sahabat yang tertarik dengan cara saya ini, dan menghubungi saya via email menanyakan bagaimana cara membuat kotak komentar menjadi offline. Bagi sahabat yang mengunjungi blog ini beberapa hari kebelakang, tentu faham bagaimana bentuknya. Bagi yang belum faham, silahkan kunjungi DEMO.


Sebenarnya ini hanya permainan HTML saja. Bagi sobat yang sudah faham, akan lebih mudah mencerna dan memodifikasi tampilan dengan mengedit CSSnya. Mungkin ada cara lain untuk membuat kolom komentar Offline, yang akan saya bagikan adalah versi saya sendiri.

Langkah 1 : Simpan Kode CSS

Simpan kode CSS ini di atas </b:skin>

/* Offline Mode
----------------------------------------------- */
#offline-mode{
background:#dfdede url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhERvdIOUZFuGdEWfWxBhx5q6MKSbVzZSljX3pzDuLFmgcGnrB-jCQEfNGpZBh2XcIl_hs_M_DPCCWsHzHVcv4U2fXNWuI5HXjjFQvGUXNXlJnc0uFrKI202b-etEKmL4ye6ufvOhGYW5Y/s1600/offline-mode.png)no-repeat 3% 50%;padding:20px 20px 20px 175px;border:1px solid #c9c9c9;margin-bottom:10px}
#offline-mode h2{
font-size:220%;
text-transform:uppercase;
color:#fff;
text-shadow: -1px -1px  3px rgba(0,0,0,0.3);
}
#offline-mode p{
font-size: 12px;
color:#888;
line-height:1.8em;
margin-top:-15px;
}

silahkan edit yang diperlukan.

Langkah 2 : Simpan Kode HTML

Untuk menyimpan kode HTML, sobat cari kode <b:includable id='threaded-comment-form' var='post'> kemudian expand (klik panah sebelahnya) maka akan muncul kode seperti ini :

<div class='comment-form'>
...kode panjang....
</div>

tambahkan kode ini sesudahnya atau sebelum </b:includable>

<div id='offline-mode'>
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>

setelah itu, nonaktifkan sementara kolom komentar dengan menambahkan kode <!-- dan --> pada kode sebelumnya. Maka hasil keseluruhan menjadi seperti ini :

<!-- <div class='comment-form'>
..............
  </div>-->
 <div id='offline-mode'>
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>

Simpan Template.

Apabila ingin mengaktifkan kembali kolom komentar, pindahkan tanda <!-- dan --> pada HTML Offline-Mode, menjadi seperti ini :

<!--<div id='offline-mode'>
<h2>
Offline mode</h2>
<p>Mohon maaf, form komentar sementara dinon-aktifkan karena ada sesuatu dan lain hal yang menyebabkan saya tidak bisa membalas komentar sobat. Silahkan kunjungi beberapa saat lagi apabila sobat ingin berkomentar .</p>
</div>-->

Simpan kembali template....

Nah, itulah cara saya mengaktifkan dan menonaktifkan kolom komentar. Mengerti? atau malah puyeng? :)