Cara Menampilkan Kode HTML Di Halaman Posting

Cara untuk menampilkan kode HTML ini biasa dilakukan untuk membuat tutorial-tutorial tertentu,baik untuk tutorial pembelajaran wordpress dan yang lain.
Pada awalnya saya juga tidak bisa tapi akhirnya saya tahu bagaimana menampilkan HTML dalam bentuk kode.
berikut ada 3 macam cara yang bisa anda lakukan untuk menampilkan kode html.

  1. Menggunakan sourcecode dari wordpress

    cara ini bisa dilakukan secara manual ,anda cukup meletakkan kode html diantara sourcecode,methodenya seperti ini [ sourcecode] kode HTML [ /sourcecode] .(hilangkan spasi).
    contoh hasilnya bisa lihat dibawah ini :

     <textarea rows="”6″" cols="”15″" name="”code”"&gt; &lt;a href="//arinaza.wordpress.com”" target="”_blank”"&gt;&lt;img border="”0″" alt="”arinaza”" src="//arinaza.wordpress.com/2011/03/arin.gif”" ></a></textarea> 
  2. Menggunakan Visual Editor

    cara ini bisa dikatakan cara yang paling praktis,dan hasilnya pun cukup dinamis,dan boleh dibilang ini merupakan satu-satunya cara otomatis yang bisa anda lakukan.
    caranya: buat tulisan baru di postng editor,dan pastikan anda ada dalam mode VISUAL,jika anda tidak dalam mode VISUAL cukup tekan tonbol tersebut maka anda sudah dalam mode visual,setelah itu paste/tempelkan kode HTML, di text editor.visual mode
    nah langkah terakhir anda tekan kembali tombol HTML,dan anda bisa lihat perubahanya……………..
    contoh hasilnya seperti berikut:

  3. <textarea rows=””6″” cols=””15″” name=””code””> <a href=”//arinaza.wordpress.com”” target=””_blank””><img border=””0″” alt=””arinaza”” src=”//arinaza.wordpress.com/2011/03/arin.gif”” /></a> </textarea>

    untuk tampilan yang lebih bagus lagi anda bisa memakai <blockquote> Kode HTML </blockquote>

    <textarea rows=””6″” cols=””15″” name=””code””> <a href=”//arinaza.wordpress.com”” target=””_blank””><img border=””0″” alt=””arinaza”” src=”//arinaza.wordpress.com/2011/03/arin.gif”” /></a>  </textarea>

    atau memakai kode textarea seperti ini:
    <textarea rows=””6″” cols=””15″” name=””code”> Kode HTML</textarea>
    usahakan menggunakan kode warna yang cerah agar kode HTML nya kelihatan.
    hasil contoh bisa anda lihat dibawah ini:

    <a href=”http://arinaza.wordpress.com” target=”_blank”><img border=”0″ alt=”arinaza” src=”http://arinaza.wordpress.com/2011/03/arin.gif”></a&gt;

    bagaimana hasilnya ..? bagus bukan.

  4. Menggunakan tanda < dan >
    cara ini merupakan cara terakhir yang saya ketahui,meskipun cukup repot karena cara ini dilakukan secara manual tapi cara ini bisa anda pakai sebagai alternatf jika cara pertama dan kedua tidak bisa…………
    caranya cukup mengganti tanda > dengan &gt;
    dan menganti tanda < dengan tanda &lt;

    sekian dan terima kasih…………..
    semoga bermanfaat bagi kita semua.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s