Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / blogging / Tutorial

Cara Menampilkan Source Code Di Halaman Artikel Postingan Blog


Teman-teman sekalian niscaya pernah atau sering melihat sebuah tutorial di blog, contohnya cara membuat/memasang widget Recent Comment, Artikel Populer, dll yang disertai sebuah source code atau script HTML, CSS, JavaScript yang nantinya akan dipasang di widget tersebut.

Misalnya menyerupai ini teladan dibawah ini : 

1:   .w2b_recent_comments li span{margin-top:4px;color: #000000;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}   2:  </style>   3:  <script type="text/javascript">   4:  //<![CDATA[   5:    // Recent Comments Settings   6:    var   7:   numComments = 5,   8:   showAvatar = true,   9:   avatarSize = 30,   10:   roundAvatar = false,   11:   characters = 30,   12:   defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",   13:   hideCredits = true;   14:  //]]>   15:  </script>   16:  <script

Nah.. bagaimana cara membuatnya? untuk menciptakan SyntaxHighlighter (nama istilahnya) tersebut ternyata caranya sangat mudah. mari kita bahas yuk..

Sebenarnya pihak blogger sudah menyediakan kemudahan ini hanya saja mungkin tidak banyak yang tau atau tampilannya yang memang kurang di sukai. caranya begini, pada dikala kita akan memposting sebuah artikel diblog coba lihat di sebelah kanan disitu ada sajian “Setelan Entri” dan di paling bawah ada sajian “Pilihan”.  disitu ada tertulis “Tunjukan HTML apa adanya” maksudnya apabila kau menulis sebuah source code di halaman posting maka akan muncul menyerupai apa adanya. tapi akan terjadi sebaliknya bila kau menentukan “Tafsirkan HTML yang di ketik” (Lihat gambar dibawah ini).


Coba lihat hasilnya……. jreeenggg…  tapi jangan khawatir apabila kau kurang puas coba kita buat yang lebih baik dari itu.. ayo kita bahas di bawah ini bagaimana cara membuatnya dengan cara yang lain.
  1. Klik link berikut http://codeformatter.blogspot.co.id/
  2. Lihat gambar dibawah ini.

  3. Pastekan Source Code mu kedalam kotak "Paste Here Your Source Code"  tersebut.
  4. Pilih jenis model tampilannya dikala tampil di artikel kau nanti.
  5. Setelah simpulan klik "Format Source Code".

    Jika sudah kau lakukan langkah diatas, mari kita lihat ke langkah pembahasan selanjutnya. (lihat gambar dibawah ini).

  6. Lihat hasil tampilannya di kotak "Preview Of Formatted Source Code".jika kau kurang merasa puas dengan hasil tampilannya, ulangi mulai dari langkah 4(empat).
  7. Jika sudah kau rasa cocok, copy kan semua codenya yang ada di kotak "Copy Formatted Source Code" ke halaman postingan artikel kamu.

  8. Pilih HTML di halaman postingan blog kamu, lalu pastenya Source code tadi ke dalam area HTML tersebut..
Nah, selamat mencoba ya teman-teman, agar artikel ini dapat menjadi solusi mengatasi permasalahan bagaimana caranya Menampilkan Source Code di halaman Artikel Postingan Blog. 



Sumber https://klikbmp.blogspot.com/