Sabtu, 09 Januari 2010

Cara Menampilkan Kode HTML Dalam Artikel Yang Kita Posting

09.32 by BLECKURANT ·
Label: ,



Mungkin teman-teman netter sekalian pernah mengalami pengalaman seperti saya waktu pertama kali memposting kode HTML dalam blog. Karena ketika kita memposting kode HTML secara langsung maka hasil yang nantinya ditampilkan tidak sesuai dengan harapan atau malah muncul karakter-karakter aneh yang tidak kita mengerti.

Untuk menampilkan sebuah kode HTML dapat anda lakukan tahapan sebagia berikut:

1. Lakukan parse terhadap kode HTML yang ingin ditampilkan.
Untuk mengetahui cara melakukan parse anda dapat membaca artikel saya Cara Melakukan Parse Kode HTML
Hal ini berfungsi agar nantinya kode HTML tersebut dapat ditampilkan sesuai dengan keinginan kita.

Misalnya kode ( Tulisan Warna Biru) yang ingin kita tampilkan kedalam postingan adalah sbb:

KODE 1
(Kode HTML Yang Ingin Kita Tampilkan)


<titttle> Uji COba </titttle>
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>


Jika kode tersebut langsung kita masukan ke postingan dengan cara meng'copy paste secara langsung maka hasilnya (Tulisan Warna Biru) setelah postingan ditampilkan adalah sbb:

KODE 2 (Hasil Kode HTML Jika Ditampilkan Tanpa Melakukan Parse)


Uji COba



Dari KODE 2 diatas jelas sekali perbedaan dengan kode aslinya pada KODE 1, yakni dari 3 baris pada KODE 1 hanya ditampilkan satu baris saja itupun hanya sebagian sedangkan kode lainnya hanya terbaca sebagai spasi atau karakter lain dan ini maksud saya hasil yang ditampilkan tidak sesuai dengan yang kita harapkan.

Maka dari itu untuk bisa menampilkan kode agar hasilnya nanti sama persis dengan KODE 1 maka harus dilakukan parse ( baca: Cara Melakukan Parse Kode HTML). Hasilnya jika KODE 1 dilakukan parse adalah sbb:

KODE 3 (Kode Hasil Parse Dari Kode HTML Pada KODE 1)

&lt;titttle&gt; Uji COba &lt;/titttle&gt;
&lt;b:loop values='data:posts' var='post'&gt;
&lt;b:loop values='data:post.labels' var='label'&gt;


2. Setelah kita mendapatkan kode hasil parse diatas (KODE 3) maka kode inilah yang nantinya akan disisipkan kedalam postingan anda seperti pada gambar dibawah dan baru setelah itu tekan "Terbitkan Entri"



3. Apabila ingin menambahkan scroll untuk postingan kode HTML anda seperti contoh dibawah ini:



Maka anda perlu menambahkan kode (Tulisan Warna Biru):


<p align="left"><textarea name="code" rows="10" cols="35">
Kode HTML Yang Sudah Anda Parse
</textarea></p>


Jadi untuk menghasilkan tampilan seperti contoh diatas maka kodenya adalah sbb:

<p align="left"><textarea name="code" rows="10" cols="35">
&lt;b:loop values='data:posts' var='post'&gt;
&lt;b:loop values='data:post.labels' var='label'&gt;
textLabel = &amp;quot;&lt;data:label.name/&gt;&amp;quot;;
var test = 0;
for (var i = 0; i &amp;lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &amp;lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &amp;lt; maxLabels) {
search10(homeUrl3, textLabel);
</textarea></p>


kribo
OK untuk sementara mungkin itu saja tentang penjelasan mengenai Cara Menampilkan Kode HTML Dalam Artikel Yang Kita Posting...

Artikel Terkait:

5 komentar:

Iyandri mengatakan...
20 Januari 2010 22.54

gimana ini ya ? kuq masih bingung aku

BLECKURANT mengatakan...
21 Januari 2010 21.44

Kalau masih bingung nanti akan saya update lagi mas artikel saya "Cara Menampilkan Kode HTML Dalam Artikel Yang Kita Posting"...
Seenggak2nya biar lebih jelas.. :)

BLECKURANT mengatakan...
22 Januari 2010 01.57

artikel sudah selesai saya update, apabila masih bingung atau malah tambah bingung :D

silahkan anda tanyakan..

thx

Amigos mengatakan...
22 Januari 2010 02.37

makasih buat infonya bro..

sangat membantu..

gamatatsu mengatakan...
22 Januari 2010 08.16

nice post kk'.. :)

:)) :)] ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} ~x( :-t b-( :-L x( =))

Posting Komentar


obamabush

Membangun DNS Server

Pada artikel ini akan membahas bagaimana membangun sebuah server Domain Name Systems atau biasa disebut dengan DNS pada linux Ubuntu (dalam hal ini menggunakan Ubuntu 7.10),[...]
beyone

Membangun Apache Web Server

Apache selama bertahun-tahun menjadi pilihan pengguna linux. Disamping bersifat open source, Apache mudah dikonfigurasi, performa dan keamanan cukup baik, [...]
Guns N 'Roses

Serangan XSS (Cross Site Scripting)

XSS adalah singkatan dari kata Cross-Site Scripting yang artinya script yang dijalankan dengan memanfaatkan perantara. XSS tidak menyerang korban secara langsung namun memanfaatkan perantara untuk melakukannya [...]
ipod

Bagaimana Memilih Sebuah Franchise

Dalam artikel kali ini saya mencoba share pengetahuan tentang bagaimana dalam memilih franchise. Mungkin hal ini akan berguna bagi rekan-rekan sekalian yang ingin membangun atau membeli sebuah franchise.[...]
Guns N 'Roses

Komponen Pembangun Touch Screen

Touch screen merupakan sebuah perangkat keras yang mirip seperti monitor komputer tetapi mempunyai kelebihan dibandingkan monitor biasa. Layar sentuh atau dalam bahasa Inggrisnya Touchscreens, touch screens, touch panels atau touch screen panels adalah [...]
Guns N 'Roses

Media Transmitter Dalam Jaringan Komputer

Melanjutkan artikel saya sebelumnya yang berjudul "Mengenal Perangkat Keras Jaringan", artkel saya kali ini akan membahas media transmitter bagi perangkat keras tersebut. Media penghubung atau transmitter pada suatu jaringan [...]

Live Chat

Followers