Daftar penyorot untuk menempelkan dan menampilkan kode sumber di WordPress
Saat menulis artikel pemrograman dan memperkenalkan kode sumbernya, saya ingin Highlighter, sebuah fungsi yang memudahkan untuk melihat kodenya.Ada begitu banyak yang dikembangkan sehingga Anda tidak dapat memutuskan mana yang akan digunakan.Pada artikel ini, kami akan memperkenalkan alat untuk menyorot kode sumber di WordPress dan karakteristik masing-masing, dibagi menjadi tipe library, tipe plugin, dan layanan web.
tipe perpustakaan
Penyorot dari jenis yang mengunggah file perpustakaan yang diperoleh ke folder tema anak dan menggunakannya.Ini lebih ringan dari plug-in, tetapi perlu sedikit usaha untuk memperkenalkannya.
Sorot.js
Pustaka JavaScript bernama Highlight.js. Ini mendukung 189 bahasa pemrograman dan memiliki 89 gaya tampilan (per November 2018).Fungsinya sederhana, hanya menyoroti kode.sangat ringan.populer.
Prisma.js
Pustaka JavaScript yang ringan.Mendukung 153 bahasa dan 8 gaya tampilan (per November 2018).Anda dapat dengan mudah menambahkan nomor baris, menyorot baris tertentu, tampilan bahasa, penginstalan tombol salin, dll. sebagai fungsi ekstensi.Ini juga populer.
Percantik kode Google
Seperti namanya, itu adalah perpustakaan JavaScript yang dikembangkan oleh Google. Ini mendukung bahasa pemrograman utama seperti C, Python, HTML, CSS, JavaScript, Makefile, dll., Tetapi bahasa minor membutuhkan ekstensi.Ada 5 gaya tampilan (per November 2018).Selain dua metode mengunggah ke folder WordPress dan menggunakannya di atas, ada metode instalasi sederhana menggunakan autoloader.Ada sedikit informasi bahasa Jepang karena tidak banyak pengguna.
https://github.com/google/code-prettify
Jenis pengaya
Jenis yang didistribusikan sebagai plugin gratis untuk WordPress.Ini sangat mudah digunakan dan mudah ditangani, tetapi dapat membuat situs Anda agak berat dibandingkan dengan jenis lainnya.Dalam jenis pustaka, Anda dapat memilih untuk hanya mendukung bahasa yang Anda butuhkan, tetapi dalam versi plug-in, ini adalah gambar yang menyediakan semua bahasa dan semua fungsi.
Sorotan Kode WP.js
Ini adalah versi plugin dari Highlight.js yang diperkenalkan dalam tipe pustaka. Kompatibel dengan SyntaxHighlighter, Prettify, CrayonSyntaxHighlighter, sehingga Anda dapat bermigrasi dari penyorot lainnya.
https://ja.wordpress.org/plugins/wp-code-highlightjs/
Penyorot Sintaks Prisma
Versi plugin dari Prism.js.
https://ja.wordpress.org/plugins/ank-prism-for-wp/
Kode Mempercantik
Sama.
https://ja.wordpress.org/plugins/code-prettify/
Penyorot Sintaks Krayon
Kesan bahwa ada banyak pengguna dan banyak informasi tentang pembukaan dalam bahasa Jepang.Bahkan pemula dapat dengan mudah mengubah ukuran dan desain font, menambahkan nomor baris dan menentukan penyorotan, dll., Dan kemampuan penyesuaiannya sangat tinggi.Ada banyak ulasan yang berat, dan pembaruan terakhir telah berhenti sejak 2015, yang menjadi perhatian.
https://ja.wordpress.org/plugins/crayon-syntax-highlighter/
Penyorot Sintaks Mivhak
Ini mendukung lebih dari 130 bahasa pemrograman dan memiliki 36 tema, yang sempurna.Dari CSS dan JS yang ringan hingga skrip bahasa dan tema yang tampaknya dimuat sesuai permintaan, rasanya sama beratnya dengan Crayon Syntax Highlighter.Anda dapat menentukan ukuran font hanya untuk bagian kode.
https://ja.wordpress.org/plugins/mivhak/
Saya membandingkan dampak setiap plug-in pada kecepatan tampilan situs, jadi silakan lihat ini juga.
Perbandingan kecepatan tampilan situs dari plug-in Syntax Highlighter
Jenis layanan web
Ini adalah jenis penyorot yang mengubah kode sumber di web menjadi tag untuk disematkan dan menempelkan tag ke editor teks Wordpress untuk menyorotnya.
Gist (layanan GitHub)
Gist adalah layanan berbagi kode GitHub. Saat Anda mengunggah kode ke Gist, tag untuk tampilan adalah keluaran. Perlu mendaftar dengan GitHub, tetapi keuntungannya adalah Anda dapat mengedit dan mengelola kode di sisi GitHub (Jika Anda mengedit dengan editor teks,atauMembingungkan untuk dipusingkan dengan tag seperti ).
https://gist.github.com/discover
srctohtml
Anda dapat dengan mudah mengonversi kode menjadi tag HTML untuk disematkan tanpa registrasi.Bahasa yang didukung adalah JavaScript, C++, dan PHP, yang jumlahnya sedikit lebih sedikit.
http://marginalsoft.com/tools/srctohtml/
mana yang harus dipilih
Apa yang ingin Anda fokuskan akan menentukan alat mana yang Anda gunakan.Saya telah meringkas orientasi dan ketidaksesuaian masing-masing dengan mudah, jadi silakan merujuknya.Selain itu, penting untuk mengetahui apakah Anda tertarik dengan desain highlight.
| tipe perpustakaan | Penekanan pada ringannya pengoperasian dan kecepatan tampilan |
| Jenis pengaya | Penekanan pada kemudahan pengenalan (Tergantung pada pluginnya, mungkin tidak terlalu berat) |
| Jenis layanan web | Orang yang tertarik dengan fungsi manajemen kode, terdaftar di GitHub (Gist) Orang yang tidak memiliki banyak kesempatan untuk disematkan (srctohtml) |
Omong-omong, saya menggunakan plugin Mivhak Syntax Highlighter.Ada baiknya Anda dapat menentukan ukuran font hanya untuk bagian kode dan mengoperasikan berbagai pengaturan tombol pada layar pengaturan sederhana.Kecepatannya akan turun di ponsel, tetapi orang yang merujuk ke kode mungkin berasal dari PC, jadi menurut saya itu bukan masalah besar.