Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di die-silver.blogspot.com

Membuat Komentar Model Shown/Hide

Observasi satu lagii telah jadiiiii...!!!! Sekarang tentang modifikasi komentar. Gak apa-apa khand??? Hehe... Siapa tau ini berguna. Nah, menuju deh ke hasil observasiku. Aku sengaja meneliti tentang komentar dan gak sia-sia, setelah ngelembur sampai jam 1 tadi malam, aku berhasil buat yang namanya Komentar Shown/Hide. Halah, maaf yaa kalo aku namain gitu, masalahnya waktu aku Googling aku nggak nemuin cara kayak gitu, apa aku yang gak tau keywordnya yaaa??? ;)

Sebagai bahan untuk contoh, aku pake blog satunya untuk bahan observasi. Sayang kalo yang ini ntar rusak kalo gagal... Klik sini untuk Contoh.

Terus apa manfaatnya komentar mode kayak gini?? Aku pikir manfaatnya adalah mempersingkat bagian komentar dengan menyembunyikannya, tapi kalo diklik ya ntar semua komentar akan muncul otomatis, jadi kalian bisa
nulis gini:

Eittt...Jangan sentuh dulu....
Kamu boleh sentuh kalo udah isi kotak komentar..OK??? :D



Hehe :D ... Tapi itu cuma contoh aja, terserah kalian mau kasih kata apa... Oke, sekarang ayo kita lihat bagaimana caranya sih buatnya???? Gini lhoo....

  1. Meluncur aja ke Dasbor ---> Layout/Tata Letak ---> Edit HTML

  2. Jangan lupa klik kotak sebelah Expand Template Widget dan sebaiknya men-download dulu template kamu sebelum melakukan pengeditan untuk menghindari kesalahan yang tidak diinginkan

  3. Paste kode di bawah ini sebelum kode </head>

    <script type="text/Javascript">

    function togglecomments (postid) {

    var whichpost = document.getElementById(postid);

    if (whichpost.className=="commentshown") {
    whichpost.className="commenthidden";
    }
    else {
    whichpost.className="commentshown";
    }
    }
    </script>

  4. Cari kode <dl id yang mengacu pada comments tapi menurutku kebanyakan kodenya begini:

    <dl id='comments-block'>


    atau

    <dl id="comments-block">

  5. Kalo udah ketemu ganti kode tadi dengan kode di bawah ini:
    <dl class='commenthidden' id='comments-block'>

  6. Gak berhenti sampai di situ, kalian harus menyisipkan kode di bawah ini di bawah menu .deleted-comment {
    .commenthidden {
    display:none
    }
    .commentshown {
    display:inline
    }


    Kalo gak ngerti selengkapnya begini:

    .comment-footer a:link {
    color: #999999;
    }
    .deleted-comment {
    font-style:italic;
    color:gray;
    }
    .commenthidden {
    display:none
    }
    .commentshown {
    display:inline
    }

    .feed-links {
    clear: both;
    line-height: 2.5em;
    }
    #blog-pager-newer-link {
    float: right;
    }
    #blog-pager-older-link {
    float: left;

  7. Kemudian cari kode berikut ini

    <a name='comments'/>


    Selengkapnya perhatikan kode di bawah ini:
    <a name='comments'/>
    <b:if cond='data:post.allowComments'>
    <h4>
    <b:if cond='data:post.numComments == 1'>
    1 <data:commentLabel/>:
    <b:else/>
    <data:post.numComments/> <data:commentLabelPlural/>:
    </b:if>
    </h4>

  8. Sisipkan kode berikut di bawah kode </h4> tadi:
    <base target='_self'><h2><a aiotitle='click to expand' href='javascript:togglecomments%20("comments-block")' rel='nofollow'><b> »» Lihat / Tutup Komentar</b></a></h2></base>

    Untuk kalimat yang berwarna merah bisa diganti dengan kata-katamu

  9. Simpan deh...



Oke... Itu dia caranya, udah bisa belum niih?? Kalau masih bingung dan ada yang ingin ditanyakan, kirim pesan aja di kotak komentar yaaa??

Semoga berhasil dan semoga bermanfaat kawand!!! :D



Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di die-silver.blogspot.com
Gunakan Tombol berikut untuk menyimpan halaman :
Membuat Komentar Model Shown/Hide
menjadi format PDF dan lebih maksimal jika terdapat kesalahan koneksi atau yang lainnya.

