anak smp-sekolah-info pendidikan-cerita anak: Membuat Komentar Bertingkat Blogger Dofollow

Membuat Komentar Bertingkat Blog Dofollow Manual adalah lanjutan dari Membuat Komentar Bertingkat Blogger otomatis dan dikhususkan untuk template blogger non draft yang belum disupport thread comment otomatis.
Mumpung lagi agak rileks dan listrik masih hidup saya posting saja,; tapi angine kuenceng bener masih wuar wer sejak kemarin, sampe listrik disco tralala trilili nganti maghrib

Sebagai Contoh saya ambil dari Blogger Template Style Label bikinan Lasantha Bandara, yang pernah dipakai bopone dik fajarmufti kemarin (asmane jenengan sinten to mas xixixi)
Dan hal ini untuk mengatasi masalah bug thread comment blogger agar statusnya tetap dofollow dengan dengan tetap menggunakan model komentar bertingkat, untuk melihat penampakannya silahkan demo blog dofollow with threaded comment, check out

Tahap berikut ini bisa dijodohkan juga untuk template blogger lain yang bukan jenis dari draft blogger, kalau ada yang mau coba boleh saja dan referensinya dari >> tutorial lawas artisteer september 2011, yang sedikit diriku edit.

Ritual Membuat Komentar Bertingkat Blogger Manual adalah
1. Mengetahui ID Blogger
Login ke dashboard; Design // Rancangan - Edit Html - Checkmark Expand HTML

Nah, lihat di browser misalnya kelihatan
http://www.blogger.com/html?blogID=6236096127840650951

Itu artinya blog id dirimu adalah 6236096127840650951
Untuk apa? untuk proses di langkah terakhir, simpan dulu angka tersebut di notepad. Ini penting banget, tapi sungguh ini akan cukup melelahkan; maka dari itu siapkan ~~segalon~~ teh poci menjelang perjalanan kali ini :gubrak:

2. Add CSS Komentar Bertingkat Blogger Manual
Find kode penutup CSS blogger // F3, tuliskan: ]]>
Paste css berikut ini di atas kode tersebut
Kode CSS yang disalin

#comments h4{font-size:18px; font-weight:normal; margin:20px 0}

.cm_wrap{clear:both; margin-bottom:10px; float:right; width:100%}

.cm_head{margin:0; width:60px; float:left}

