Bagaimana nambahin kode program ke dalam blogger? atau how to embed code syntax in Blog?
adalah pertanyaan yang dulu saya tanya ke Google pas mau berbagi kode sumber di blog kita. Memang secara defaultnya dalam Blogger atau Blogspot kita tidak dapat langsung mengetik kode-kode program apalagi kode HTML, soalnya si Blogger bakal ngompile bukan sebagai teks tapi sebagai kode itu sendiri jadi bakal tidak terlihat kode itu di post kita sewaktu di publish.
Untuk itu kita butuh sesuatu yang bisa memformat kode-kode tadi biar tidak terjadi salah paham dengan si Blogger dan tampilannya eye-catching punya. Sesuatu itu bernama SyntaxHighlighter suatu alat agar kode kita bisa di tulis dalam postingan. Tidak usah panjang lebar lagi mari kita ikuti langkah-langkah berikut.

Cara Install

  1. Lihat di dashboardnya pilih Template → Edit HTML nah sekarang biar aman CTRL+A terus Copy pindahin dulu semua kodenya ke editor yang kamu punya, jaga-jaga ntar takut terjadi kesalahan hehe.
  2. Nah sekarang masukan kode berikut sebelum tag </head> ambil dari line 02 sampai line 34.FYI: SyntaxHighlighter sekarang sudah versi 3.0.83 namun pada versi terbaru ini tidak ada fasilitas view source, copy to clipboard, print, help.
       
       
    
  3. Terakhir tinggal di Save deh templatenya.

Cara Memanggil

Pada editor blognya pilih HTML masukan kode seperti berikut ini
  
    
  
Tag "brush" bisa isi apa saja sesuai bahasa yang ingin kita masukan yang dinamakan alias. SyntaxHighlighter mendukung beberapa bahasa untuk aliasnya berikut adalah daftarnya
  • ActionScript3 → as3, actionscript3
  • Bash/shell → bash, shell
  • ColdFusion → cf, coldfusion
  • C# → c-sharp, csharp
  • C++ → cpp, c
  • CSS → css
  • Delphi → delphi, pas, pascal
  • Diff → diff, patch
  • Erlang → erl, erlang
  • Groovy → groovy
  • JavaScript → js, jscript, javascript
  • Java → java
  • JavaFX → jfx, javafx
  • Perl → perl, pl
  • PHP → php
  • Plain Text → plain, text
  • PowerShell → ps, powershell
  • Python → py, pyhton
  • Ruby → rails, ror, ruby
  • Scala → scala
  • SQL → sql
  • Visual Basic → vb,vbnet
  • XML → xml, xhtml, xslt, html

Contohnya seperti berikut, diberi tag C dan yang satu tag Plain pada satu syntax yang seharusnya C akan terlihat perbedaannya.
  /* Hello World */
  #include 
  #include 
   
  int main()
  {
      printf("Hello World\n");
      return 0;
  }

dengan
  /* Hello World */
  #include 
  #include 
   
  int main()
  {
      printf("Hello World\n");
      return 0;
  }

Bagaimana? gampangkan sekarang hehe. Kalau masih belum ngerti bisa langsung ditanyakan saja ya, terima kasih selamat mencoba! :)


4 Comments

  1. Kesalahan saat mengurai XML, baris 536, kolom 5: The element type link must be terminated by the matching end-tag /link

    BalasHapus
    Balasan
    1. Sudah saya betulin mas, silakan dicoba kembali yah :)

      Hapus
  2. dengan memasukan ke dalam template berpengaruh pada loading blog gan?

    BalasHapus
    Balasan
    1. selama ini ngga sih gan, tapi pernah ngalamin sih kalau koneksinya jelek balik lagi ke format bawaan blog :D

      Hapus