Di mana menempelkan kode ini di WordPress? Struktur file tema umum.

25.01.2022

dan Anda harus menempelkan kodenya.

Jadi apa yang kita lakukan? Kami mengklik ikon kaca pembesar dan mulai memeriksa area tempat artikel kami berada. Penting untuk menemukan bagian halaman seperti itu ketika area seluruh artikel disorot. Ini akan menjadi blok yang menampilkan konten.

Sebagai contoh, saya membuat artikel baru dengan sedikit konten untuk menunjukkan bagaimana suatu blok akan disorot.

Dengan mengklik, Anda juga harus menemukan blok yang berisi konten Anda. Saat melayang, Anda melihat tooltip kecil yang menunjukkan nama blok yang diberikan.

Ketika Anda menemukan bagian template seperti itu, klik tombol mouse dan bagian ini menjadi aktif. Di panel tampilan kode elemen, baris kode dengan blok ini akan disorot secara otomatis.

Seperti yang Anda lihat, blok ini memiliki nama yang persis sama seperti di tooltip hover.

Saat kita mengetahui nama blok tempat bagian utama artikel ditampilkan, kita dapat membuka file yang diperlukan dan memasukkan kode yang kita perlukan setelah blok ini. Mari ambil file keluaran rekaman (single.php) sebagai contoh.

Saya membukanya di editor Notepad dan mencari baris dalam kode yang dimulai persis sama seperti di panel tampilan kode elemen.

Sangat nyaman untuk bekerja di editor Notepad, karena ketika Anda mengklik tag pembuka blok, tag penutup juga dipilih (ditunjukkan pada gambar di atas). Tag penutup menunjukkan bahwa ini adalah akhir dari keluaran konten. Setelah itu kita dapat memasukkan tombol sosial, posting terkait, dan fungsi lainnya.

Saya baru saja memasukkan tombol sosial di sana bersama dengan formulir berlangganan untuk pembaruan.

Mereka ditampilkan di halaman.

Demikian pula, penyisipan ke file template lain (halaman, judul, arsip...) terjadi.

Tanpa latihan, metode penyisipan ini tidak mungkin dikuasai oleh teks dan gambar. Karena itu, ambil dan coba. Saya yakin semuanya akan berhasil. Juga untuk membantu video di awal artikel.

Tentang menentukan tempat di file template untuk penyisipan selanjutnya ke dalamnya saat Anda membutuhkannya, cari tahu.

Saat terakhir tersisa, yang layak disucikan dalam paragraf ini.

Ada beberapa pengaturan yang memerlukan intervensi dalam file functions.php template. Tetapi Anda juga perlu memahami cara memasukkan kode ke dalamnya.

Biasanya, di semua blog mereka menulis bahwa penyisipan harus dilakukan di bagian paling akhir file, sebelum tag penutup?>.

Tetapi bagaimana jika tag ini tidak ada dalam file? Misalnya, saya tidak memilikinya. Bagaimana berada dalam situasi seperti itu? Tidak adanya tag penutup tidak berarti bahwa file tersebut tidak valid. Blognya berfungsi. Jadi semuanya baik-baik saja.

Dalam hal ini, saya mengusulkan untuk melakukan yang sebaliknya - masukkan ke dalam kode di awal file sebelum tag pembuka. Lihatlah gambar di bawah ini.

Tag pembuka disorot dengan warna merah, dan kode yang dimasukkan disorot dengan warna biru.

Ini adalah salah satu pilihan. Anda juga dapat menyisipkan kode di akhir file, tetapi sebelum kode terakhir. Dalam hal ini, Anda perlu memahami setidaknya sedikit dari mana kode terakhir dimulai agar tidak terpotong.

Itu saja. Jika tiba-tiba Anda mengalami situasi yang sama dengan tidak adanya tag penutup di file funsctions.php, maka Anda akan tahu bagaimana melanjutkannya.

Mendefinisikan gaya visual dalam template

Selain itu, kita sendiri dapat melihat gaya desain untuk elemen halaman dan mengubahnya, serta menambahkan gaya kita sendiri. Inspektur elemen yang sama membantu dalam hal ini.

Saat kami menemukan elemen yang diperlukan dan mengkliknya, gaya untuk blok (elemen) yang dipilih ditampilkan di area kanan panel tampilan kode. Saya akan menunjukkan gaya untuk blok yang sama dari artikel yang dibahas di atas.

