Cara Memasang Kode Snippet Di Blog Dengan Mudah

MadrasahJOS – Halo teman-teman, Pada postingan kali ini admin menulis sebuah tutorial cara membuat kode snippet atau cara memasang kode snippet di blog dengan mudah.

Programmer yang memiliki Blog pasti sering membagikan Source Code atau Listing Programmnya, jika kita menggunakan plain text tampilannya pasti sangat tidak menarik.

Berbeda jika kita menggunakan Kode Snippet tampilan akan menjadi terlihat menarik dan cantik bagi pengunjung.

Cara Memasang Kode Snippet Di Blog Dengan Mudah

Pada Tutorial ini kita tidak perlu membuat Kode Snippetnya, disini kita menggunakan pihak ke-tiga seperti Carbon dan Github, karena penggunaan-nya sangat mudah untuk diterapkan.

Cara Memasang Kode Snippet Di Blog Dengan Mudah

Menggunakan Kode Snippet dari Github Gist :

  • Tutorial yang pertama kita menggunakan Github gist, klik tautan di atas untuk mengunjungi halaman tersebut.
  • Sebelum memulai pastikan teman-teman sudah memiliki akun github, jika belum silahkan daftar terlebih dahulu.
  • Github gist memiliki pengaturan yang sedehana, kita hanya perlu mengisi kolom deskripsi gist, nama file.ekstensi dan kita bisa mempublish gist tersebut untuk pribadi atau untuk umum.
  • Dalam satu Gist, bisa terdapat banyak file dengan cara klik “Add File”.
Cara Memasang Kode Snippet Di Blog Dengan Mudah
Contoh Tampilan dari Github Gist
  • Setelah berhasil membuat Gist, kita akan melihat menu Embed, salin tautan tersebut lalu tempel di blog teman-teman dengan format HTML.
Cara Memasang Kode Snippet Di Blog Dengan Mudah
Copy Script Embed, lalu tempel di blog dalam format HTML.
  • Dibawah ini adalah Contoh Kode Snippet dari Github Gist.

Menggunakan Kode Snippet dari Carbon :

  • Tutorial yang ke-dua kita akan menggunakan Carbon, klik tautan di atas untuk mengunjungi halaman tersebut.
  • Carbon tidak mewajibkan kita membuat akun tetapi kalian bisa menghubungkan akun github kita ke Website Carbon.
  • Carbon biasa digunakan untuk membagikan listing kode berbentuk gambar ke sosial media supaya terlihat menarik dan clean.
  • Klik “Export” untuk meng-unduh hasil gambar, atau klik “Tweet” jika ingin langsung membagikannya ke Twitter.
  • Carbon memiliki beberapa pengaturan seperti warna background, warna editor dan lainnya.
Cara Memasang Kode Snippet Di Blog Dengan Mudah
  • Kita bisa menggunakan Carbon sebagai Kode Snippet di Blog dengan cara menyalin tautan iframe, cara-nya klik “menu copy”, lalu pilih “iFrame”.
  • Jangan lupa tempel di blog teman-teman dengan format HTML supaya bekerja dengan benar.
Cara Memasang Kode Snippet Di Blog Dengan Mudah
  • Dibawah ini adalah Contoh Kode Snippet dari Carbon.

Yap teman-teman, untuk sekarang cukup sekian untuk Cara Memasang Kode Snippet Di Blog Dengan Mudah, Jika kalian butuh bantuan bisa tinggalkan pesan komentar, semoga bermanfaat dan terima kasih sudah berkunjung.

Tinggalkan komentar