Get in Touch

Hapus Gutenberg CSS dari WordPress

Sejak versi WordPress 5.0, editor blok (editor Gutenberg) muncul di WordPress. Apakah Anda menggunakannya atau tidak, editor ini selalu ada di WordPress.

Hapus CSS Gutenberg

Jika Anda seorang webmaster yang tertarik dengan kecepatan situs, Anda akan menemukan bahwa setiap pemuatan halaman akan menyertakan CSS Gutenberg. Setiap permintaan berlebihan saat halaman dimuat akan memperlambat kecepatan situs Anda, dan jika Anda tidak menggunakannya Gutenberg Kemudian Hapus.

Lembar gaya Gutenberg

Lembar gaya Gutenberg termasuk 2 file CSS wp-block-library-css Dan wp-block-library-theme-cssdimuat di semua situs wordpress dari versi 5.0. 2 file CSS ini digunakan untuk mendukung tampilan editor blok. Namun jika Anda menggunakan editor Editor Klasik lalu hapus untuk meningkatkan kecepatan.

Kapan Lihat sumber untuk memeriksa kode sumber halaman, Anda akan selalu melihat file CSS block-library/style.min.css disertakan.

file CSS block-library/style.min.css disertakan dengan halaman
file CSS block-library/style.min.css disertakan

Hapus CSS Gutenberg

Anda bisa dengan mudah hapus CSS Gutenberg dengan kode PHP sederhana di bawah ini. Namun, jika Anda menggunakan editor blok bawaan WordPress, kode ini tidak boleh diterapkan.

Sebelum melakukan ini, Anda harus membuat cadangan situs web Anda.

  • Lihat 6 Plugin Cadangan WordPress terbaik

Anda menambahkan yang berikut ke file functions.php dalam tema yang digunakan. Selain menghapus CSS default Gutenberg, kode di bawah ini juga membantu menghapus lebih banyak Blok CSS WooCommerce.

Anda dapat menerapkan salah satu dari dua cuplikan kode yang disediakan di bawah ini.

Hapus Gutenberg CSS hanya di front-end

Jika Anda masih ingin menggunakan editor blok default dan hanya ingin menghapus CSS di halaman front-end. Terapkan kode berikut:

//Hapus Gutenberg Block Library CSS dari WordPress
fungsi vietrick_remove_wp_block_library_css(){
wp_dequeue_style( ‘pustaka-blok-wp’ );
wp_dequeue_style( ‘wp-block-library-theme’ );
wp_dequeue_style( ‘gaya-blok-wc’ ); // Hapus CSS blok WooCommerce
}
tambahkan_aksi( ‘wp_enqueue_scripts’, ‘vietrick_remove_wp_block_library_css’, 100 );
lihat mentah

wp-remove-gutenberg-block-library-css.php

diselenggarakan dengan ❤ oleh GitHub

Hapus Gutenberg CSS dari editor

Jika Anda sudah menginstal plugin Editor Klasiklalu terapkan kode berikut ke matikan editor blok sepenuhnya saat mengedit artikel.

// Sepenuhnya Nonaktifkan editor Gutenberg.
add_filter(‘gunakan_block_editor_for_post_type‘, ‘__return_false‘, sepuluh);
// Jangan memuat stylesheet terkait Gutenberg.
add_action( ‘wp_enqueue_scripts‘, ‘vietrick_remove_block_css‘, 100 );
fungsi vietrick_remove_block_css() {
wp_dequeue_style( ‘wp-blok-perpustakaan‘ ); // Inti WordPress
wp_dequeue_style( ‘wp-block-library-theme‘ ); // Inti WordPress
wp_dequeue_style( ‘wc-block-style‘ ); // Blok WooCommerce
wp_dequeue_style( ‘etalase-gutenberg-blok‘ ); // Tema etalase
}
lihat mentah

wp-sepenuhnya-disable-gutenberg-editor.php

diselenggarakan dengan ❤ oleh GitHub

Jika suatu saat Anda berencana untuk kembali menggunakan Gutenberg, ingatlah untuk menghapus/mengomentari kode di atas.

Periksa hasilnya

Setelah menerapkan kode ke file functions.phpkita bisa kembali ke homepage/artikel untuk mengecek hasilnya.

block-library/style.min.css telah dihapus dari kode sumber
block-library/style.min.css telah berhasil dihapus dari kode sumber
  • lihat lebih banyak: Nonaktifkan Javascript Emoji WordPress

Semoga Anda sukses. Jika Anda memiliki masalah, silakan tinggalkan komentar di bawah ini.

5/5 – (1 suara)

You may also like

Leave a Reply

Your email address will not be published. Required fields are marked *