Membuat Blok Kode di Blogger yang Ramah Mata

Beberapa kali nyari referensi di internet untuk membuat kode blok di dalam blog lebih menarik dan mudah dipahami. Beberapa berhasil, yang lainnya ancur. Tetapi diantara yang berhasil itu juga banyak yang bikin mata merah. Selain desainnya jelek, jadul, gak membantu sama sekali pas dibaca. Padahal kita membuat setting blok kode kan supaya lebih nyaman di mata ketika bacanya. Dan strukturnya lebih mudah dipahami.

Akhirnya setelah utak atik. Dua mode source code di bawah ini cukup memuaskan. Setidaknya cukup rapi dan mudah dalam membaca sebuah baris kode.

Ini dari gist github. Kalau dari gist Github kita cukup memasukkan kode di dalam gist kita. Sehingga mudah dibagikan dan diedit langsung dari folder code kita. Tak perlu lagi copas jika ada perubahan. Selain itu keuntungan lainnya adalah dari sisi desain. Tak perlu bingung lagi. Sudah pasti mereka akan memperbarui desain sesuai zamannya. Jadi pastilah memuaskan tampilannya.

Tapi kelemahan dari Gist itu tak membedakan kode-kode berdasarkan warnanya. Jadi baik library, variabel, maupun class semua akan disamakan.

Untuk mengatasi kelemahan dari Gist Github tersebut. Kucobalah situs lainnya. Namanya hilite.me. Di situs ini mereka bisa menggolongkan variabel maupun fungsi sebuah baris kode berdasarkan warnanya. Memudahkan pas dibaca. Tapi ya desainnya gak semenarik Gist. Namanya juga proyek kecil-kecilan, beda sama Gist yang dinaungin perusahaan gede. Tapi lebih membantu lah. Ini contoh coding dari hilite.me

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

package com.dnab.app.intentactivity; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.Menu; import android.view.MenuItem; public class Sub1Act extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_sub1); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_sub1, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); } }