Kali ini kita akan bedakan antara kode CSS dan kode HTML serta kedudukannya di template. Ini penting agar kita tidak keliru antara dua jenis kode tersebut ketika membuat pengubahsuaian nanti.
Cuba perhatikan susunan kode CSS dan Kode HTML, setiap bahagian di susun mengikut susunan yang teratur. Ketika melakukan pengubahsuaian, memindahkan salah satu kode CSS (contoh: sidebar) maka kita juga harus memindahkan kode HTML sidebar mengikut kedudukan yang ada dibahagian kode CSS.
Berikut adalah kode CSS
body{
background: $(body.background);
}
#outer-wrapper{
width:100%;
}
#Navbar{
margin:0;
padding:0;
visibility:hidden;
display:none;
}
#header-wrapper{
width:908px;
height:200px;
}
#content-wrapper{
width:942px;
}
#sidebar-left{
width:210px;
}
#main-wrapper {
width: 360px;
}
#sidebar-right{
width:310px;
}
#footerbg{
width:923px;
height:20px;
}
Berikut adalah kode HTML
]]></b:skin>
</head>
<body>
<div id='outer-wrapper'>
<div id='blog-wrapper'>
<div id='header-wrapper'>
</div>
<div id='content-wrapper'>
<div id='sidebar-left'>
</div>
<div id='main-wrapper'>
</div>
<div id='sidebar-right'>
</div>
<!-- end content-wrapper -->
<div id='footerbg'>
</div>
</div> <!-- end outer-wrapper -->
Apa kaitan antara kode CSS dengan kode HTML di template?
Kode CSS adalah ibarat struktur blok. Mengubah berapa bahagian kode di CSS akan mengubah size serta warna latar atau background struktur blok tersebut.
Manakala kode HTML ibarat titik atau kedudukan dimana struktur blok yang telah siap diubahsuai ditempatkan. Sebagai contoh kita ingin memasang Linkbar widget dibawah header. Maka kode CSS Linkbar mestilah diletakan dibawah urutan kode CSS Header, sedangkan kode HTMLnya di letakan di bawah urutan kode HTML header.
Memahami susunan kode CSS serta kode HTML dalam blogger template adalah suatu perkara wajib bagi mereka-mereka yang sering melakukan pengubahsuaian. Semakin mendalam pengetahuan mereka dalam kode CSS dan HTML, akan lebih memudahkan mereka melakukan pengubahsuaian terhadap mana-mana jenis template.
Kenali Kode CSS Dan Kode HTML Pada Blogger Template
Panduan Membuat Kode HTML Parser Box
Saya sempat bingung juga bagaimana menamppilkan kode HTML dalam sebuah posting karena setelah saya coba beberapa kali tetap saja kode HTML tidak bisa ditampilkan dalam sebuah postingan.
tapi saya tidak putus saya akhir na saya coba browsing diinternet dengan bantuan mbah google yang akhir na saya menemukan sebuah gadget untuk memparser kode HTML agar dapat tampil di posting.
Sebenarnya gadget ini amat berguna untuk para blogger terutama kepada mereka-mereka yang sering membuat posting tentang blogger tips. Ada kalanya kita terpaksa buat post kode HTML untuk dicopy-paste oleh blogger.
Ini Kode Untuk Membuat HTML Parser Box
01 - Nama Parse Script boleh diubah mengikut kehendak masing-masing.
02 - Ukuran Box boleh diubah dengan menukar angka-angka di bahagian ini:
a) width: 400px
b) "top" width="400"
c) textarea cols="50"
03 - Cara Pengunaan: Copy-paste kode HTML yang hendak diparse kedalam kotak dan klik SEKALI sahaja.
04 - Cara Pemasangan: Pergi ke Blogger - Dashboard - Design - Add a Gadget – HTML/JavaScript - Save
05 - Contoh Parser Box lihat dibawah C/Box seri.
Kotak Kosong Untuk Menyimpan Kode HTML yang telah diparse agar kelihatan kemas sewaktu diposting. Copy-paste kodenya dibawah ini.
01 - Height boleh diubah mengikut kesesuaian.
02 - Border kalau ingin dibesarkan boleh guna angka tinggi, contoh 2 atau 3. Kalau hendak hilangkan border guna angka 0.
03 - 000000, ini warna border, boleh juga ditukar mengikut kesesuaian latar blog.
Sekian dari saya Semoga bermanfaat
