Cara Agar Pesan Komentar Selalu diatas Form Komentar

                Pesan komentar adalah sebuah pesan pendek yang biasanya berisi tentang aturan-aturan berkomentar di suatu blog. Seharusnya, pesan komentar tersebut berada di atas form komentar. Namun pada threaded comment dan beberapa keadaan tertentu, pesan komentar tersebut tidak berada di tempatnya. Terkadang pesan komentar tersebut berada dibawah form komentar. Hal ini membuat isi dari pesan komentar tersebut tidak selalu terbaca oleh pengunjung yang ingin berkomentar.

                Pada threaded comment atau komentar berbalas, ketika kita akan melakukan reply komentar maka form komentar itu akan berpindah berada tepat di bawah komentar yang akan kita balas komentarnya. Hal itu terjadi karena variable replybox yang memanggil form komentar tersebut kebawah komentar. Secara default, variable replybox tersebut hanya memanggil form komentar nya saja. Sedangkan pesan komentar nya tidak ikut terbawa karena form komentar dan pesan komentar nya adalah elemen yang berbeda. Itulah penyebab mengapa pesan komentar nya terkadang berada di bawah.

                Variable replybox secara default:

var onReply = function(commentId, domId) {

    if (replybox == null) {

        // lazily cache replybox, and adjust to suit this style:

        replybox = document.getElementById('comment-editor');

        if (replybox != null) {

            replybox.height = '250px';

            replybox.style.display = 'block';

            replyUrlParts = replybox.src.split('#');

        }

    }

    if (replybox && (commentId !== replyParent)) {

        document.getElementById(domId).insertBefore(replybox, null);

        replybox.src = replyUrlParts[0]

        + (commentId ? '&parentID=' + commentId : '')

        + '#' + replyUrlParts[1];

        replyParent = commentId;

    }

};

                Perhatikan, bahwa perintah insert before memanggil variable replybox yang perintah nya memanggil elemen form komentar saja. Untuk mengatasi nya, kita harus membuat tag <div> yang menyatukan elemen pesan komentar dan form komentar tersebut lalu mengubah perintah pada variable replybox agar tidak hanya memanggil form komentar nya saja tetapi juga memanggil pesan dari komentar nya juga. Dengan begitu ketika kita mereply komentar, yang berpindah kebawah komentar induk adalah form dan pesan komentar nya.

                Caranya silahkan masuk ke template editor masing-masing, kemudian carilah kode dibawah ini :

<b:includable id='threaded-comment-form' var='post'>

  <div class='comment-form'>

    <a name='comment-form'/>

    <b:if cond='data:mobile'>

      <p><data:blogCommentMessage/></p>

      <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='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>

    <b:else/>

      <p><data:blogCommentMessage/></p>

      <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='410' id='comment-editor' name='comment-editor' src='' width='100%'/>

    </b:if>

    <data:post.friendConnectJs/>

    <data:post.cmtfpIframe/>

    <script type='text/javascript'>

      BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);

    </script>

  </div>

</b:includable>

Kemudian ganti kode yang berwarna hijau dengan kode dibawah ini :

<div id='form-wrapper'>

    <b:if cond='data:mobile'>

      <p><data:blogCommentMessage/></p>

      <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='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>

    <b:else/>

      <p><data:blogCommentMessage/></p>

      <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='410' id='comment-editor' name='comment-editor' src='' width='100%'/>

<p style=��text-align:right; font-size:5px; color:��><a href=http://www.misterdhi.net>Misterdhi.net</a></p>

    </b:if>

</div>

            Pada kode diatas, kita lihat bahwa comment-editor (kode form komentar) dan kode <p><data:blogCommentMessage/></p>(pesan komentar) telah disatukan dalam tag div dengan id form-wrapper. Nah, tag div dengan id tersebut akan menjadi elemen yang akan di panggil oleh variable replybox.

                Sekarang, untuk mengatur perintah replybox nya silahkan cari kode

document.getElementById(domId).insertBefore(replybox, null);

                kemudian ganti kode tersebut dengan kode dibawah ini :

document.getElementById(domId).insertBefore(document.getElementById('form-wrapper'), null);

                Terakhir klik Save Template.

                Sekarang, pesan komentar akan selalu berada di atas form komentarnya dan ketika kita klik tombol reply di komentar pun maka form dan pesan komentar akan berpindah ke bawah komentar induk.

                #semoga bermangfaat

                #salam terhangat dari Misterdhi.

Tulisan ini terinspirasi dari:http://www.dte.web.id/2012/05/masalah-pesan-formulir-komentar-yang.html

Read More