Jika kami ingin mengedit gaya ini secara real time dan melihat bagaimana elemen ini atau itu akan terlihat, kami dapat mengubahnya langsung di panel ini. Cukup klik pada nilai gaya yang diinginkan dan ubah.

Tetapi perubahan hanya akan berlaku hingga halaman pertama disegarkan. Untuk menerapkan gaya ini, Anda harus menambahkannya ke file gaya template. Dalam salah satu gambar di atas, saya telah menunjukkan dengan batas biru sebuah area yang menunjukkan nama file tempat gaya ini ditulis, serta garis awal yang tepat.

Oleh karena itu, kami membuka file style.css dan mencari baris 890 dalam kasus saya.

Di sini Anda dapat mengeditnya. Simpan file dan upload ke hosting.

Saya perhatikan bahwa saya mengedit semua file di komputer saya. Dalam hal ini, saya menggunakan program eksternal, yang memungkinkan untuk membatalkan perubahan apa pun jika terjadi kusen. Hal yang sama berlaku untuk berbagai eksperimen dengan kode dan skrip - semuanya aktif.

Saya sangat menganjurkan agar Anda juga melakukan pengeditan serupa pada file apa pun di komputer Anda. Untuk melakukan ini, Anda harus terlebih dahulu mengunduh file ke komputer Anda dari hosting menggunakan klien ftp. Saya menulis tentang ini di. Dan kemudian buka saja file dengan editor apa pun yang nyaman bagi Anda yang dapat membukanya. Saya menggunakan Notepad untuk tujuan ini.

Artikel ini telah berakhir. Inilah proses yang rumit untuk menentukan tempat di mana Anda perlu memasukkan beberapa kode atau skrip. Sekilas, prosedur ini mungkin tampak rumit. Tapi semuanya sangat sederhana. Coba beberapa kali dan Anda tidak akan menanyakan pertanyaan seperti itu.

Tentu saja, Anda dapat menyematkan kode dan skrip di blog Anda menggunakan plugin khusus, yang akan saya pertimbangkan tanpa gagal di artikel mendatang. Namun, untuk menghindari penggunaannya, Anda dapat melakukan tindakan seperti itu tanpanya, yang saya rekomendasikan. Dengan melakukan ini, Anda akan menghilangkan beban ekstra di situs, sehingga mempercepatnya dan membuatnya lebih nyaman untuk digunakan pengunjung Anda.

Semua teman. Saya akhiri dengan ini. Saya menantikan pertanyaan Anda di komentar. Kami akan mencari tahu semuanya. Sampai jumpa di konten baru.

Hormat kami, Konstantin Khmelev.

Tentu saja, tidak semua orang membutuhkan informasi ini, tetapi hanya mereka yang, di halaman mereka, berbagi dengan pembaca praktik terbaik mereka dalam memilih kode (baca inti situs) dan beberapa peningkatannya melalui ... yah, Anda mengerti Melalui intervensi dalam "genetik"! Apa yang kamu pikirkan?

Ke depan, sampai saya memulai cerita utama, saya dapat memberi tahu Anda bahwa saya akan terus mengotak-atik, apa yang akan saya tulis dan yang, kemungkinan besar, dapat berguna bagi Anda jika Anda juga memiliki sumber daya sendiri untuk kreativitas keyboard di Web . Dan oleh karena itu, saya menganjurkan agar Anda mengikuti rilis artikel baru, agar tidak ketinggalan rilis mahasiswa baru. Terutama jika Anda belum melakukannya, saya bertanya-tanya mengapa?

Dan sekarang, sayangku yang cantik, itu dimulai - ceritanya.

Pertanyaan yang masuk akal mungkin muncul, tetapi apakah pinjaman pada umumnya perlu repot memasukkan kode? Mengapa Anda perlu melakukan semacam penyorotan kode dan mengapa Anda tidak bisa menempelkannya saja, seperti teks, misalnya?

