Fixed Link!

Mengizinkan Elemen Terlarang Masuk ke dalam Kometar Blogger

Mengizinkan Elemen Terlarang Masuk ke dalam Kometar Blogger - mungkin tutorial ini sudah sering di posting di blogger lain, tapi saya disini hanya memberi tahu kepada yang belum tahu :D heheheh.
Tutorial ini saya dapatkan dari dte.web.id

Sebagai Penjelasan Katakanlah kita ingin memposting kode di dalam tag
<pre>untuk diterbitkan ke dalam komentar postingan, namun seperti yang kita tahu, Blogger tidak mengizinkan tag <pre>masuk ke dalam posting komentar. Jadi kita bisa menggunakan kode ini sebagai penanda:</pre>
</pre>
Mengizinkan Elemen Terlarang Masuk ke dalam Kometar Blogger

<i rel="pre">Kode di sini...</i>

Untuk mengubah tag <i rel='pre'> menjadi <pre> kita bisa menggunakan fungsi ini:

<script type="text/javascript">
// Seleksi elemen `p` di dalam `#comments`
$('#comments p').each(function() {
    // Ubah semua tag `<i rel="pre">` dengan `<pre>`
    $('i[rel="pre"]', this).replaceWith(function() {
        return $('<pre></pre>').append($(this).contents());
    });
});
</script>

Selektor $('#comments p') tidak mutlak. Terkadang ada juga kerangka komentar yang terdiri dari elemen <dd>, bahkan mungkin juga dengan ID komentar yang berbeda sehingga selektor tersebut juga bisa diubah menjadi $('#comments dd') atau $('#commentsbox dd')

Cukup pastikan bahwa template Anda sudah dilengkapi dengan JQuery, kemudian letakkan kode tersebut di atas </body>. Dan coba terbitkan sebuah komentar berupa teks di dalam <i rel='pre'></i>


Lebih Lengkap

Untuk tingkat manpulasi yang lebih lengkap, Anda bisa menggunakan baris kode ini. Salin kode ini lalu sisipkan di atas  </body>:


<script type='text/javascript'>
//<![CDATA[
$('#comments p, #comments dd').each(function() {
    // Singkirkan semua tag `<br>` di sebelah tag `<b rel^="h">`
    // (semua elemen `<b>` dengan nilai atrubut `rel` yang diawali dengan "h")
    $('b[rel^="h"]', this).nextAll().filter('br').remove();
    // Menyisipkan tag `<pre>`
    $('i[rel="pre"]', this).replaceWith(function() {
        return $('<pre></pre>').append($(this).contents());
    });
    // Menyisipkan gambar
    $('i[rel="image"]', this).replaceWith(function() {
        return $('<img />').attr('src', $(this).text());
    });
    // Menyisipkan tag `<h3>`
    $('b[rel="h3"]', this).replaceWith(function() {
        return $('<h3></h3>').append($(this).contents());
    });
    // Menyisipkan kuota/catatan
    $('b[rel="quote"]', this).replaceWith(function() {
        return $('<blockquote></blockquote>').append($(this).contents());
    });
    // Menyisipkan tag `<code>`
    $('i[rel="code"]', this).contents().unwrap().wrap('<code></code>');
});
//]]>
</script>

Klik Simpan Template. Setelah itu Anda tinggal menuliskan pesan untuk para komentator di atas formulir komentar seperti ini:


Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA DI SINI...</i> atau <i rel="pre">KODE ANDA DI SINI...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA DI SINI...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Sekian Semoga Bermanfaat.
Source : http://www.dte.web.id/2012/02/memanfaatkan-jquery-untuk-mengizinkan.html

Berlanggan

Berlangganan posting: Daftarkan alamat email Anda untuk memperoleh umpan posting terbaru langsung ke kotak masuk pesan dari FajriAndaviar.

Comments+ 19 komentar:

avatar

wah nambah ilmu nih sama kang ridwan

avatar

makasih mas, templateny keren mas... gag d share ni ?? :)) :sedot

avatar

Makasih master telah me review tutorial mengizinkan elemen terlarang masuk dalam komentar

avatar

Saya sendiri masih kurang mengerti nih :D, ada demonya gk?

avatar

Privasi gan .. Hanya saya yang punya :D

avatar

This comment has been removed by a blog administrator.

avatar

nambah ilmu nih mas,, bisa jd koleksi ilmunya :D

avatar

This comment has been removed by a blog administrator.

avatar

bang, tenplatenya yang buat menu sidebar kiri terlalu kontras ..
artikelnya bermanfaat :D

avatar

oya mba.. saya ga berhasil2 buat menu yang pas :D

avatar

Masih rumit memahami kode-kode spt di atas.... menyimak... thanks tuk sharenya :)

Terima kasih atas komentar Anda

Sering Dikunjungi