Kostumisasi Penomoran pada Komentar Blogger

Kostumisasi Penomoran pada Komentar Blogger

Kostumisasi Penomoran pada Komentar Blogger. Posting ini merupakan repost dari penulis Blognya Firdaus | eosBlog 2.0, sedangkan sumber asli berasal dari blog Randomness yang dipostkan oleh Fernandooo1. Namun sayang blog dari penulis asli tersebut tidak dapat lagi diakses, mungkin telah dihapus oleh pemiliknya.

Fernandooo1 mengatakan bahwa script penomoran komentar tersebut didapat dari seorang kawannya, yakni JMiur yang memiliki blog Vagabundia berasal dari Buenos Aires, Argentina. *Menambah nomor urut komentar

Anda mungkin sudah tidak asing lagi dengan judul trik blogger di atas. Yah, berita lama (± tahun 2008) yang mungkin terlupakan, tapi tidak ketinggalan zaman. Perbedaan tampilan & tata letak pada trik ini hanya merupakan hasil kostumisasi dari kode/script aslinya.

Tambahkan CSS (Cascading Style Sheets) berikut di atas ]]></b:skin>

.numberingcomments {
float:right;
text-align:right;
display:block;
width:50px;
margin:0 5px 0 0;
font-size:1em;
font-weight:normal;
}
  • Untuk merubah letak nomor ke kanan (right) atau ke kiri (left) dapat Anda lihat pada atribut kode yang berwarna biru.
  • Kode yang diberi background kuning, mungkin bisa Anda hilangkan atau jika Anda memerlukan properti tersebut, silakan dibiarkan apa adanya.
  • Untuk mengatur letak nomor agar sesuai dengan keinginan Anda, silakan rubah nilai properti kode yang diberi warna merah [dimulai dari 0 (atas), 5px (kanan), 0 (bawah), 0 (kiri)].
  • Warna hijau menunjukkan nilai properti untuk mengatur ukuran font.
Dan berikut merupakan kode HTML (HyperText markup Language) dari penomoran komentar.

<div expr:id='data:widget.instanceId + "_comments-block-wrapper"'>
        <dl expr:class='data:post.avatarIndentClass' id='comments-block'>

<script type='text/javascript'>var CommentsCounter=0;</script>

          <b:loop values='data:post.comments' var='comment'>
            <dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
             <b:if cond='data:comment.favicon'>
               <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
             </b:if>
               <a expr:name='data:comment.anchorName'/>
             <b:if cond='data:blog.enabledCommentProfileImages'>
               <data:comment.authorAvatarImage/>
             </b:if>
              <a expr:name='data:comment.anchorName'/>
              <b:if cond='data:blog.enabledCommentProfileImages'>
                <data:comment.authorAvatarImage/>
              </b:if>
              <b:if cond='data:comment.authorUrl'>
                <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
              <b:else/>
                <data:comment.author/>
              </b:if>

<span class='numberingcomments'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</span>

            </dt>
            <dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
              <b:if cond='data:comment.isDeleted'>
                <span class='deleted-comment'><data:comment.body/></span>
              <b:else/>
                <p>
                  <data:comment.body/>
                </p>
              </b:if>
            </dd>

*Sisipkan kode yang berwarna merah di antara kode-kode di atas.


HTML di atas hanya akan memberikan nomor urut tidak termasuk permalink komentar. Oleh karena permalink komentar sudah terwakili oleh timestamp komentar.

<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
        </a>

Apabila Anda ingin menerapkan nomor urut komentar sebagai permalink komentar, maka cukup mengambil kode yang berwarna merah pada timestamp & letakkan pada script seperti yang tampak di bawah ini.

<span class='numberingcomments'>
<a expr:href='data:comment.url' title='comment permalink'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>

Kostumisasi nomor urut komentar

Jika Anda telah melakukan kostumisasi avatar komentar dengan meletakkannya di sebelah kanan, mungkin lebih baik meletakkan nomor komentar di sebelah kiri. Anda perlu sedikit merubah & menambah CSS penomoran komentar, seperti:

.numberingcomments {
float:left;
text-align:right;
display:block;
margin-left:-50px;
font-size:1em;
font-weight:normal;
}

.numberingcomments:after {content:"."}

Silakan Anda melakukan trial & error, baik menambah dan/atau mengurangi kode CSS penomoran komentar, sampai Anda menemukan posisi yang tepat untuk meletakkan nomor urut tersebut.
Baca Selengkapnya >>>
Java script

Java script

JavaScript diperkenalkan pertama kali oleh Netscape pada tahun 1995. Pada awalnya bahasa ini dinamakan "LiveScript" dan berfungsi sebagai bahasa sederhana untuk browser Netscape Navigator 2.

Pada masa awal rilis, bahasa itu banyak dikritik karena kurang aman. Tidak ada pesan kesalahan yang ditampilkan saat kita membuat kesalahan program. Kemudian sejalan dengan kerja sama antara Netscape dan Sun (pengembang bahasa pemrograman Java) pada masa itu, maka Netscape memberi nama "JavaScript" kepada bahasa tersebut pada tanggal 4 Desember 1995.

JavaScript adalah bahasa pemrograman yang sederhana karena bahasa itu tidak dapat digunakan untuk membuat aplikasi ataupun applet. Dengan Java script kita dapat dengan mudah membuat sebuah halaman web yang interaktif. Program JavaScript dituliskan pada file HTML (*.htm atau *.html). Dengan kata lain anda tidak perlu menuliskan program JavaScript pada file terpisah (walaupun anda juga bisa melakukannya).

Bahasa ini adalah bahasa pemrograman untuk memberikan kemampuan tambahan terhadap bahasa HTML dengan mengijinkan pengeksekusian perintah di sisi klien, yang artinya di sisi browser bukan di sisi server web. JavaScript bergantung kepada browser (navigator) yang memanggil halaman web berisi script. JavaScript tidak memerlukan kompilator atau penerjemah khusus untuk menjalankannya.

JavaScript kita tidak mungkin menyembunyikan kode script yang kita tulis. Kode langsung ditulis dalam dokumen HTML dan sangat mudah terlihat. JavaScript adalah bahasa yang "case-sensitive", artinya, membedakan penanaman variabel dan fungsi yang menggunakan huruf besar dan huruf kecil.

Contoh, variabel atau fungsi dengan nama WAHANA berbeda dengan variabel dengan nama wahana. Setiap iknstruksi diakhiri dengan karakter titik koma ( ; ). Script dari JavaScript terletak di alam dokumen HTML. Scriot dari JavaScript mempunyai bentuk seperti berikut :

<SCRIPT language="JavaScript">

letakkan sript anda di sini

</SCRIPT>

Itulah sedikit pengertian Java script. Semoga berguna.
Baca Selengkapnya >>>