Dan semuanya sederhana - jika Anda mencoba memasukkan kode begitu saja, alih-alih menampilkannya, terkadang kode akan mulai berjalan dan melakukan semua fungsi yang dimaksudkan, terlebih lagi, tepat di tempat Anda memasukkannya. Dari semua "pesona" ini situs dapat "melayang", dapat "memutar", dan artikel itu sendiri berubah menjadi sesuatu yang tidak dapat dipahami dan sesuatu di tengah - jelek! Ya, dan kode itu sendiri dalam bentuk "telanjang", bukan "tontonan" yang sangat mudah dibaca, yang untuk tampilan yang tidak siap dapat mewakili zat yang tidak dapat dicerna, yang darinya, orang yang melihatnya bahkan dapat mengembangkan keengganan untuk memahami apa pun dan mempelajari esensinya. dari apa yang sedang terjadi. Singkatnya, tidak! Ya, Anda dapat melihat sendiri jika Anda melihat, misalnya, pada gambar di dalam kode:

Untuk membuatnya menjadi "itu", ada beberapa opsi, dan lebih khusus lagi 3. Saya akan mencoba menjelaskan semuanya, seperti yang saya janjikan di awal, dan Anda sendiri yang memutuskan mana yang lebih nyaman dan menyenangkan untuk Anda terapkan dan pahami.

Cara menyisipkan kode html ke dalam badan artikel dengan indah dan benar.

Opsi #1 - penyorotan kode melalui plugin WP-Syntax.

Lebih tepatnya, opsi ini diimplementasikan melalui sekumpulan dua plugin - untuk kemudahan penggunaan. Bagian pertama bundel disebut: WP-Syntax dan menjalankan fungsi utama. Dan bagian kedua adalah layanan dan disebut Tombol WP-Sintaks, yang mengimplementasikan pekerjaan dengan menekan sebuah tombol, yang ditambahkan tombol ini kepada Anda di dasbor editor wordpress. Unduh kedua bagian bundel ini baik melalui pencarian di panel admin blog berdasarkan nama, atau dari halaman repositori mesin. Halaman repositori untuk WP-Syntax ada di sini. Dan halaman untuk Tombol WP-Sintaks . Kita tidak di bus, kan?

Penginstalannya standar - ditemukan, diunduh, diaktifkan. Harap perhatikan bahwa plugin Tombol belum diperbarui selama lebih dari dua tahun dan tidak ada data tentang kompatibilitasnya dengan Anda versi baru WordPress, yang mungkin mengingatkan Anda. Jika Anda khawatir tentang keadaan ini, maka Anda tidak dapat mengunduh tombol dan bertahan hanya dengan bagian pertama dari bundel - ini juga akan berfungsi, hanya saja kurang nyaman. Dari saya sendiri, saya dapat mengatakan bahwa saya menggunakan set lengkap dan semuanya berfungsi.

Jika Anda menginstal semuanya, maka Anda akan memiliki tombol "Kode" baru di panel editor.

Untuk memasukkan kode melalui plugin ini, Anda harus memasukkannya terlebih dahulu dalam mode visual (normal, tempat Anda mengetik), pilih dengan mouse, lalu klik tombol "Kode" dan pilih bahasa yang cocok dengan kode Anda dari drop-down daftar. Pada saat yang sama, Anda dapat mengatur penomoran baris dengan menentukan nomor baris pertama di Nomor Baris. Setelah dipilih, tekan Sisipkan.

Pada saat yang sama, setelah menyimpan / memperbarui posting / halaman, Anda akan melihat gambar seperti ini dengan kode gambar yang Anda sisipkan dengan indah, misalnya:

Jika Anda tidak menginstal bagian Tombol WP-Syntax, maka Anda harus menggunakan kombinasi kode ini untuk memasukkan kode:

Masukkan kodemu di sini

Di mana, Bahasa adalah bahasa kode Anda. Kombinasi ini harus dimasukkan ke dalam editor HTML, dan masukkan kode Anda di dalamnya. Daftar bahasa yang didukung ada di halaman plugin ini. Opsi untuk memasukkan kode seperti ini sangat tidak nyaman, tetapi seseorang mungkin membutuhkannya. Hasilnya akan seperti ini:

1	Masukkan kodemu di sini

Opsi #2 - Syntax Highlighting melalui SyntaxHighlighter Evolved Plugin, namanya persis seperti yang diterjemahkan. Anda dapat mengunduhnya dengan mencari nama di panel admin blog, atau dari halaman plugin ini. Pemasangannya standar. Plugin ini berfungsi seperti yang sebelumnya, tetapi dengan cara yang kurang nyaman.

