Mecha versi 2.6.4 sudah dirilis!

Penolakan-Penolakan Blogger terhadap JavaScript dan URL

Tabel Konten
  1. URL/Uniform Resource Locator 
  2. Catatan Tambahan 
    1. Dalam Tema 
    2. Dalam Posting/Widget 
Penolakan Blogger terhadap JavaScript dan URL

Gambar di atas adalah beberapa contoh penolakan Blogger terhadap JavaScript dan URL yang Anda tambahkan di dalam tema baik dari dasbor yang lama maupun dasbor yang baru. Suatu saat mungkin Anda mengalami masalah-masalah tersebut hingga pada akhirnya Anda memutuskan untuk menyerah dan tidak melanjutkan apa yang harus Anda selesaikan.

Pertama-tama, perlu Anda ketahui bahwa saat Blogger menerima JavaScript, secara normal dia akan segera memparse semua kode ' (petik tunggal) menjadi ' dan " (petik ganda) menjadi " saat tema telah tersimpan.

Sebagai contoh, suatu saat mungkin Anda hendak menyisipkan kode seperti ini ke dalam tema:

$(function() {
    $('img').hover(function() {
        $(this).animate({opacity:"0.4"}, 1000);
    }, function() {
        $(this).animate({opacity:"1"}, 1000);
    });
});

Namun saat tema telah berhasil tersimpan, kode yang Anda sisipkan justru berubah menjadi seperti ini:

$(function() {
    $('img').hover(function() {
        $(this).animate({opacity:"0.4"}, 1000);
    }, function() {
        $(this).animate({opacity:"1"}, 1000);
    });
});

Itu bukan masalah. Script tersebut masih tetap bisa bekerja dengan baik dan simbol-simbol tersebut akan kembali berubah menjadi simbol petik seperti sebelumnya pada kode sumber blog yang sesungguhnya.

Namun saat Anda menyisipkan JavaScript dengan tag HTML di dalamnya, sering kali Anda gagal melakukan itu dan akan mendapatkan peringatan seperti pada gambar pertama. Sebagai contoh:

var list = "<li>Contoh Daftar 1</li>" +
           "<li>Contoh Daftar 2</li>" +
           "<li>Contoh Daftar 3</li>";
$('.post').append('<ul>' + list + '</ul>');

Jika Blogger mendapatkan script ini begitu saja, maka Blogger akan menampilkan penolakan yang sejenis seperti pada gambar pertama.

Chris, dalam artikelnya pernah mengatakan seperti ini:

IF you are using XHTML still and IF your JavaScript has HTML in it (or even just the < character, as might be needed in greater-than logic), you'll need these CDATA comments around the script IF you care about the script passing validation (you'll get an error like: document type does not allow element “div” here). AND IF, you are putting script literally between the opening and closing script tags, not linking to a script src.

That's a lot of IF's.

Jika Anda masih menggunakan XHTML dan jika JavaScript Anda mengandung kode HTML di dalamnya (atau bahkan hanya karakter < seperti yang mungkin diperlukan dalam fungsi logika “lebih besar dari”), Anda harus menambahkan komentar CDATA di sekitar script jika Anda peduli dengan validasi script (Anda akan mendapatkan pesan kesalahan seperti: Jenis dokumen tidak mengizinkan elemen “div” di sini). Dan, jika Anda menempatkan script apa adanya (script eksternal) antara pembukaan dan penutupan tag <script>, bukannya menghubungkan ke <script src="....

Solusi untuk meloloskan script Anda dari Blogger adalah seperti ini:

<script>
//<![CDATA[
var list = "<li>Contoh Daftar 1</li>" +
           "<li>Contoh Daftar 2</li>" +
           "<li>Contoh Daftar 3</li>";
$('.post').append('<ul>' + list + '</ul>');
//]]>
</script>

Blogger tidak akan menolak jika script yang Anda tuliskan berada di dalam komentar //<![CDATA[ ...

URL/Uniform Resource Locator 

Selain JavaScript, Blogger biasanya juga akan menolak URL. Berikut ini adalah contoh URL yang akan ditolak Blogger:

http://www.blogger.com/rearrange?blogID=298900102869XXXXXX&widgetType=HTML&widgetId=HTML2&action=editWidget&sectionId=sidebar

Penolakan yang muncul biasanya seperti pada gambar ke dua. Untuk mengatasi masalah itu, cukup parse semua karakter & menjadi &amp;:

http://www.blogger.com/rearrange?blogID=298900102869XXXXXX&amp;widgetType=HTML&amp;widgetId=HTML2&amp;action=editWidget&amp;sectionId=sidebar

Pelajari: Memasukkan kode HTML dalam Posting

Catatan Tambahan 

Jika Anda menuliskan kode di dalam tema, gunakan petik tunggal, jika Anda menuliskan kode di dalam posting/widget, gunakan petik ganda sebagai penanda nilai atau selektor. Ini hanya saran:

Dalam Tema 

<a href='/p/daftar-isi.html' target='_blank'>Daftar Isi</a>
<script src='jquery.js'></script>
<script>
    alert('Ganteng!');
</script>

Dalam Posting/Widget 

<a href="/p/daftar-isi.html" target="_blank">Daftar Isi</a>
<script src="jquery.js"></script>
<script>
    alert("Ganteng!");
</script>

10 Komentar

Hadi Safa'at

mantaf infonya, ini blog super keren

Unknown

mas, script nya ditaruh dimana ya??

Yusril Ibnu Maulana

baru tahu fungsi //<![CDATA[ , dikirain itu hanya sebuah comment saja (di js kan commentnya memang memakai tag // kan ?) hehehe. pabtes aja setiap saya mau menghapus //<![CDATA[ (tujuannya sih agar blog lebih cepat...) malah error.. hehehehe
Thanks infonya..,sangat berguna bagi saya yang sedang mencari ilmu

Unknown

oh, ok dah ngingetin mas.. :-bd

obengkumana

sekitar 2 hari lalu saya mengalami sprti itu. script yang tdk jalan pada sebuah template hasil download. penulisannya reda "aneh". Karena blm tau artikel ini, saya hanya coba2 dengan membandingkan template hasil kreasi mas taufik. akhirnya bs jalan. tks :-bd

Unknown

sehabis edit-edit template.

setiap login blogger kata-kata "bX-blabla" berbeda2, gimana ya?

Taufik Nurrohman

Biasanya itu terjadi karena kita logout di tab lain, lalu mencoba menyimpan perubahan di tab yang aktif dengan akun yang sama.

Unknown

wah sepertinya benar mas, memang pas itu buat jaga-jaga saya buka 2 tab, kelupaan back up templatenya sementara kode sudah dipaste semua.

Unknown

tapi saya saat berkomentar menggunakan openID, tidak bisa karena adanya kesalahan seperti itu mas? gimana ya mengatasinya?

. Bantu Blogger mengatasi kesalahan blablablablabla bX-blabla ?

Komentar telah ditutup.