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:
- Menyimpan kode CSS di atas kode ]]>.
- Menyimpan kode CSS di bawah kode ]]>.
- Menyimpan kode CSS di tag body (antara tag pembuka body - dan tag penutup body - .
- 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" />).
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">Cara Menyimpan yang benar
.box {
width: 400px;
height: 200px;
padding: 10px;
border: 2px solid green;
margin: 20px auto;
overflow: auto;
color: white;
background: black;}
</style>
]]></b:skin>
.box { width: 400px;Menyimpan Kode CSS di bawah kode ]]>
height: 200px;
padding: 10px;
border: 2px solid green;
margin: 20px auto;
overflow: auto;
color: white;
background: black; }
]]></b:skin>
Untuk menyimpan kode CSS di bawah kode ]]>, silahkan lakukan penyimpanan dengan menggunakan tag style. Contoh cara penyimpanan kode CSS di bawah ]]>
]]></b:skin>Cara menyimpan kode CSS di bagian body di antara tag dan tag (lewat Add a Gadget.
<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 BENAR pada Elemen Laman
<style type="text/css">Contoh Penyimpanan Kode CSS yang SALAH pada Elemen Laman
.box { width: 400px; height: 200px; padding: 10px; border: 2px solid green; margin: 20px auto; overflow: auto; color: white; background: black; }
</style>
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">Contoh penulisan javascript-2
function show_alert() { alert("Hello, world! whats are u doing ?"); }
</script>
<script type="text/javascript"> //<![CDATA[ /* kode khusus - pembuka*/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:
function show_alert() { alert("Hello, world! whats are u doing?"); }
//]]> /* kode khusus - penutup */
</script>
<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
Dipublish oleh :
Abdul Kohar - Jatinangor Rating 5
wah mantep bgt nich sob, sangat membantu bgt, n sangat bermanfaat benar, mkasih sob :)
BalasHapusgan pingi da artikel terkait dengan gambar nya gimana?mohon petunjuk
BalasHapusKalau ganti tema blogspot gimana gan? soalnya saya biasa pake wordpress..heheh mohon petunjuk
BalasHapusNice info mas... kunjungan pertama nih .. salam kenal
BalasHapus