Setelah penginstalan, Anda akan memiliki item menu Pengaturan> Penyorot Sintaks, di mana semua pengaturannya akan berada. Ya, saya lupa mengatakan bahwa plugin tersebut dalam bahasa Inggris dan non-Rusia - kekurangannya. Jika ada yang tidak jelas, gunakan terjemahan halaman.

Pengaturan plugin dapat dibiarkan default - semuanya berfungsi. Atau Anda dapat mengatur nilainya, seperti pada gambar dengan contoh pengaturan saya:

Jika bingung, maka di pengaturannya ada tombol Atur ulang ke Default - reset pengaturan ke yang asli. Dan juga di bagian bawah halaman, di bawah tombol, terdapat pratinjau tampilan kode - Anda dapat bermain-main dengan aman dan memilih versi pengaturan dan keluaran kode Anda sendiri. Ada daftar bahasa yang didukung dan banyak lagi Detil Deskripsi pengaturannya - semuanya dalam bahasa Rusia, Anda akan mengetahuinya.

Untuk menyisipkan html atau kode php di entri situs dengan plugin ini, Anda perlu menerapkan salah satu konstruksi dari contoh di halaman pengaturan plugin (di bagian paling bawah):

Saat menulis posting, alihkan ke editor HTML, pilih parameter yang diinginkan bahasa dari contoh, rekatkan, dan rekatkan kode Anda di dalamnya. Ini akan menghasilkan sesuatu seperti ini:

Di sini Anda memasukkan kode panjang Anda

Opsi nomor 3 - masukkan kode html atau php tanpa plugin.

Untuk melakukannya tanpa plugin dan memasukkan kode html ke badan blog, Anda harus menyertakannya dalam kode berikut:

MASUKKAN KODE ANDA DI SINI

Di mana, tinggi dan lebar masing-masing adalah tinggi dan lebar bidang keluaran dengan kode dalam piksel, warna adalah warna. Anda dapat memilih warna dengan pipet, yang sudah saya tulis. Lebar dan tinggi dapat disesuaikan dengan parameter situs Anda. Outputnya akan seperti ini:

Secara tampilan dan fungsionalitas memang kurang cantik, tapi tidak memuat blog plugin tambahan meskipun saya sendiri tidak menggunakannya. Membawanya untuk perubahan.

Saya pikir sekarang putuskan bagaimana memasukkan kode html dengan indah ke dalam blog.

Di sinilah saya akan mengakhiri pembicaraan saya. Saya harap saya melakukan sesuatu yang baik untuk Anda hari ini Terima kasih telah membaca.

Sedikit positif:

Mengklik tombol sosial dan komentar dipersilakan!

Ikuti tombolnya, beri tahu teman Anda tentang artikelnya - ini untuk uang!

Apalagi saya ingin segera mengklarifikasi bahwa kami akan memasukkan kode ke dalam artikel itu sendiri, sehingga pembaca kami dapat menyalinnya tanpa membuang waktu untuk mengetik teks itu sendiri. Dengan demikian, kami akan meningkatkan kenyamanan () sumber daya kami - kali ini. Ya, dan artikelnya akan terlihat lebih profesional dan selesai - ini dua.

Saya juga ingin mencatat bahwa informasi dalam artikel ini akan bermanfaat bagi orang-orang yang, seperti yang kami beri tahu, cara membuat berbagai jenis add-on di situs, atau pengguna yang hanya ingin berbagi informasi berguna. Dan tidak masalah informasi ini adalah kode 🙂 Ngomong-ngomong, saya akan mengungkapkan sedikit rahasia, di proyek ini kami mengeluarkannya menggunakan plugin Wp-Syntex.

Anda bertanya: "Mengapa kami menggunakannya?" Jawabannya sederhana - tidak ada kawan untuk rasa dan warna. Candaan. Faktanya, kami memilih plugin ini karena mudah digunakan, menambah gaya visual dengan sempurna ke berbagai bahasa pemrograman (css, html, java, javascript, perl, sql, dll.), dan tidak memuat server kami.

Nah, karena saya membiarkannya tentang Wp-Syntex, mari kita gunakan sebagai contoh untuk menunjukkan cara memasukkan kode ke dalam artikel WordPress.

