Cara Menulis Sintax Highlighter di Blog

Selain mempercantik tampilan baris code di halaman blog kita. Penggunaan syntax highlighter juga agar pembaca lebih mudah memahami bahasa code yang digunakan. Beberapa pertanyaan sebelum kita bahas cara menulis syntax highlighter di blog.

  • Ingin mendokumentasikan source code?
  • Ingin membagikan catatan-catatan penting code?
  • Ingin membantu masalah orang lain dalam coding?
  • dan masih banyak lagi.

Ya, dokumentasikan saja tulisanmu lewat blog, Agar orang lain dapat menerima manfaatnya juga. Namun, bagaimana caranya agar tulisan code kita dapat tertulis rapih di blog?

Gunakanlah beberapa plugin yang biasa digunakan dalam penulisan syntax code dalam blog. Disini, saya jelaskan bagaimana caranya menulis syntax code pada CMS wordpress.

Langkah – langkahnya:

  • Masuk ke Plugins, Tambah baru
  • Cari plugin code syntax block
  • Install dan Aktifkan
  • Atau Install plugin Code Syntax Block, cari di google atau di wordpress plugin atau disini.
  • Tambah Post baru, tambah element code
  • Kemudian, pilih bahasa pemrograman yang sesuai

Berikut contoh penulisan code yang menggunakan plugin code syntax block. Pada code dibawah menggunakan bahasa pemrograman PHP

<?php
// -------------------------------------------------------------------------
// Konfigurasi database dalam file ini menggantikan konfigurasi di file asli
// SID di donjo-app/config/database.php.
//
// Letakkan username, password dan database sebetulnya di file ini.
// File ini JANGAN di-commit ke GIT. TAMBAHKAN di .gitignore
// -------------------------------------------------------------------------

// Data Konfigurasi MySQL yang disesuaikan

$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'your_username';
$db['default']['password'] = 'your_password';
$db['default']['database'] = 'your_database';
?>

Dibawah ini menggunakan bahasa pemrograman Javascript

Baca juga:

var scripts = document.getElementsByTagName('script');
var last_script = scripts[scripts.length - 1];
var file_ini = last_script.src;
// Harus mengetahui lokasi & nama file script ini
var base_url = file_ini.replace('assets/js/script.js','');

$( window ).on( "load", function() {
	// Scroll ke menu aktif perlu dilakukan di onload sesudah semua loading halaman selesai
	// Tidak bisa di document.ready
	// preparing var for scroll via query selector
	var activated_menu = $('li.treeview.active.menu-open')[0];
	// autscroll to activated menu/sub menu
	if (activated_menu){
		activated_menu.scrollIntoView({behavior: 'smooth'});
	}
});

Dan masih banyak bahasa pemrograman lainnya. Mudah bukan?

brillian

Leave a Reply

%d bloggers like this:
Ads Blocker Image Powered by Code Help Pro

Ads Blocker Detected!!!

We have detected that you are using extensions to block ads. Please support us by disabling these ads blocker.

Adblockers perform their job via blocking communication with ad-forcing servers, and by hiding the webpage elements containing commercial content. By referring to filter lists containing the addresses of ad servers, ad blockers seek matches in website elements and define what should be blocked.

Adblocking detection in its turn is performed through “bait content”. Invisible to the user, such bait is implemented the way adblockers recognize it as commercial content. As soon as the webpage finishes loading, the detection algorithm calls to the properties of the bait. If the bait is hidden, the algorithm recognizes that there’s an active adblocker. Although baits are different and have different levels of complexity, it’s not that hard to disable adblock detection.

Powered By
Best Wordpress Adblock Detecting Plugin | CHP Adblock