Mengenal Bagian-bagian Template Blogger. Sobat Murusawa, pada tutorial kali ini saya coba untuk sedikit menjelaskan bagian-bagian apa saja yang ada dalam tubuh template blogger. Mungkin ada diantara sobat sekalian yang ingin merubah tampilan templatenya baik itu background template, gambar header, judul widget atau yang lainnya. Nah mudah-mudahan panduan ini sedikit banyak bisa jadi pedoman buat sobat yang ingin belajar lebih jauh tentang bagaimana untuk men-setting template pada blog blogger.
Sebelum kita melangkah ke hal yang lebih detail, kita harus mengetahui bagian utama dari sebuah template blogger.
1. XML declarations
Letaknya paling atas (coba buka edit html pada blog sobat). XMl (eXtensible Markup Language) bagian ini menunjukkan definisi dari versi XML template. contoh penampakan:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<htmlxmlns='http://www.w3.org/1999/xhtml'xmlns:b='http://www.google.com/2005/gml/b'xmlns:data='http://www.google.com/2005/gml/data'xmlns:expr='http://www.google.com/2005/gml/expr'>
2. <head> TITLE & META TAG </head>
Dibagian ini terdapat Title blog, metatag deskripsi, dan meta tag keyword. Disini juga kita bisa meletakkan metatag Alexa, Google analystic, Robots atau metatag lainnya. contoh penampakan:
<b:include data='blog' name='all-head-content/'><b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='index, follow' name='robots'/>
<meta content='Free Software, Free Games, Download software Gratis, Free Download, Tutorial Blog, Tips Trick' name='description'/>
<meta content='Download Software, Software, Download Game, Game, Tutorial , Blogger, Tips Trick' name='keywords'/>
</b:if>
<meta content='uihZvcfKkxP2Kv_3lqI5anartQP1gAsaRT0EXnEJyqw' name='google-site-verification'/>
<title>Free Software, Free Game, Download Gratis, Free Download, Tutorial Blog, tips trick</title>
<meta content='bMoY2T7OKF89iKk_rGXNvwnU0lY' name='alexaVerifyID'/>
<title>Free Software, Free Game, Download Gratis, Free Download, Tutorial Blog, tips trick</title>
<scriptsrc='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'type= 'text/javascript>
3. <b:skin>Variable Definitions]]</b:skin>
Pada bagian ini tempat kita men-setting klasifikasi,nilai dan warna suatu atribut. contohnya kalau kita ingin merubah bentuk teks dan warna judul blog, Postingan blog, widget ,dll dengan catatan kita perhatikan terlebih dahulu keterangan dari masing-maisng variable. contoh penampakan:
<b:skin><![CDATA[
/* Variable definitions
====================
<Variable name="bgcolor" description="Page Background Color"
type="color" default="#fff" value="#ffffff">
<Variable name="textcolor" description="Text Color"
type="color" default="#333" value="#333333">
<Variable name="linkcolor" description="Link Color"
type="color" default="#58a" value="transparent">
<Variable name="pagetitlecolor" description="Blog Title Color"
type="color" default="#666" value="transparent">
<Variable name="descriptioncolor" description="Blog Description Color"
type="color" default="#999" value="transparent">
<Variable name="titlecolor" description="Post Title Color"
type="color" default="#c60" value="#cc6600">
<Variable name="bordercolor" description="Border Color"
type="color" default="#ccc" value="#cccccc">
<Variable name="sidebarcolor" description="Sidebar Title Color"
type="color" default="#999" value="#999999">
<Variable name="sidebartextcolor" description="Sidebar Text Color"
type="color" default="#666" value="#666666">
<Variable name="visitedlinkcolor" description="Visited Link Color"
type="color" default="#999" value="#999999">
<Variable name="bodyfont" description="Text Font"
type="font" default="normal normal 100% Georgia, Serif" value="normal normal 100% Georgia, Serif"> DAN SETERUSNYA........
Dibagian ini juga kita biasa meletakkan kode CSS ((Cascading Style Sheet), yaitu bahasa style sheeet untuk mengatur tampilan dokumen template.
4. <body> kode html</body>
Dibagian ini terdapat seluruh unsur berisi semua isi dari sebuah dokumen
HTML, seperti teks, hyperlink, gambar, tabel, daftar, copyright,dll. contoh penampakan:
<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='4' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='Cara Buat Web Gratis' type='Header'/>
<b:widget id='HTML17' locked='false' title='' type='HTML'/>
<b:widget id='HTML19' locked='false' title='' type='HTML'/>
</b:section>
</div>
<div id='content-wrapper'>
DAN SETERUSNYA.....
</body>
Nah itulah bagian-bagian pokok dari tubuh template yang harus kita pahami terlebih dahulu, kurang lebih seperti itulah intinya (sesuaikan dengan style template sobat, karena ada beberapa bagian yang bisa saja berlainan dengan aturan diatas). Sobat sekalian, rencananya
Mengenal Bagian Template Blogger (Untuk Pemula) ini akan saya buat dalam satu postingan, tetapi berhubung mata saya sudah sangat berat sekali (hooamm.... pukul 03.12 wib dini hari), maka mohon maaf kelanjutannya akan saya postingkan segera.