Pertama, Anda perlu menginstal plugin ini. Kami berbicara tentang bagaimana melakukan ini di artikel tentang . Oleh karena itu, untuk menggambarkan aksi ini Aku tidak akan berada di sini.

Akibatnya, Anda akan memiliki output berikut:

Kode yang ingin ditampilkan

Selain itu, alih-alih php dalam kode ini, Anda dapat memasukkan bahasa pemrograman lain, seperti css atau java. Pada saat yang sama, penataannya penampilan akan berubah.

Fitur Tambahan Wp-Syntex

Jika Anda menambahkan atribut ke tag "pra" pembuka garis, yaitu kode yang harus Anda tempel akan dimulai seperti ini:

Kode yang ingin ditampilkan

Saya harap Anda memperhatikan perbedaannya.

Ada satu lagi atribut kecil yang mungkin Anda perlukan - ini lolos. Ini memungkinkan Anda untuk mengubah kode karakter html langsung menjadi karakter itu sendiri. Misalnya, ">" akan diubah menjadi ">". Agar fungsi ini berfungsi, masukkan atribut berikut ke dalam tag "pra" pembuka:

lolos = "benar"

Karenanya, tag akan dimulai seperti ini:

< pre lang= "php" line= "1" escaped= "true" >

Juga di Internet, saya menemukan informasi bahwa Anda dapat menginstal plugin lain (WP-Syntax Button), yang berfungsi bersama dengan plugin kami dan menambahkan tombol penyisipan kode ke editor WP. Saya tidak terlalu malas dan memutuskan untuk mengujinya.

Segera setelah menginstalnya, saya diberitahu oleh fakta bahwa itu sudah lama tidak diperbarui dan tidak diuji dengan versi WordPress kami. Nah, apa yang bisa saya katakan, ketakutan saya dibenarkan.

Setelah mengaktifkan Tombol WP-Syntax, saya memutuskan di salah satu artikel kami mencoba memasukkan skrip java. Saya melakukan segalanya seperti yang ditunjukkan di tumpukan instruksi dan rekomendasi. Tempelkan skrip ke dalam artikel, sorot dan tekan tombol "kode".

Setelah itu, dia menunjukkan bahasa pemrograman dan nomor baris dari mana keluaran skrip harus dimulai.

Anda mungkin bertanya mengapa saya menulis tentang eksperimen ini di artikel ini? Dengan ini saya ingin mengatakan bahwa ketika Anda mencari beberapa informasi di Internet, perhatikan tanggal publikasinya. Lagi pula, ada kemungkinan yang sangat tinggi bahwa informasi di artikel lama itu relevan beberapa tahun yang lalu, dan seterusnya saat ini itu tidak berfungsi, dan menggunakan atau mengimplementasikannya dapat membuat proyek Anda rentan.

Di blog kami, saya mencoba untuk selalu memperbarui semua materi, terus memantau pembaruan dan, jika perlu, melakukan penyesuaian pada artikel yang sudah ditulis.

Jika Anda ingin menerima informasi terbaru tentang surel maka saya merekomendasikannya.

Video "Cara memasukkan kode HTML ke dalam artikel"

Teman-teman, jika seseorang lebih suka melihat bagaimana ini dilakukan, maka saya merekam video untuk Anda. Dan saya mengingatkan Anda bahwa kami juga memiliki saluran youtube yang juga dapat Anda berlangganan.

Artikel terkait:

Nah, semoga artikelnya ternyata tidak sulit, dan saya bisa memberi tahu Anda secara detail tentang cara memasukkan kode html ke situs tanpa masalah yang tidak perlu.

Jangan abaikan estetika blog Anda. Bagaimanapun, pembaca kami, seperti dalam hidup, bertemu dengan pakaian, tetapi melihat dengan pikiran.

Itu saja untukku!

Sampai jumpa!

Hormat kami, Anton Kalmykov

Halo untuk semua pembaca dan pelanggan! mereka yang tidak punya waktu untuk menjadi satu - tolong, untuk menjadi yang pertama belajar dari saya tentang posting baru di situs Video Blog

