Saturday, March 7, 2009

Menampilkan kod/script diposting

Menampilkan kod css/html/script diposting ada caranya tersendiri.Terpulang pada empunya blog bagaimana cara yang paling mudah dan unik..ataupun menarik.Ada yang menampilkan seperti biasa,ada juga dalam kotak (kurungan)dan ada yang highlight kodnya,seperti tutorial ini.Anda boleh lihat contoh dibawah agar lebih jelas lagi apa yang penulis ingin sampaikan.


Bagaimana caranya anda ingin menampilkan kod ini diposting?Sebelum itu anda haruslah encode dulu kodnya.

contoh 1,cara biasa
<div class="codeview">Taruh kode HTML, css, Javascript code</div>
atau
<p class="alert">Taruh kode HTML, css, Javascript code</p>

contoh 2,dalam kotak
<div class="codeview">Taruh kode HTML, css, Javascript code</div>
atau
<p class="alert">Taruh kode HTML, css, Javascript code</p>

contoh 3,Highlight kod
<div class="codeview">Taruh kode HTML, css, Javascript code</div>
atau
<p class="alert">Taruh kode HTML, css, Javascript code</p>

Sudah jelas.Jika sudah, langsung kita ke tutorial 'tampilkan kod diposting cara ke-4'.Cara ini hanya menggunakan command css(coret sana sini),tanpa perlu encode kodnya.

1.login ke blog anda.Pilih Layout-->Edit html.

2.Setelah itu,copy kod dibawah ini dan pastekan dibawah kod ]]</b:skin>

.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(http://i280.photobucket.com/albums/kk162/mochal_nl_2008/cv-1.gif) no-repeat right bottom;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}

3.Kemudian klik preview dulu, jika tiada sebarabg error yg muncul baru save hasil kerja anda.

4.Untuk menampilkan kod tersebut diposting,anda haruslah menulis didalam mode Edit Html dan juga mengguna kod dibawah ini.

<div class="codeview">

Tulis kode HTML, css, Javascript code dan sebagainya disini....

</div>
Contoh hasil menampilkan kod diposting dengan code view.

0 comments:

Post a Comment

Tampilkan kod diposting
Tab 2.2
Tab 2.3

Tab 3.2
Tab 3.3
BlogInfoTips
Free Manchester United Badge MySpace Cursors at www.totallyfreecursors.com

Tab 4.3
 

About

Site Info

My Blog List

Text

pelajari-blog Copyright © 2009-2010 This site best viewed in Firefox 3.5 + at 1024x768 or higher resolution deen