Memasukkan Kode dan Blockquote Pada Komentar

Oleh Unknown

Rabu, 04 Juni 2014

Bagikan :

Tweet

Memasukkan Kode dan Blockquote pada Komentar - Melanjutkan postingan sebelumnya tentang cara memasang Syntax Highlighter di blog, kali ini saya akan menjelaskan cara memasukkan kode dan blockquote pada komentar. Sebelumnya, Syntax Highlighter yang saya bagikan kemarin itu belum aktif pada komentarnya

Baca Juga : Memasang Syntax Highlighter di Blog

Nah, sekarang anda perlu mengaktifkannya pada komentar. Selain itu, saya juga akan menjelaskan tentang penggunaan Blockquote pada komentar. Karena penggunaan blockquote di komentar juga belum aktif. Langsung saja, silahkan ikuti langkah - langkah berikut.

Memasukkan Kode dan Blockquote pada Komentar

Setelah CSS Syntax Highlighter terpasang, kita akan menambahkan CSS sedikit untuk blockquote-nya.

blockquote,b[rel="quote"]{margin:20px;background:#293E6A;color:#fff;padding:10px;border-left:20px solid #04043C;display:block;font:17px "PT Sans Narrow";}

Silahkan taruh CSS di atas di bawah-nya CSS Syntax Highlighter yang saya bagikan kemarin.

Jika sudah, silahkan tambahkan JavaScript berikut dan letakkan di atas </body>. JavaScript ini saya dapat dari Mas +Saeful Rahman.

<script type='text/javascript'>
//<![CDATA[
$("#comment_block").each(function () {
    $('i[rel="pre"]', this).replaceWith(function () {
        return $("<pre></pre>").append($("<code></code>").append($(this).contents()))
    });
    $('b[rel="quote"]', this).replaceWith(function () {
        return $("<blockquote></blockquote>").append($(this).contents())
    });
    $('i[rel="code"]', this).contents().unwrap().wrap("<code/>")
});
//]]>
</script>

Sesuaikan id komentar-nya dengan template blog anda. Silahkan ganti #comment_block jika tidak sesuai.

Pengaturan Penulisan

Menulis tag pre (kode panjang)

<i rel="pre"> Tulis kode yang sudah diparse di sini <i>

Menulis tag code (kode pendek)

<i rel="code"> Tulis kode yang sudah diparse di sini </i>

Menulis catatan blockquote

<b rel="quote"> Tulis catatan blockquote di sini </i>

Tag : Blogging, Komentar