Jadi, suatu hari saya mengalami masalah, saya tidak dapat memasukkan kode html pada halaman, saya mencari melalui Google, Yandex dan bahkan pencarian email, tetapi saya tidak menemukan jawaban spesifik untuk pertanyaan saya tentang bagaimana melakukannya. seperti ini.

sangat mudah untuk melakukan ini, Anda hanya perlu menggunakan tag textarea + use Opsi tambahan tinggi, lebar dan padding

Mari kita urutkan bagaimana dan apa. Di wordprese, Anda cukup memasukkan kode yang diperlukan di editor visual dan akan ditampilkan seperti ini:

»alt="Sistem penghasil uang otomatis"/>

Tapi seperti yang Anda lihat, kodenya tidak ditampilkan dengan indah dan sangat tidak nyaman untuk menyalinnya. Jadi, untuk mengimplementasikan tugas seperti itu, Anda perlu menggunakan tag:

</b> di antaranya untuk memasukkan kode Anda atau teks apa pun <b> .

Ingat juga bahwa tag ini harus dimasukkan editor teks tidak hanya di mesin wordpress, tetapi di mesin apa pun.

Penting untuk memperhitungkan dan menggunakan tag tambahan yang menambahkan parameter indentasi dari baris teratas gaya = margin: 2px; Juga parameter ketinggian: tinggi: 40px; dan tentu saja parameter lebarnya: lebar: 660px

Sekarang saya akan meringkas apa yang telah saya tulis. Saat membuka kode </b> Anda perlu memasukkan parameter indentasi lebar dan tinggi, tampilannya seperti ini: <b><i><textarea style=»margin: 2px; width: 660px; height: 40px;»> </i> </b> atur parameter yang diperlukan dalam piksel dan kode Anda hampir siap, lalu tulis teks atau kode, lalu tutup tag <i><b>

Dan akhirnya, seperti yang dijanjikan, saya lampirkan Cheat Sheet:

Bagaimana cara memasukkan kode html ke halaman html?
—————————————

Salin tag ke notepad dan diantara paste kode di bawah ini, sambil mengganti link ke situs anda dan link ke banner anda

</b></p> <p><a href=»http://ваш_сайт.ru»><img src='/samsung-galaxy-s5/kuda-vstavlyat-etot-kod-v-wordpress-obshchaya-struktura-failov/' loading=lazy loading=lazy>»alt="masukkan teks yang ditampilkan saat Anda mengarahkan kursor ke spanduk"/></a></p> <p><b>

Catatan kaki:
* - tag yang memungkinkan Anda menyematkan tag Html apa pun di halaman web mana pun
*gaya- parameter yang bertanggung jawab atas gaya, ukuran, warna teks di dalam tag
* margin: 5px- parameter inden
* lebar: 660px- parameter lebar
* tinggi: 80px;- parameter tinggi

Itu semua teman-teman, berlangganan RSS feed dan juga saluran youtube saya
Suasana hati yang baik untuk Anda semua. 🙂

tentang Penulis

Banyak yang mungkin tidak mengerti mengapa saya menamai blog saya Pengangkatan sosial dari kegelapan ke matahari Kemudian saya akan memberitahu dan menjelaskan. Bagi saya, Internet adalah lift tempat saya terjun ke tingkat keterampilan, keterampilan, dan penghasilan yang saya butuhkan; tapi sosial, karena itu untuk orang, untuk masyarakat, untuk mereka yang menginginkan, untuk mereka yang sangat mirip dengan visi saya. Gelap- ini adalah bajingan, atau dengan kata lain, dasar dari kehidupan biasa di mana saya dulu, di mana sekarang banyak, ya, mungkin setengah dari orang di negara kita berada di bajingan ini, yang berpikir bahwa ini adalah burung camar, tapi tidak ... Matahari- inilah yang memberi kehidupan pada semua yang hidup di planet ini, termasuk kita. Jika tidak ada matahari, tidak akan ada kehidupan. Matahari adalah energi bagi kehidupan. Dan untuk menyimpulkan semuanya, LIFT Internet adalah kesempatan pengguna biasa Internet, yang bekerja untuk paman saya, sedang dalam kesulitan keuangan, saya bermimpi menjadi kaya, tetapi mereka tidak tahu harus mulai dari mana. Angkat Internet adalah platform yang akan membantu mereka yang ingin sedikit atau secara signifikan memahami seluk-beluk dan skema penghasilan. Mereka akan dapat belajar dari mana harus memulai, ke mana harus pergi, dan bagaimana menjadi bos bagi diri Anda sendiri. Saya harap saran dan artikel saya akan membantu Anda dan saya juga. Karena suatu hari Anda akan mengerti mengapa saya ngeblog, jika Anda mengetahui sesuatu, itu hanya berharga jika Anda mengingatnya. Dan saat Anda rekam dan bagikan, itu akan selamanya, termasuk dalam ingatan Anda!!!

Halo teman-teman. Hari ini, melanjutkan topik mempercepat pemuatan blog, mari kita bicara tentang kemungkinan mengganti plugin dengan skrip "ringan". Skrip, tidak seperti plugin, memiliki beban yang jauh lebih rendah di server, dan oleh karena itu kecepatan memuat situs akan lebih tinggi. Sampai saat ini, ada banyak sekali plugin dan mampu menyelesaikan banyak tugas blogger. Namun seringkali, plugin ini dapat digantikan oleh skrip yang lebih cepat. Dan terkadang bahkan menonaktifkan plugin yang tidak perlu. Dan semakin sedikit plugin pihak ketiga, semakin tinggi kecepatan loading sebuah situs atau blog.

Jika Anda menganalisis kecepatan memuat situs, Anda dapat melihat plugin mana yang memperlambat kecepatan memuat situs Anda. Layanan apa yang digunakan untuk verifikasi yang saya tulis. Dalam kasus saya, rem terbesar adalah plugin yang memungkinkan Anda menampilkan contoh Kode sumber dalam artikel, dengan penyorotan sintaks dari kode ini. Plugin ini disebut SyntaxHighlighter.

Hasil tes bahkan tidak muat di halaman. Tentu saja, penyorotan kode sangat indah, tetapi jika Anda melihatnya, ini bukan tentang penyorotan. Pada umumnya, efisiensi kode itu penting. Dan jika kodenya dimasukkan begitu saja, maka kemungkinan tidak dapat dioperasikannya tinggi.

Dan hari ini saya akan memberi tahu Anda cara mengganti plugin SyntaxHighlighter dengan kode biasa, dan bahkan memasukkan tombol ke panel edit blog Anda.

Cara memasukkan kode dalam artikel tanpa plugin

Diketahui bahwa di WordPress, untuk menampilkan contoh kode sumber dalam sebuah artikel, cukup pergi ke test editor saat mengetik artikel dan menyimpulkan kode yang diinginkan ke dalam tag

Kode Anda

Tetapi kode seperti itu tidak akan menonjol di sebagian besar teks artikel Anda. Sehingga Anda dapat menambahkan beberapa gaya, katakanlah, warna latar belakang, font, bingkai, dan sebagainya. Jadi kode Anda akan disajikan paling jelas dalam bentuk contoh.

Cara mengubah jenis kode yang ditampilkan

Untuk melakukan ini cukup sederhana.

Pilihan 1

Anda dapat menetapkan tag

Kelas, misalnya, class="cod" dan atur gaya yang diinginkan dalam file style.css.
.cod ( width: auto ; background-color: whitesmoke ; border: 1px solid #C7C3C3 ; border-radius: 5px ; color: #167dec ; ) 
pilihan 2
Anda juga dapat mengatur gaya secara langsung saat memasukkan kode.  Ini akan terlihat seperti ini:
 
Kode Anda
 
Dan pada contoh pertama dan kedua, jika kode yang disisipkan keluar dari artikel, Anda harus menambahkan properti overflow: auto;  yang akan memungkinkan Anda untuk mengontrol elemen blok.
Metode ini bagus untuk semua orang, tetapi saya ingin sesuatu yang lebih sederhana.  Secara umum, lagi-lagi kemalasan - mesin kemajuan membuat Anda menemukan sesuatu yang akan memudahkan proses ini.
Cara Menambahkan Tombol "Sisipkan Kode" ke Bilah Edit WordPress
Tombol sederhana di panel edit WordPress akan mempermudah proses ini.  Dan dia terlihat seperti ini.
Jika Anda ingin memasang tombol seperti itu untuk diri Anda sendiri, Anda memerlukan beberapa menit waktu Anda dan beberapa file dari saya.  Jadi mari kita mulai.