Cara Penulisan dan Menyimpan Kode HTML di blogspot

Salam sukses selalu buat sobat semua, Belajar Komputer Melalui Internet saat ini akan sedikit membahas tentang Cara Penulisan dan Menyimpan Kode HTML di blogspot dan semoga artikel ini bermanfaat.


Pembahasan cara-cara menyimpan kode HTML di template blogger-blogspot secara khusus dengan harapan bahwa para blogger yang masih dalam tahap belajar memodifikasi blog dapat melakukan proses penyimpanan kode HTML dengan benar.
Kekeliruan pada penggunaan tag style (). Bukan cara menuliskannya tetapi ketika kode CSS di simpan di atas kode ]]></b:skin>. Kasus yang banyak terjadi adalah melakukan penyimpanan kode CSS di atas kode tersebut dengan tetap mengikutsertakan tag style. meskipun kelihatannya seperti hal yang teramat sederhana, namun penggunaan tag style tersebut di atas kode ]]></b:skin> justru akan merusak desain yang telah direncanakan (di buat).

Menyimpan Kode CSS

Ada 4 cara dan tempat menyimpan kode CSS:
  1. Menyimpan kode CSS di atas kode ]]>.
  2. Menyimpan kode CSS di bawah kode ]]>.
  3. Menyimpan kode CSS di tag body (antara tag pembuka body - dan tag penutup body - .
  4. Menyimpan kode CSS dalam bentuk link. Kode CSS dalam bentuk link adalah kode CSS telah di upload terlebih dahulu di file Hosting (contoh: <link href="http://...../goodude/kode-css.css" rel="stylesheet" type="text/css" />).
Cara menyimpan kode CSS di atas kode ]]>

Untuk menyimpan kode CSS di atas kode ]]> anda tidak perlu menggunakan tag style.
Cara menyimpan yang salah
Perhatikan penggunaan tag style!
<style type="text/css">
.box {
width: 400px;
height: 200px;
padding: 10px;
border: 2px solid green;
margin: 20px auto;
overflow: auto;
color: white;
background: black;}
</style>
]]></b:skin>
Cara Menyimpan yang benar
.box { width: 400px;
height: 200px;
padding: 10px;
border: 2px solid green;
margin: 20px auto;
overflow: auto;
color: white;
background: black; }
]]></b:skin>
Menyimpan Kode CSS di bawah kode ]]> 

Untuk menyimpan kode CSS di bawah kode ]]>, silahkan lakukan penyimpanan dengan menggunakan tag style. Contoh cara penyimpanan kode CSS di bawah ]]>
]]></b:skin>
<style type="text/css">
.box { width: 400px; height: 200px; padding: 10px; border: 2px solid green; margin: 20px auto; overflow: auto; color: white; background: black; }
</style>
Cara menyimpan kode CSS di bagian body di antara tag dan tag (lewat Add a Gadget.
Contoh Penyimpanan Kode CSS yang BENAR pada Elemen Laman
<style type="text/css">
.box { width: 400px; height: 200px; padding: 10px; border: 2px solid green; margin: 20px auto; overflow: auto; color: white; background: black; }
</style>
Contoh Penyimpanan Kode CSS yang SALAH pada Elemen Laman
Perhatikan kode CSS ini di simpan melalui Add a Gadget tanpa tag style
.box { width: 400px; height: 200px; padding: 10px; border: 2px solid green; margin: 20px auto; overflow: auto; color: white; background: black; }
Menyimpan kode CSS berbentuk link. Kode CSS dalam bentuk link seperti contoh berikut:
<link href="http://wimg.co.uk/53P/tooltip.css" rel="stylesheet" type="text/css" media="all" />
dapat disimpan di atas kode , di bawah kode ]]>, di atas tag penutup body ("") atau melalui Add a Gadget --> HTML/Javascript.. Silahkan pilih tempat yang paling anda suka.

Cara Menyimpan javascript
Javascript dapat di simpan di atas kode (paling sering/umum dilakukan), di bawah , di bawah ]]>, di bawah , di atas (paling sering/umum dilakukan) atau melalui Add a Gadget --> HTML/Javascript (juga banyak dilakukan dengan cara ini).

Contoh penulisan javascript-1
<script type="text/javascript">
function show_alert() { alert("Hello, world! whats are u doing ?"); }
</script>
Contoh penulisan javascript-2
<script type="text/javascript"> //<![CDATA[ /* kode khusus - pembuka*/
function show_alert() { alert("Hello, world! whats are u doing?"); }
//]]> /* kode khusus - penutup */
</script>
Apabila javascript telah di upload di file/javascript hosting, penyimpanan dapat dilakukan di atas , di atas atau lewat Add a Gadget (tergantung sifat javascript-perhatikan perintah tutorial!). Javascript yang telah di upload dituliskan sebagai sebuah link dengan cara seperti ini:
<script src="http://wimg.co.uk/k8W/goodude/js/anima.js" type="text/javascript"></script>
atau
<script src="http://wimg.co.uk/k8W/goodude/js/anima.js" language="javascript"></script>
atau
<script src="http://wimg.co.uk/k8W/goodude/js/anima.js" type="text/javascript" language="javascript"></script>
Penulisan xHTML
xHTML disimpan dalam tag body diantara tag pembuka body - dan tag penutup body - baik dilakukan secara langsung di template (Edit HTML) atau melalui Add a Gadget dan di halaman posting

Contoh penulisan xHTML
<div style="width: 400px; height: 200px; background: #000; color: #eee; font-size: 14px;
border: 2px solid red">
welcome to goodude,semoga anda menikmati berita dan tutorial dari kami!
welcome to goodude,semoga anda menikmati berita dan tutorial dari kami!
welcome to goodude,semoga anda menikmati berita dan tutorial dari kami!
</div>

Mungkin sampai disini dulu Belajar Komputer Melalui Internet tentang Cara Penulisan dan Menyimpan Kode HTML di blogspot kali ini, semoga bermanfaat bagi Anda.

DAPATKAN ARTIKEL VIA EMAIL

Masukan Alamat Email Sobat:

Delivered
feedburner

Dipublish oleh : Abdul Kohar - Jatinangor Rating 5 Belajar Komputer Melalui Internet, Updated at: 03:46

4 komentar :

  1. wah mantep bgt nich sob, sangat membantu bgt, n sangat bermanfaat benar, mkasih sob :)

    BalasHapus
  2. gan pingi da artikel terkait dengan gambar nya gimana?mohon petunjuk

    BalasHapus
  3. Kalau ganti tema blogspot gimana gan? soalnya saya biasa pake wordpress..heheh mohon petunjuk

    BalasHapus
  4. Nice info mas... kunjungan pertama nih .. salam kenal

    BalasHapus
Silahkan Tinggalkan jejak sobat, bila mau menggunakan emotion silahkan klik emotionnya kemudian copy dengan ctrl+c dan paste kodenya didalam kotak komentar...

close
GUESTBOOK
Google PageRank Checker Powered by  MyPagerank.Net
backlink
Dashboard
| Copyright © 2012 |
| Belajar Komputer Melalui Internet |
| Desain by: Abdul Kohar | Powered by: Blogger |