..::Artikel Menarik Lainnya::..

42 comments:

Dhe April 19, 2009 at 10:26 AM  

wekekekekeek :))
jangan sentuhh dulu yah..;))

belajar seo April 20, 2009 at 2:13 PM  

seep neh bos... di coba ah trick nya... :)

Aditya Ramadhan April 20, 2009 at 2:50 PM  

maaf lama gak mampir bro...coz..gw lg sibuk skula...ntar lg khan mao ujiand...jd vacum gt deh...Keep blogging ya bro....:P

keren nih triknya...
Mantabb....!!!!!!!!!!

♥ Neng Aia ♥ April 20, 2009 at 4:55 PM  

bagus sih.. tapi aku kok ga nemu ya kode² itu :(

ardi33 April 21, 2009 at 9:54 AM  

@Neng Aia: masak gak nemu sih Neng??? padahal udah sering aku cek tapi berhasil semua di template manapun.. coba mana yang gak nemuin neng??Kalo nggak nemu coba cari kode yang hampir sama Neng...Jangan sedih gitu dunk :)

Blogger Ceria April 21, 2009 at 4:45 PM  

wah, keren sob jadinya!
hahaha... bisa aja nih buatnya.. :D

ardi33 April 21, 2009 at 4:51 PM  

Saking pengennya jadi terinspirasi neng...

ghielz April 21, 2009 at 7:08 PM  

:)) bagus sob....ntar kali udah bosen ma komentar ounya gw... gw coba cara kayak gini.... :0 sory juga ru mampir.... sukses buat lo....

akane April 21, 2009 at 8:23 PM  

wehe,,,,,,,,, asik nhe,,,,,,, coba ach,,,,,,,,,,
:))

akane April 21, 2009 at 8:36 PM  

wah aku berhasil membuatnya,,,,
harap diliat
:s

cukup susah tuk mencari kode" itu,,, :@

~k2h - BoY~ April 21, 2009 at 8:46 PM  

wah bagus juga tuh...hebat ya kmu..:o

vie_three April 22, 2009 at 1:40 PM  

ntu aq pernah liat dan pengen banget blogku dikasi koment tertutp dan terbuka begitu :o

tp yg jadi pertanyaan blog gak jadi gendut khan???

mahendra April 22, 2009 at 6:10 PM  

waaah siep nih ...boleh dicoba nih...tapi agak ribet...

ardi33 April 23, 2009 at 7:40 AM  

@vie_three: blog gak jadi gendut koq..tenang ae...karena gak ada yang ditambahin di menu <body>

aidicard April 23, 2009 at 11:39 AM  

Oh.. ini toh tips nya.. buat WP.org bs ngga?? :?

Tips Blogging April 23, 2009 at 1:11 PM  

sip juga ne ide dan tipsnya...

rudihantono April 24, 2009 at 2:29 PM  

bagus trik and tips nya, siiip deh

Blog Bisnis April 26, 2009 at 2:40 PM  

wah sips nich tipsnya boleh juga dipraktekkin..

rachman April 26, 2009 at 4:38 PM  

wah mainan baru nich

fans_theblues April 26, 2009 at 10:20 PM  

bagus untuk dicoba nih... :f

info tekno April 26, 2009 at 10:22 PM  

bagus ga ntar blog gue kalo pake ini...? :D

Gossip April 27, 2009 at 6:09 AM  

Boleh nih dicoba..tapi cocok ga ya buat blog saya?..anyway postingannya keren bisa nambah wawasan.

ziegey April 27, 2009 at 12:46 PM  

huehueheue makasih triknya ne sob...patut dicoba ;;)

anak nelayan April 27, 2009 at 6:15 PM  

maksih triknya sob

sosial seni budaya bisnis April 27, 2009 at 8:29 PM  

wah rumit juga nih masuk ke blognya....

ardi33 April 27, 2009 at 8:56 PM  

sulit pa???waduh....

Yusa April 28, 2009 at 6:21 AM  

menarik jg tutorialnya mas, sprtnya orisinal..:)

budiawanhutasoit April 28, 2009 at 8:44 PM  

thanks utk tipsnya..
mo dicoba di blog dummy dulu..

bunda azka April 30, 2009 at 8:04 PM  

Wah... boleh di coba nih.
maksih infonya ya :)

Seti@wan Dirgant@Ra May 2, 2009 at 4:01 PM  

