İnternetteki bir çok websitede html kod önizleme aracı mevcut ancak bence her blogda her sitede özellikle script vb. kod paylaşımı yapan website ve bloglarda.
HTML Kod Önizleme Kurulumu ;
Öncelikle bu aracı yeni bir sayfaya ekleyeceğimiz için Sayfalar bölümünden Yeni Sayfa butonuna tıklıyoruz ve sol üst köşede bulunan "HTML" butonuna tıklıyoruz ve aşağıdaki kodları yapıştırıyoruz ve kaydedip çıkıyoruz.
<!-- start: index -->
<html lang="tr" xml:lang="tr" xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body bgcolor="cccccc">
<!---Lazımlar---->
<style type="text/css">
body{
height:100%;
margin:0px;
padding:0px;
font-family: Verdana, Arial, Trebuchet MS, Lucida Sans Unicode;
color : #636770;
SCROLLBAR-ARROW-COLOR: #696969;
SCROLLBAR-BASE-COLOR: #D3D3D3;
SCROLLBAR-HIGHLIGHT-COLOR: #C0C0C0;
SCROLLBAR-SHADOW-COLOR: #808080;
SCROLLBAR-3DLIGHT-COLOR: #808080;
SCROLLBAR-TRACK-COLOR: #D3D3D3;
SCROLLBAR-DARKSHADOW-COLOR: #808080;
}
</style>
</body></html>
<style type="text/css">body {cursor: url(http://www.blinkyou.com/cursors/pg1/Bender Spinning.ani); }
FONT.sizethree {font-size: 16px}
</style>
<style type="text/css">
a:link {
color : #000000;
text-decoration : none;
}
a:visited {
color : #000000;
text-decoration : none;
}
a:active {
color : #0000FF;
text-decoration : none;
}
a:hover {
color :#0000ff;
text-decoration : none;
}
.font { font-family: Tahoma, Verdana, Geneva, Arial, sans-serif; font-size: 8pt; color: #333333}
</style>
<!---Lazımlar---->
<br />
<table align="center" border="1" bordercolor="666666" cellspacing="0" style="height: 468px; width: 624px;">
<tbody>
<tr>
<td background="/img/bgamavi2.png" bgcolor="#91A1BB" height="31" width="618"><div align="center">
<b><span style="color: black; font-size: medium;">KOD ÖN İZLEME ARACI
(KOD TEST)</span></b></div>
</td>
</tr>
<tr>
<td height="500" width="300"><table cellpadding="0" cellspacing="0" style="height: 412px; width: 500px;">
<!-- MSTableType="layout" -->
<tbody>
<tr>
<td height="368" width="618"><table align="center" cellpadding="0" cellspacing="0" style="width: 360px;">
<!-- MSTableType="layout" -->
<tbody>
<tr>
<td height="320"><div align="center">
<table style="background: #ebebea; border: solid 1px #959492; width: 600px;">
<tbody>
<tr><td valign="top"><form method="post" name="form1">
<textarea name="code" onclick="focus(this.code)" style="border: 1px solid #b9b8b6; height: 297; padding: 5px; scroll: auto; width: 171;" wrap="soft">ÖNİZLEMESİ YAPILACAK OLAN KODU BU ALANA YAPIŞTIRINIZ.
</textarea>
</form>
</td><td valign="top"><iframe frameborder="0" name="preview" src="about:blank" style="background: #ffffff; border: 1px solid #b9b8b6; height: 308px; width: 406px;">
</iframe>
</td>
</tr>
</tbody></table>
<button onclick="preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">ÖN İZLE</button>
<button onclick="window.document.form1.code.value='';preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">TEMİZLE</button>
<button onclick="window.location.href=window.location.href">YENİLE</button>
</div>
</td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td height="44" valign="middle" width="618"><div align="center">
<b>KODUNUZU YAPIŞTIRIP ÖN İZLEYE BASINIZ</b></div>
</td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
</tr>
</tbody></table>
<center>Lisans Sahibi : <a rel="dofollow" href="http://www.destweb.blogspot.com.tr">DestWeb</a>
Kod Yayıncısı : <a rel="dofollow" href="http://www.bloggereklentideposu.blogspot.com.tr">BloggerEklentiDeposu</a></center>
<!-- end: index -->Bütün işlemler bu kadar herkese kolay gelsin.