Skip to HeaderSkip to PostSkip to Footer

Cara Menghilangkan Bundle CSS dan JS Blogger

Daftar Isi

    Bundle CSS dan JS dari Blogger ini berfungsi untuk mengoptimalkan fungsi dari fitur bawaan Blogger seperti komentar, preview, dan layout. Jadi sebenarnya script tersebut cukup bermanfaat untuk kamu yang memanfaatkan fitur-fitur tersebut.

    Meski begitu, untuk kamu yang nggak terlalu perlu fitur tersebut dan lebih memilih optimasi loading, seperti saya, ini bisa jadi cukup mengganggu. Khususnya buat blogger yang senang dengan rapot hijau dari Pagespeed dan GTMetrix. Untuk lebih jelasnya, silahkan kamu perhatikan gambar di bawah:

    Bisa kamu lihat sendiri bahwa bundle script JS dan CSS menjadi PR yang harus diperbaiki berdasarkan saran dari Pagespeed. Oleh karena itu saya mencoba mencari cara lain untuk bisa menghilangkan atau mendisfungsikan bundle script tersebut.

    Setelah saya membaca beberapa referensi dan mencoba beberapa eksperimen, saya sampai pada satu cara yang saya rasa cukup efektif untuk mengakali bundle script tersebut.

    Cara yang akan saya bagikan berlaku untuk template AMPHTML maupun Non-AMP. Meski begitu trik-nya sedikit berbeda.

    Untuk kamu yang mau menerapkan cara saya ini, silahkan ikuti panduan singkat berikut ini:

    Alat

    1. Komputer/ Laptop

    Bahan

    1. Koneksi Internet
    2. Blogger Blog
    3. Akun Blogger

    Lainnya

    Estimasi Waktu: 5 menit.

    Biaya: Rp0

    Panduan

    Langkah 1 - Login ke Blogger

    Pertama, silahkan kamu login ke Blogger menggunakan akunmu. Setelah itu, silahkan kamu pilih blog yang ingin kamu edit template-nya (hanya jika kamu punya lebih dari satu blog).

    Langkah 2 - Buka Template Editor

    Selanjutnya, silahkan kamu buka template Editor dengan cara menekan menu Theme > Edit HTML seperti yang saya tunjukkan pada gambar di atas.

    Langkah 3 - Cari dan ubah bagian </head>

    Silahkan cari kode <head> lalu ganti dengan kode berikut ini:

    <b:if cond='!data:view.isLayoutMode'><!--</b:if></head><b:if cond='!data:view.isLayoutMode'>--></head></b:if>

    Ini dibutuhkan untuk menghilangkan bundle Blogger CSS di bagian <head>.

    Langkah 4 - Cari dan ubah bagian </body>

    Silahkan cari kode </body> lalu ganti dengan kode berikut ini:

    <b:if cond='!data:view.isLayoutMode'><!--</b:if></body><b:if cond='!data:view.isLayoutMode'>--></body></b:if>

    Kode ini berfungsi untuk menyembunyikan bundle.js bawaan dari Blogger.

    Langkah 5 - Save template

    Terakhir, silahkan kamu simpan template kamu. Lalu, silahkan kamu cek hasilnya di Pagespeed atau GTMetrix.

    Penjelasan

    1. Fungsi Conditional Tag !data:view.isLayoutMode

    Ini berfungsi untuk tidak menghilangkan bundle JS dan CSS di bagian Layout Blogger. Jika conditional tag ini tidak digunakan, maka fitur Layout di blog-mu tidak akan berfungsi.

    2. Beberapa Widget Bawaan Blogger Menjadi Tidak Berfungsi

    Jika kamu menggunakan trik ini, maka beberapa widget bawaan Blogger seperti Wikipedia, ContactForm, Feed, BlogList, Komentar Bawaan Blogger dan beberapa widget lainnya tidak akan bisa digunakan karena widget tersebut membutuhkan bundle script tersebut.

    Penutup

    Mungkin segitu saja tips atau tutorial yang bisa saya bagikan tentang cara menghilangkan bundle CSS dan JS Blogger terbaru. Semoga tutorial ini membantu kamu dalam membangun blog yang lebih mantap lagi. Jika ada yang punya cara lain yang lebih ampuh atau punya pertanyaan, boleh disampaikan melalui kolom komentar. Terima kasih dan sampai jumpa di tulisan saya lainnya.

    Anda mungkin menyukai postingan ini
    Komentar

    Posting Komentar

    Harap berikan komentar yang relevan dengan topik tulisan.
    Jangan menyertakan link yang tidak berhubungan dengan konten tulisan. Apabila komentar mengandung link (apalagi yang tidak relevan), maka komentar akan dihapus.
    Budayakan sopan santun, hindari penggunaan bahasa yang provokatif, SARA, pornografi.
    Kritik dan saran yang membangun untuk konten ataupun untuk blog sangat berarti bagi kemajuan blog ini.

    Seputar Blogger
    Link Kami
    Histats
    PageSpeed Insight Tested
    Valid AMPHTML
    W3C HTML5 Valid
    W3C CSS Valid
    W3C RSS Feed Valid
    W3C Atom Feed Valid
    SSL Secure
    DMCA.com Protection Status

    Mohon Maaf!

    Karena tingginya potensi pencurian konten melalui metode Printing, ASIBUKA memutuskan untuk menonaktifkan fitur print langsung melalui browser. Jika kamu ingin mengcopy materi dari blog ini, silahkan hubungi pengelola blog melalui kontak yang telah disediakan.