Kalau aku punya sih,... belon butuh yang ginian, abis yang komentar cuman dikit. makanya datang dong komentar.

imam May 9, 2009 at 7:38 PM  

aduh kalo gw dapet koment mah kagak bakal gw sembunyiin....biar blogku keliatan rame hehehehe

TroLL55i June 10, 2009 at 7:06 AM  

:D
Tx
bisa minta tolong ajarin ga ngeblog????
jah..... pengen tauh bannyak nie tapi.....
huk..huk.......:S

Seti@wan Dirgant@Ra June 10, 2009 at 2:15 PM  

Aku udah sentuh sobat,... karena udah berhasil. Makasih yah...

neilhoja June 25, 2009 at 2:21 PM  

ardi,... kok aku gak nemuin kode ini ya?

.deleted-comment

posisinya di mana sih? di sekitar komeng juga?

ardi33 June 25, 2009 at 2:26 PM  

iya di sekitar komeng, kalo nggak bisa tinggal diletakkan di atas kode ]]></b:skin>

neilhoja June 25, 2009 at 2:28 PM  

cuma ada yang ginian....
-------------------

.comment-footer {
margin-bottom: 5px;
display: block;
font-size: 87%;

}
------------

abis itu langsung skin...

neilhoja June 25, 2009 at 2:35 PM  

hahahaha... dah berhasil dy, thanks.. aku coba2 aja masukin code comment inline di bawah comment footer.. xixixiix

thanks yaaaaaaaaaaaaw

marcel June 25, 2009 at 2:36 PM  

Tips yang ok sob...
terus berkarya dan sukses selalu
_________________________________________________________________________
Mampir-mampir ya ke blogku... banyak tips yang mungkin kalian butuhkan mulai dari:

1. Kesehatan
2. Tip-trik Blog
3. Komputer
4. Sellular
5. Internet
6. Chat
7. Antivirus
8. Tips-tips Umum
9. Game....
Dan masih banyak lagi yang lainnya....Jadi saya tunggu kunjungan anda....

Saungweb June 25, 2009 at 5:12 PM  

Tutorial yang menarik.. di ciba ah... makasih ya.. kapan2 jangan kesasar lagi..

aseng liong July 14, 2009 at 5:19 PM  

hy bro...
salam kenal aja slalu..
thank's karna dari perantara blog kamu uda bikin aku lega....

thank U very much........!!!!

shanushy0809 July 20, 2009 at 2:18 PM  

makasih atas petunjuknya
sangat berguna sekali bagi aq

CiterMenariK' July 30, 2009 at 3:21 AM  

info berguna.. terima kasih ya..

Post a Comment

Silahkan menuliskan komentar anda pada opsi Google/Blogger untuk anda yang memiliki akun Google/Blogger.

Silahkan pilih account yang sesuai dengan blog/website anda (LiveJournal, WordPress, TypePad, AIM).

Pada opsi OpenID silahkan masukkan URL blog/website anda pada kotak yang tersedia.

Atau anda bisa memilih opsi Nama/URL, lalu tulis nama anda dan URL blog/website anda pada kotak yang tersedia.

Jika anda tidak punya blog/website, kolom URL boleh dikosongi atau dapat juga diganti dengan email anda.

Gunakan opsi 'Anonim' jika anda tidak ingin mempublikasikan data anda. (sangat tidak disarankan). Jika komentar anda berupa pertanyaan, maka jika anda menggunakan opsi ini tidak akan ditanggapi. Lebih baik anda gunakan pilihan dibawah ini:

Jika ingin komentar anda tidak dipublikasi, silahkan klik disini.

Terima kasih, komentar anda sangat berarti untuk die-silver.blogspot.com
:a: :b: :c: :d: :e: :f: :g:
:h: :i: :j: :k: :l: :m: :n:

newer post older post home

About Me

My Photo
ardi33
Sangat bercita-cita menjadi seorang webmaster yang selalu dapat memberikan yang terbaik dan bermanfaat kepada semua orang, dan sekarang sedang dalam tahap pembelajaran yang tak kenal lelah!!!
View my complete profile

Stats

Blog Rank:Powered by  MyPagerank.Net
Traffic Rank:Alexa Certified Site Stats for http://die-silver.blogspot.com
Online Visitor:
Blogger Template by Ardi33.Web.id.
Originally Die Silver Template Edited by TemplateZone