.cm_avatar{margin:0; vertical-align:middle; outline:1px solid #fff; border:1px solid #ddd; padding:3px; background-image: url(http://img846.imageshack.us/img846/7357/unled1oww.jpg); background-position:center; background-repeat:no-repeat; width:35px; height:35px}
.cm_avatar_a{margin:0; vertical-align:middle; border:1px solid #ddd; padding:3px; background:#c6e5f7; background-position:center; background-repeat:no-repeat; width:35px; height:35px}

.cm_reply{padding-top:5px}

.cm_reply a{display:inline-block; margin:0; padding:1px 6px; border:1px solid #C4C4C4; border-top-color:#E4E4E4; border-left-color:#E4E4E4; color:#424242 !important; text-align:center; text-shadow:0 -1px 0 white; text-decoration:none; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; background:#EDEDED; background:-webkit-gradient( linear,left top,left bottom,color-stop(.2,white),color-stop(1,#E5E5E5) ); background:-moz-linear-gradient( center top,white 20%,#E5E5E5 100% ); font:11px/18px sans-serif}
.cm_reply a:hover{text-decoration:none !important; ; background:#ccc; ; background:-webkit-gradient(linear,left top,left bottom,color-stop(.2,#eee),color-stop(1,#ccc)); ; background:-moz-linear-gradient(center top,#eee 20%,#ccc 100%); }
.cm_entry{padding:16px 16px 0 16px; background:#F7F7F7; outline:1px solid #fff; border:1px solid #ddd; overflow:hidden}
.cm_entry_a{padding:16px 16px 0 16px; background:#F7F7F7; outline:1px solid #fff; border:1px solid #ddd; overflow:hidden}
.cm_arrow{display:block; width:9px; height:18px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT6ULD2MzuXuGmN0xvsW2FXsuN3Ugu6zMMtBP03Y1OtU1d1CZ3BRyG6ZkKGjouaITaeueA8c0xdqbdYtVz-NcS2p1XKwoy9bi8BW3WqFO-2MmjQ5Mcr3QQOSSsb7A_mxznzHDq_5-oAYU/s1600/comment-arrow.gif) no-repeat; position:absolute; margin-left:-25px}

.cm_info{margin-bottom:5px; border:thin solid #E6E6E6; background-color:#F4F4F4; padding:5px}
.cm_info_a{margin-bottom:5px; border:thin solid #E6E6E6; background-color:#dff0fa; padding:5px}
.cm_name{font-size:14px; color:#666 !important; text-decoration:none; font-weight:bold; float:left}
.cm_name_a{font-family:"Francois One"; font-size:14px; color:#666 !important; text-decoration:none; font-weight:250; float:left}
.cm_date{font-size:10px; color:#999; text-decoration:none; float:right}
.cm_date_a{font-family:"Francois One"; font-size:10px; color:#2D5E7B; text-decoration:none; float:right; padding-top:5px}
.cm_entry p{padding:5px; clear:both; border:thin solid #E6E6E6; background-color:#F4F4F4; font-size:13px; color:#333; word-wrap:break-word}
.cm_entry_a p{padding:5px; clear:both; border:thin solid #E6E6E6; background-color: #dff0fa; font-size:13px; color:#333; word-wrap:break-word}
.cm_pagenavi{font-size:10px; text-transform:uppercase; color:#666; text-shadow:1px 1px white; font-weight:bold}
.cm_pagenavi a{color:#666; text-decoration:none; padding:10px}

.cm_pagenavi a:hover{text-decoration:underline}

.cm_pagenavi span{color:#888; background:white; padding:4px; border:1px solid #E0E0E0}

.comment-body-author{font-family:"Francois One",Arial; font-weight:300}

3. Memasang javascript Komentar Bertingkat
Cari penutup body template; biasanya terletak di bagian akhir template; F3,cari: </body>
salin kode javascript berikut ini dan letakkan diatas kode </body>

4. Mengganti tag HTML komentar blogger
cari kode definisi comment blogger, tekan F3, cari includable id='comments'
sudah ketemu? kode tersebut adalah kantong ~~macan~~ dari kode definisi komentar blogger.
ada sekitar 82 baris di dalam area ini pada template dik fajar yang perlu dibuang untuk diganti yang baru

kodenya seperti ini

<b:includable id='comments' var='post'> blok dengan mouse mulai baris ini
terus ke bawah,
teruus
teruus.....
terusss......
tariik :gubrak..
teruss kalau sudah ketemu kode penutup berikut
</b:includable> sampai dengan baris ini STOP!!

dan hapuslah, lalu gantilah dengan kode berikut ini :
Copy kode komeng yang baru ini dan paste ke tempat tersebut

<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
        <h4>
             <b:if cond='data:post.numComments > 0'>
          <b:if cond='data:post.numComments == 1'>
            <span id='cm_total'>1</span> comment
          <b:else/>
            <span id='cm_total'><data:post.numComments/></span> comments
          </b:if>
        </b:if>
        </h4>

        <div id='cm_reply_css'/>

        <div class='cm_pagenavi' id='cm_page'/>

        <div id='cm_block'>
            <b:loop values='data:post.comments' var='comment'>
                <b:if cond='data:comment.isDeleted'>
                <b:else/>

                    <div expr:id='data:comment.anchorName'>
                        <div class='cm_wrap'>
                            <a expr:name='data:comment.anchorName'/>

<b:if cond='data:comment.author == data:post.author'>
                               <div class='cm_head'>
                                <div class='cm_avatar_a'>
                                    <b:if cond='data:blog.enabledCommentProfileImages'>
                                        <data:comment.authorAvatarImage/>
                                    </b:if>
                                </div>
                                <div class='cm_reply'>
                                    <a expr:href='"https://www.blogger.com/comment.g?blogID=123alkatro&postID=" + data:post.id + "&isPopup=true&postBody=%40%3C%61%20%68%72%65%66%3D%22%23" + data:comment.anchorName + "%22%3E" + data:comment.author + "%3C%2F%61%3E#form"' onclick='javascript:window.open(this.href, "bloggerPopup", "toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=600,height=500"); return false;'>Reply</a>
                                </div>
                            </div>
<b:else/>

                            <div class='cm_head'>
                                <div class='cm_avatar'>
                                    <b:if cond='data:blog.enabledCommentProfileImages'>
                                        <data:comment.authorAvatarImage/>
                                    </b:if>
                                </div>
                                <div class='cm_reply'>
                                    <a expr:href='"https://www.blogger.com/comment.g?blogID=123alkatro&postID=" + data:post.id + "&isPopup=true&postBody=%40%3C%61%20%68%72%65%66%3D%22%23" + data:comment.anchorName + "%22%3E" + data:comment.author + "%3C%2F%61%3E#form"' onclick='javascript:window.open(this.href, "bloggerPopup", "toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=600,height=500"); return false;'>Reply</a>
                                </div>
                            </div>
</b:if>

<b:if cond='data:comment.author == data:post.author'>
                                <div class='cm_entry_a'>
                                <span class='cm_arrow'/>
                                <div class='cm_info_a'>
                                    <div class='cm_name_a'>

                                      <b:if cond='data:comment.author == data:post.author'>
                                                                                       <a expr:href='data:comment.authorUrl' target='_blank'>
                                                <data:comment.author/>
                                            </a>
                                                           <b:else/>

                                        <b:if cond='data:comment.authorUrl'>
                                            <a expr:href='data:comment.authorUrl' target='_blank'>
                                                <data:comment.author/>
                                            </a>
                                        <b:else/>
                                            <b><data:comment.author/></b>
                                       </b:if>
                                        </b:if>
                                    </div>

                                            <b:if cond='data:comment.author == data:post.author'>
                                     <div class='cm_date_a'>
                                        <data:comment.timestamp/>
                                        <b:include data='comment' name='commentDeleteIcon'/>
                                    </div>
                                    <div class='clear'/>

                                            <b:else/>

                                    <div class='cm_date'>
                                        <data:comment.timestamp/>
                                        <b:include data='comment' name='commentDeleteIcon'/>
                                    </div>
                                    <div class='clear'/>
                                            </b:if>
                                </div>
                                  <b:if cond='data:comment.author == data:post.author'>
                                     <div class='comment-body-author'>
                                <p><data:comment.body/></p>
                                     </div>
                                            <b:else/>
                                <p><data:comment.body/></p>
                                 </b:if>
                            </div>


<b:else/>

                            <div class='cm_entry'>
                                <span class='cm_arrow'/>
                                <div class='cm_info'>
                                    <div class='cm_name'>

                                      <b:if cond='data:comment.author == data:post.author'>
                                                                                      <a expr:href='data:comment.authorUrl' target='_blank'>
                                                <data:comment.author/>
                                            </a>
                                                           <b:else/>

                                        <b:if cond='data:comment.authorUrl'>
                                            <a expr:href='data:comment.authorUrl' target='_blank'>
                                                <data:comment.author/>
                                            </a>
                                        <b:else/>
                                            <b><data:comment.author/></b>
                                       </b:if>
                                        </b:if>
                                    </div>

                                            <b:if cond='data:comment.author == data:post.author'>
                                     <div class='cm_date_a'>
                                        <data:comment.timestamp/>
                                        <b:include data='comment' name='commentDeleteIcon'/>
                                    </div>
                                    <div class='clear'/>

                                            <b:else/>

                                    <div class='cm_date'>
                                        <data:comment.timestamp/>
                                        <b:include data='comment' name='commentDeleteIcon'/>
                                    </div>
                                    <div class='clear'/>
                                            </b:if>
                                </div>
                                  <b:if cond='data:comment.author == data:post.author'>
                                     <div class='comment-body-author'>
                                <p><data:comment.body/></p>
                                     </div>
                                            <b:else/>
                                <p><data:comment.body/></p>
                                 </b:if>
                            </div>
</b:if>
                        </div>
                    </div>
                </b:if>
     </b:loop>
        </div>

        <div class='cm_pagenavi' id='cm_page_copy'/>

    <b:if cond='data:post.embedCommentForm'>
            <b:if cond='data:post.allowNewComments'>
                <b:include data='post' name='comment-form'/>
            <b:else/>
                <data:post.noNewCommentsText/>
            </b:if>
            <b:else/>
            <b:if cond='data:post.allowComments'>
                <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
            </b:if>
    </b:if>
</b:if>
</div>
</b:includable>

Sudaah? Silahkan Save Template
minum dulu sebentar, sik jemuran kayaknya pada mabur, ~~ada raksasa lagi pada main skateboard~~ .. cek keluar sebentar..

5. Mengganti Blog ID
Langkah terakhir
Silahkan tekan F3, cari 123alkatro
kalau sudah ketemu ganti dengan blogID dirimu,
Sudah tahu kan blog id dirimu, kalau belum baca langkah ke 1 sambil tahan nafas dan pasang kuda-kuda :D

sebagai contoh blog id utuk sobat Rio http://catatan-r10.blogspot.com adalah 3246458823643612377
sudah diganti?

Lanjut cari lagi karena ada dua tempat yang tertulis 123alkatro

ganti lah dengan blogid dirimu

Kalau sudah save template dan semoga beruntung .. kelemahannya? tampilannya lebih gud yang thread resminya blogger waktu reply; karena diriku amati thread comment artiister adalah manipulasi dari classic comment :he he:
kabuuurrr

11 komentar:

Unknown29 Januari 2012 pukul 08.19
maksudnya bertingkat gimana sob?? tread komentar maksudnya sobat???
BalasHapus
Balasan
anaksmpku29 Januari 2012 pukul 14.23
hehe iya kawan :D
BalasHapus
Balasan
Muhammad A Vip31 Januari 2012 pukul 15.10
kalo ngomongin yang bertingkat saya rada males bro, capek naiknya
BalasHapus
Balasan
obat diet2 Februari 2012 pukul 13.12
Menarik, sangat Menarik Artikel dan Tipsnya. boleh dicoba. salam sukses
BalasHapus
Balasan
chlorophyll mint powder2 Februari 2012 pukul 13.14
Wibesite yang sangat Amazing, Artikel dan Tipsnya boleh dicoba. Semangat !!
BalasHapus
Balasan
cara melangsingkan perut2 Februari 2012 pukul 13.18
Cemerlang Postingan dan Infonya.boleh dicoba. ditunggu info berikutnya. Terimaksih
BalasHapus
Balasan
obat pelangsing herbal2 Februari 2012 pukul 13.20
Postingan yang sangat Hebat, Tips boleh dicoba.salam sukses
BalasHapus
Balasan
obat pelangsing alami2 Februari 2012 pukul 13.23
Artikel yang bermanfaat dan berguna, wajib di coba. sukses selalu
BalasHapus
Balasan
R109 Februari 2012 pukul 17.54
aku masih lebih suka pakai komentar bertingkat bawaan blogger, soalnya aku kurang suka pop up sih
BalasHapus
Balasan
Sumber Berita Cerita Inspirasi Motivasi Dunia Terbaru - Beritama.com10 Februari 2012 pukul 11.55
ga mudeng isinya JS -__- , nanti tak cobae kali aja berhasil :D
BalasHapus
Balasan
Mr. Nya'13 Februari 2012 pukul 05.05
wahhh kode kodenya jan luas dan lebar. maklumlah agar bertingkatnya makin tinggi
BalasHapus
Balasan

Tambahkan komentar

terimakasih sudah mampir di blog cerita anaksmpku :)

Kamis, 26 Januari 2012

Membuat Komentar Bertingkat Blogger Dofollow

11 komentar: