Cara Membuat Kotak Sintak/Sintax Highlighter di Postingan Blog

Pada postingan kali ini saya akan share tentang Cara Membuat Kotak Sintak atau disebut nya Sintax Highlighter pada postingan blog. Contoh nya seperti screenshot di atas, fungsi ini lebih kepada agar antara sintax dengan kata biasa bisa terlihat berbeda saja selain itu juga merupakan bagian dari kerapian juga di setiap posting blog.
Baik langsung saja ke cara pemasangannya, pada cara ini paling sederhana tidak perlu ke tempat HTML di tab template cukup langsung copy saja sintax nya yang ada dibawah.

Ikuti langkah - langkah nya ya :
- Login terlebih dahulu ke blog sobat
- Lalu ke Entri Baru
- Kemudian ke tab HTML di samping Compose
- Copy kan sintax dibawah di kolom HTML


<div style="background-color: #c1eeec; border: 3px solid rgb(153, 153, 153); height: 200px; overflow: auto; padding: 5px; text-align: left; width: 500px;">

Tempat sintax disini

</div>


- Kemudian Publlikasikan dan lihat hasilnya.

Bagaimana? sekarang sudah berbeda dari kata biasa nya kan. Selain dari sintax dasar diatas, sobat juga bisa memodifikasi model dari sintax highlighter. Yang bisa sobat ubah yaitu :
dari warna background -> #c1eeec
dari border -> bold
dari model garis tepi serta warnanya -> solid rgb(153, 153, 153)
dari Tinggi dari kotak sintax -> height: 200px bisa di ubah nilai px nya
dari Lebar dari kotak sintax -> width: 500px bisa di ubah nilai px nya
dari Padding/jarak antara garis tepi dengan isi sintax -> padding: 5px bisa diubah nilai px nya
dari text-align/perataan isi kotak tersebut -> text-align: left bisa di ubah ke perataan yang lain
Sekian, sharing mengenai Cara Membuat Kotak Sintak/Sintax Highlighter di Postingan Blog. Terima Kasih
Perlu Diingattt :
Apabila di arahkan ke halaman :
- shorte.st atau adf.ly, tunggu sejenak 5 detik dan mengklik tombol skip/lewati
- ke ouo, centang anda bukan robot dan tunggu 5 detik lalu get link, kemudian otomatis ke hosting download tersebut. Apabila sobat kesulitan ada panduan cara downloadnya klik >> disini <<
PERHATIAN!!!
- Jika kamu kesulitan mengunjungi halaman adf.ly, bisa atasi dengan cara INI
- Jika ada link mati atau bermasalah, laporkan saja langsung ya ke SINI. Terima Kasih. Enjoy...

Langganan Software Gratis
Previous
Next Post »