Tutorial Blogger Bab 1 bag 11
Di bandinghkan dengan Blogger Clasic ( old Blogger ). New blogger yang kita pelajari ini, lebih mudah dan gampang. Tampa perlu mempelajari kode-kode html sekalipun.
Namun ngga ada salahnya kita sedikit mempelajari anatomi kode-kode atau serangkain script yang ada di new blogger ini. terutama gunannya untuk mengkostumisasi biar New Blogger yang kita pake keliatan lebih dinamis dan sedikit cangih.
Untuk itu, buka Template klik -> tab Edit Html .
setelah terbuka di bawah tulisan Edit Template. keliatan serangkain kode-kode Html.
Secara garis besar yang perlu kita ketahui hanya dua bagian script yang perlu kita ketahui. pertama kode atau script Css dan kedua kode atau script Html.
Cara mengenali atau mengetahui ke dua bagian di atas cukup mudah.
Pertama : Kode atau Script Css. di awali dengan selector body dan di akhiri dengan script ]]></b:skin> ( atau kita anggap saja itu sebagai tag penutup css ).
Yang setiap bagiannya di beri kata keterangan atau komentar seperti kode ini.
/* Header ----------------------------------------------- */
artinya ini bagian kode css untuk header ( judul blog ).
Kode Css Bermula:
body { margin:0px; padding:0px; background:$bgcolor; color:$textcolor; font-size: small; } #outer-wrapper { font:$bodyfont; } a { color:$linkcolor; }
... Sampai dengan ...
/** Tweaks for layout editor preview */ body#layout #outer-wrapper { margin-top: 0; } body#layout #main, body#layout #sidebar { margin-top: 10px; padding-top: 0; }
Biasanya untuk meletakan javascript tambahan dari para blogger hack di simpan diantara kode di bawa ini.
]]></b:skin>
Javascript atau kode hack </head>
Kedua : code html. yang di awali dengan tag <body> dan tag penutupnya </body></html>. baris paling akhir.
<body> <div id='outer-wrapper'><div id='wrap2'>
<!-- skip links for text browsers --> <span id='skiplinks' style='display:none;'> <a href='#main'>skip to main </a> | <a href='#sidebar'>skip to sidebar</a> </span>
<div id='header-wrapper'> <b:section class='header' id='header' maxwidgets='1' showaddelement='no'> <b:widget id='Header1' locked='true' title='Milek Mile (Header)' type='Header'/> </b:section> </div>
.... sampai dengan ....
<div id='footer-wrapper'> <b:section class='footer' id='footer'/> </div>
</div></div> <!-- end outer-wrapper --> </body> </html>
kode-kode html di atas, saya tulis secara garis besar . dan Jika kita tandai kotak kecil di samping tulisan Expand Template Widget
maka akan terlihat serangkai kode-kode html yang lebih rinci lagi.
Jika kita tertarik ingin lebih memperdalam lagi tentang penjelasan setiap bagian kode-kode template new blogger , kita bisa klik di alamat ini :
http://www.wilkinsons.com/Bananna/BetaCodeLargeType.htm
Artikel Selanjutnya : Menganti Template atau Layout Blog
6 komentar:
Keren juga niyh blog
bantu banget
www.joelioujesus.blogspot.com
Makasih Bos atas penjelasannya
sekarang jadi lebih jelas tentang struktur blog
Makasih yah
Makasih..sgt membantu..
Wah, mntap flend..?!
nue..yg gwa cari...tq abiz decc!!!
keren lah ..... kalo bisa sih jelasin juga langkah awal jadi seorang hacker heheeee just kidink..!!
Post a Comment
" Apapun Yang Dapat Anda Lakukan, Atau Ingin Anda Lakukan Mulailah
Keberanian Memiliki Kecerdasan, Kekuatan Dan Keajaiban Di Dalam-nya"
Makacih Atas Komentar-Nya