PORTAL KAJIAN ISLAM KONTEMPORER: Memadukan Wahyu dan Nalar Sehat Menuju Keseimbangan Hidup. "Banyak orang terjerumus karena menilai kebenaran dari SIAPA yang mengatakan, bukan dari APA yang dikatakan"

Desember 17, 2019

Cara Mudah Menampilkan Kode HTML dalam Postingan











Secara standar operasional kode2 HTML keberadaannya selalu tersembunyi di balik halaman website. Kendati demikian karena fungsi dari tag-tag HTML itulah sebuah browser bisa membuka dan menampilkan halaman website
dengan baik. Namun adakalanya untuk maksud dan keperluan tertentu kode HTML bisa ditampilkan dalam sebuah postingan, seperti untuk memudahkan pengunjung website memahami dan menerapkan sebuah penjelasan, menshare sebuah link, script iklan atau widget untuk dicopy paste dan lain- lainnya. Untuk menampilkan kode HTML dalam postingan di blog biasanya dilakukan dengan cara “melumpuhkan” atau menon-aktikan kode tersebut sehingga menjadi tidak berfungsi dan tampil di halaman web sebagai teks karakter biasa.
Cara dimaksud ialah dengan mengganti kode atau simbol2 dari HTML tersebut menjadi sebuah bentuk karakter HTML yang tidak berfungsi dalam sebuah sistem, sehingga browser pun hanya akan mengenali tag-tag tersebut sebagai sebuah simbol karakter biasa, tidak sebagai sebuah TAG HTML. Misalnya untuk menampilkan kurung sudut buka ( < ), kurung sudut tutup ( > ) dan kode2 lainnya diubah penulisannya menjadi sebagai berikut :

< = &lt;
> = &gt;
/ = & #47;
] = & #93;
[ = & #91;
" = & #34;
' = & #39;
& = &amp;

Contoh : &lt;html&gt;konten&lt;/html&gt; menjadi
<html>konten</html>


Proses ini disebut encoding atau parsing. Cara yang sama berlaku juga jika kita akan memasukan kode HTML ke dalam teks area dengan maksud untuk memudahkan copy paste. Namun dalam tulisan kali ini akan dibagikan cara yang “tricky” atau tidak biasa yang belum pernah dilakukan oleh siapapun dan tentu saja lebih mudah dan sederhana pengerjaannya. Untuk mencobanya, ikuti langkah-langkah sebagai berikut.
  • Masuk akun blogger
  • Klik Entri baru
  • Klik mode HTML



  • Copy paste kode berikut ini di halaman postingan.

    <div style="border: 1px #000000 solid; padding: 10px; background-color: #CEF6CE; text-align: left;"> Copy paste kode HTML yang akan ditampilkan </div>


  • Klik mode Compose
  • Copy paste kode HTML yang ingin ditampilkan di ruang yang disediakan dalam kotak
  • Tetaplah pada mode Compose dan jangan sekali-kali klik mode HTML lagi! Kalau ingin mengecek hasil, lebih baik klik Pratinjau
  • Klik Publish
  • Selesai.

    Mudah bukan? Selamat mencoba.

Simak Juga:




Posting Komentar