Cara Menciptakan Syntax Highlighter Keren Di Blogger

Cara Membuat Syntax Highlighter Keren di Blogger Syntax Highlighter berfungsi untuk menampilkan isi berupa instruksi yang diberikan untuk memudahkan kepada pembaca apabila konten tersebut menyajikan sebuah instruksi atau script dan sanggup juga berupa tutorial. Syntax Highlighter sangat diharapkan biar mempercantik tampilan website atau blog yang kau miliki.

Syntax Highlighter ini saya modifikasi biar terlihat keren dan simple untuk digunakan, dan tidak memakai javascript yang memberatkan blog anda tentunya, disini saya hanya memakai fitur css saja dan bagi yang mempunyai blog ber-niche tutorial blogging tentunya kalian wajib memakai ini biar pembaca sanggup lebih gampang memahami isi artikel yang kalian miliki.

Kali ini, saya berkesempatan untuk meluangkan waktu untuk menambah pengetahuan sahabat teman, bagaimana sih Cara Membuat Syntax Highlighter Keren di Blogger, tentunya bukan hal yang sulit. kalian sanggup memodifikasi sesuai warna dan apa yang kau inginkan memakai css yang saya bagikan pada tutorial ini.

Didalam artikel ini, sebelumnya saya juga sudah mencoba beberapa pre code yang bagus atau syntax highlighter untuk blogger. sehabis memilah dan memodifikasi script saya tetapkan untuk membagikannya kepada pembaca blog ini. jadi ini fungsinya hampir sama dengan kotak script ataupun blockquote. namun Syntax Highlighter ini memang khusus dibentuk untuk meletakkan script ataupun instruksi yang panjang, biar terlihat lebih lezat dibaca seharusnya kalian memakai ini pada blog yang sobat miliki.

Cara Membuat Syntax Highlighter Keren di Blogger

Walaupun sudah begitu banyak yang menyebarkan di internet, saya hanya share ini sesuai impian selera design saya saja, mungkin sobat yang sedang mencari design Syntax Highlighter yang bagus untuk blog sobat, anda sanggup melihat demonya terlebih dahulu pada gambar dibawah berikut ini.

Apakah Sobat Suka Dengan Syntax Highlighter Seperti Gambar Diatas ?

Jika suka, kalian sanggup mengikuti panduan dibawah ini :

1. Login Blogger Akun Blog Kalian Masing - Masing

2. Silahkan Salin Kode Css Yang Berada Dibawah ini.. Dan Pastekan CSS ini Tepat Sebelum Kode ]]></b:skin>

/* syntax highlighter jagoankode.blogspot.com */
pre,pre code{color:#FFFFFF}pre{background:#121835;padding:8px 10px;overflow:auto;max-width:100%;text-align:left;margin:10px auto;border-left:3px solid #ff0000}code,pre,pre code{font-family:Consolas,Monaco,'Andale Mono',monospace;white-space:initial;word-spacing:normal;word-break:normal;font-size:14px;line-height:1.3em}code{color:#FFFFFF}i.klik-url,pre{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}blockquote{font-family:Georgia,serif;color:#141924;border-left:3px solid #dedede;padding-left:8px}
/* Enjoy Your Life */

3. Simpan.

Cara Penerapan Kode Diatas Di Postingan Blogger

Ada penerapan untuk membuat Syntax Highlighter tadi di postingan blogger. silahkan ikuti panduan dibawah untuk menciptakan properti tadi.

Jika sudah menyimpan instruksi css tadi, maka selanjutnya yaitu penerapan penulisan di blog kamu, caranya cukup mudah.

1. Buatlah Sebuah Artikel Biasa.
2. Pindah Ke Tab HTML Seperti Gambar dibawah

3. Dan Isikan Script Dibawah Ini Dan Isi Kode Kalian Tepat Didalam Pembungkus Kode

<pre><code>
Isi Kode JQuery, Javascript, Css, Ataupun HTML</code></pre>

4. Ganti Kode Yang Berwarna Merah, Dan Ubah Kode Script Yang Anda Punya,
5. Jika Sudah Silahkan Kembali Ke Tab Compose.
6. Setelah Selesai Melakukan Penulisan Artikel
7. Simpan Dan Publish
8. Selesai

Kesimpulan...

Jika sudah mengikuti panduan dari awal seharusnya anda sudah berhasil untuk Cara Membuat Syntax Highlighter Keren di Blogger, apabila terdapat error atau apapun yang diragukan. silahkan berkomentar melalui kotak komentar dibawah. mungkin sekian itu saja yang sanggup saya sampaikan, semoga bermanfaat dan terimakasih telah berkunjung :)

Share this post