Free Online HTML EDITOR

Nama Tools : Free Online HTML EDITOR
Fungsi Utama : Untuk edit kode css dan html/javascript, sobat bisa menggunakannya disini cukup dengan copy/paste kode css atau javascript, jangan lupa untuk menggeneratenya karena sobat akan langsung melihat hasil dari pengeditan kode tersebut.
 

Contoh Kode Cara Membuat Link :

<a href ="http://variasiblogger.blogspot.com/" title="Belajar SEO dan Blog Desain Simple Mudah Bagi Pemula" target="_blank" rel="nofollow">Belajar SEO dan Blog Desain Simple Mudah Bagi Pemula</a>

Contoh Kode Cara Pasang Link pada Gambar :

<a href='http://variasiblogger.blogspot.com/' rel='follow' title='Belajar SEO dan Blog Bagi Pemula'><img alt='Belajar Blog dan SEO Bagi Pemula' src='https://3.bp.blogspot.com/-_fjQpnd00NY/We4OTDUlgKI/AAAAAAAACy8/TA7KHpDiWmApQO9KWZQSyAL-Q8h1GIFGwCLcBGAs/s1600/ricky%2Baldiyansyah.jpg'/></a>

Bisa juga seperti ini untuk images atau gambar kodenya :

<img alt='Belajar Blog dan SEO Bagi Pemula' src='https://3.bp.blogspot.com/-_fjQpnd00NY/We4OTDUlgKI/AAAAAAAACy8/TA7KHpDiWmApQO9KWZQSyAL-Q8h1GIFGwCLcBGAs/s1600/ricky%2Baldiyansyah.jpg' height='50px' width='50px' title='Belajar SEO dan Blog Bagi Pemula'/>

Contoh kode gabungan dari css, html/javascript, warna, link, dan style font kodenya dibawah ini :

<!doctype html> <html> <head> <link href='http://fonts.googleapis.com/css?family=Ubuntu|UnifrakturMaguntia|Droid+Serif' rel='stylesheet' type='text/css'/> <meta charset=utf-8> <title>by Ricky Aldiyansyah</title> <style type="text/css"> p { color:#000; font-family:UnifrakturMaguntia,Arial,Tahoma,Helvetica,FreeSans,sans-serif; font-weight:bold ; font-size:16px; } a{color:#000; text-decoration:none;} a:hover,a:visited {color:#FF0000; text-decoration:underline} </style> </head> <body> <p>Selamat Bereksperimen Di :</p><a href='http://variasiblogger.blogspot.com/' target="_blank">Belajar Blog dan SEO Desain Simple Mudah Bagi Pemula</a> <canvas id=pane width=300 height=200></canvas> <script> var canvas = document.getElementById('pane'); var context = canvas.getContext('2d'); context.fillStyle = 'rgb(1, 148, 60)'; context.fillRect(10, 10, 55, 50); context.fillStyle = 'rgb(255, 191, 0)'; context.fillRect(30, 30, 55, 50); </script> </body> </html>

Oia kode gabungan itu sebenarnya masih bisa dikembangkan, itupun jika sobat berminat ingin mencoba belajar di html editor ini, soalnya saya juga belum begitu mahir dalam utak atik kode script, tapi saya mencoba berniat belajar dari berbagai macam sumber di google hehehe...

Dari keempat contoh diatas, silahkan coba masukkan kode - kode itu ke dalam tools HTML editor tersebut agar bisa mengetahui hasilnya seperti apa ?

Selamat mencoba dan bereksperimen untuk belajar modifikasi kode - kode yang pernah saya share di blogs sederhana ini..., dan jika sobat membutuhkan kode warna untuk merubah tampilan warna widget ataupun elemen - elemen yang ada di templatenya sobat bisa menggunakan tools tersebut di halaman Html Colors Codes
Panduan, Bimbingan Cara Belajar Blogs dan Seo