Daftar lengkap Kumpulan Kode HTML

            Seperti halnya kita ketahui bahwa HTML atau HyperText Markup Language adalah sebuah bahasa pemrograman yang digunakan oleh website-website di internet, sehingga website tersebut dapat kita lihat sebagai suatu informasi karena  aplikasi browser telah menterjemahkan kode-kode HTML tersebut menjadi bentuk sekumpulan informasi yang dapat kita lihat yang dapat berupa gambar maupun Teks.

Oleh karena itu, bagi orang-orang yang berkecimpung di dunia website, blog, dsb tentunya harus memahami penggunaan kode HTML tersebut. Karena dengan begitu, jika terjadi eror dalam website yang kita kelola, kita mampu memperbaiki nya sendiri. Selain itu, dengan kita memahami penggunaan kode kode HTML, kita akan mudah mengoptimalkan website yang kita kelola sehingga dapat berjalan optimal. nah, dalam rangka memahami kode HTML tersebut, dalam postingan ini di sediakan Daftar Tag HTML yang biasa di gunakan.

 Berikut ini adalah daftar Tag Pada Kode HTML yang biasanya sering di gunakan

 Tag Utama

Tag	Atribut	Deskripsi
<html></html>		Baris paling atas dari setiap file HTML
<head></head>		Informasi umum dari sebuah halaman web
<title></title>		Judul halaman. Terdapat pada head
<body></body>	Background, bgcolor, bgsound, font, link, alink, vlink, topmargin, leftmargin, marginheight, marginwidth	Settingan atribut untuk seluruh dokumen

Modifikasi Teks

Tag	Deskripsi	Contoh
<b></b>	Teks tebal	Teks tebal
<i> </i>	Teks miring	Teks miring
<u> </u>	Teks garis bawah	Teks garis bawah
<h1></h1>	Header 1	Header 1
<h2></h2>	Header 2	Header 2
<h3> </h3>	Header 3	Header 3
<h4></h4>	Header 4	Header 4
<h5></h5>	Header 5	Header 5
<h6></h6>	Header 6	Header 6
<sub></sub>	Subscript	Subscript
<sup></sup>	Superscript	Superscript

Font 

Tag	Atribut	Deskripsi
<font></font>	Color, size, name	Mengubah gaya suatu huruf

Links

Tag	Atribut	Deskripsi
<a> </a>	Href, target, style, class, name, id	Membuat link ke dokumen atau situs lainnya

Gambar

Tag	Atribut	Deskripsi
<img>	Src, alt, name, border, height, width	Menampilkan sebuah gambar

Formatting

Tag	Deskripsi	Contoh
<blockquote></blockquote>	Digunakan untuk mengatur text dan gambar dalam suatu tag	Contoh text in a block quote format ( �� �� )
<ol></ol>	Ordered List (digunakan dengan <li>)	1. Item 1
<ul></ul>	Unordered List (digunakan dengan <li>)	? Item 1
<li>	Elemen List
<dd></dd>	Definition List
<dt>	Definition Term
<dd>	Definition Description
<p></p>	Paragraf
<br>	Ganti baris
<hr>	Garis horizonta
<center></center>	Menengahkan elemen

Tabel

Tag	Deskripsi	Contoh
<table></table>	Border, cellpadding, cellspacing, width, height, name, id, title, bgcolor, background, align, valign	Mengatur semua elemen table
<tr></tr>	Height, bgcolor, background, align, valign, title	Membuat baris baru
<td></td>	Height, width, bgcolor, background, align, valign, title, colspan, rowspan	Membuat kolom
<th></th>	Height, width, bgcolor, background, align, valign, title, colspan, rowspan	Header(kepala tabel). Otomatis ke tengah dan tebal
<tbody></tbody>	Height, width, align, valign, bgcolor, background	Format yang berlaku bagi cell yang diapit tag
<colgroup></colgroup>	Height, width, align, valign, bgcolor, background, colspan	Format yang berlaku bagi kolom

Form

Tag	Deskripsi	Contoh
<form></form>	Method, action, name, enctype	Mengatur elemen dari form
<input type=>	Text, password, hidden, radio, checkbox, submit, image, reset	Variasi dari tipe elemen input dalam form
<select></select>	Name, size	Membuat combo-box. Digunakan bersama dengan option
<option>	Selected, name, value
<textarea></textarea>	Name, rows, cols, wrap	Membuat Text Area untuk input text dengan length yang lebih besar dari input text.

 

 itulah beberapa tag HTML yang biasa digunakan sehari-hari.

Semoga bermanfaat.

#salam terhangat dari Mr.DHI

Read More