Menambah KODE HTML baru pada template haruslah dilakukan dengan cara yang tepat. Penambahan yang dilakukan tanpa mengenal terlebih dahulu pola penggunaan KODE HTML terkadang justru membuat penampilan blog berubah bentuk yang sangat jauh dari harapan. Kesalahan pemasangan KODE umumnya banyak terjadi karena kesalahan dalam penempatan atau karena adanya kesalahan cara penulisan KODE. Beberapa tips di bawah ini mungkin bisa menjadi solusi untuk menempatkan KODE HTML dan CSS baru :
Penambahan KODE baru dilakukan dengan cara menempatkan KODE sebelum tanda }
Bentuk sintak setelah dilakukan penambahan KODE baru :
- Perhatikan bentuk font kode yang digunakan sebagai tambahan. Seringkali KODE body baru menggunakan KODE dalam huruf besar (BODY). Ubah KODE kebentuk seperti yang digunakan pada template (default template). Misalnya :
- KODE baru yang dipergunakan sebaiknya menggunakan standar template, seperti:
Kode yang sering ditambahkan disini berupa javascript.
- Contoh :
- Rubahlah tetap dalam bentuk standar template, sehingga bentuknya menjadi :
- contoh kode:
- Letakkan KODE tersebut di atas KODE ]]></b:skin> tanpa menambahkan atribut style yang bentuknya seperti ini:
, sehingga ketika kode di simpan di atas ]]></b:skin> bentuknya akan seperti ini:
Untuk menyimpan kode di bawah ]]></b:skin;, sampeyan harus menggunakan tag style sehingga bentuknya akan seperti ini:
Simpan kode CSS (link CSS) di bawah <head> atau di atas &ly;/head>
Contoh alamat CSS yang dipergunakan :
- http://h1.ripway.com/GR_menuhorz.css
- KODE di tempatkan di atas KODE :
Update » Senin PAHING, January, 30, 2012
Penambahan kode CSS baru pada sebuah syntax:
Kode sebelum perubahan (default):
.sidebar {
color:#c1edec;
line-height:0.5em;
padding-top:5px;
}
Penambahan KODE baru dilakukan dengan cara menempatkan KODE sebelum tanda }
Bentuk sintak setelah dilakukan penambahan KODE baru :
Kode setelah perubahan:
.sidebar { color:#c1edec; line-height:0.5em; padding-top:5px; background:#fff; /* kode baru */ border:1px solid blue; /* kode baru */ }
Penambahan kode di bagian body :
- Perhatikan bentuk font kode yang digunakan sebagai tambahan. Seringkali KODE body baru menggunakan KODE dalam huruf besar (BODY). Ubah KODE kebentuk seperti yang digunakan pada template (default template). Misalnya :
Contoh:
BODY{
margin: 0px;
padding: 0px;
......
......
}
- KODE baru yang dipergunakan sebaiknya menggunakan standar template, seperti:
Kode setelah perubahan:
body {
margin: 0px;
padding: 0px;
......
......
}
Penambahan KODE di dalam tag pembuka body (<body>).
Kode yang sering ditambahkan disini berupa javascript.
- Contoh :
<BODY onload="rotate()">
- Rubahlah tetap dalam bentuk standar template, sehingga bentuknya menjadi :
<body onload="rotate()">
Menyimpan kode CSSdi atas kode ]]></b:skin;
- contoh kode:
Contoh:
#menuddhorz { background: #fff; padding: 20px 10px; width: 930px; border:1px solid #000; margin:5px 0; } #menuddhorz li a { color: blue; text-decoration: none; } #menuddhorz li a:hover { color: red; text-decoration: underline; }
- Letakkan KODE tersebut di atas KODE ]]></b:skin> tanpa menambahkan atribut style yang bentuknya seperti ini:
Atribut style
<style type="text/css">
Biasanya di sini diletakkan kode CSS. Bila kode CSS di simpan di atas kode ]]></b:skin>, maka tag pembuka dan penutup style tidak di perlukan.
</style>
, sehingga ketika kode di simpan di atas ]]></b:skin> bentuknya akan seperti ini:
Hilangkan atribut style:
#menuddhorz {
background: #fff;
padding: 20px 10px;
width: 930px;
border:1px solid #000;
margin:5px 0;
}
#menuddhorz li a {
color: blue;
text-decoration: none;
}
#menuddhorz li a:hover {
color: red;
text-decoration: underline;
}
]]></b:skin>
Menyimpan kode CSS di bawah ]]></b:skin;
Untuk menyimpan kode di bawah ]]></b:skin;, sampeyan harus menggunakan tag style sehingga bentuknya akan seperti ini:
Pemulisan kode :
]]></b:skin; <style type="text/css"> Di sini letak kode CSS! </style>
Contoh dg kode CSS:
]]></b:skin> <style type="text/css"> #menuddhorz { background: #fff; padding: 20px 10px; width: 930px; border: 1px solid #000; margin: 5px 0; } #menuddhorz li a { color: blue; text-decoration: none; } #menuddhorz li a:hover { color: red; text-decoration: underline; } </style>
Cara menambahkan KODE CSS baru yang tersimpan di file hosting :
Simpan kode CSS (link CSS) di bawah <head> atau di atas &ly;/head>
Contoh alamat CSS yang dipergunakan :
- http://h1.ripway.com/GR_menuhorz.css
- KODE di tempatkan di atas KODE :
Penempatan link css:
<head> <link href="http://h1.ripway.com/GR_menuhorz.css" rel="stylesheet" type="text/css"/>
Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :
Update » Senin PAHING, January, 30, 2012
» Happy Blogging - gubhugreyot «
silahkan tulis sebuah komentar!
gubhug reyot