Home » » Bagian-bagian Template Blogger

Bagian-bagian Template Blogger

Apa saja bagian- bagian template blog? Cari letak template blog..!
Login ke blogger
Pilih Template + Edit HTML + Expand template widget
Bagian-bagian Template Blogger :

1. Bagian pertama, Pada bagian ini menggunakan deklarasi bahasa XML contoh
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='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'>
Baris pertama adalah deklarasi XMLmengidentifikasikan dokumen sebagai dokumen XML. Baris kedua adalah deklarasi HTML. Baris ketiga adalah deklrasi XHTML versi XML dari HTML

2. Bagian kedua Terdiri dari : head , title dan metatags contoh
<head>
<title><data:blog.pageTitle/></title>
<b:include data='blog' name='all-head-content'/>
<META content='6UdGiVvyAoLArGpux3xzus9nP4VEkAdsnY8mgwQKg4g=' name='verify-v1'/>
<meta content='Bet Blogger for Dummies' name='Description'/>
<meta content='beta blogger,blogger,blog,hacks,hacking beta blogger template,template,beta blogger template, blogskin,Google blog, google blogger' name='keywords'/>
<meta content='index,follow' name='robots'/>
Metatags menginformasikan kepada search engine subjek blog dan penting dalam mengindex blog.(penting banget.....)

 3. Bagian Ketiga
Pada bagian ini disebut dengan "Devinisi Variabel" yaitu mendeklarasikan dan mereson "font dan color" contoh


<b:skin><![CDATA[/*
Blogger Template Style
Name: Minima
Designer: Douglas Bowman
URL: www.stopdesign.com
Date: 26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

/* 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="#0000ff">
............  


Disini seksen CDATA dimulai dan digunakan untuk menyisipkan dokumen XML ke dokumen XML lainnya. seksi ini di mulai dengan <[CDATA] dan diakhiri dengan ]]> Proses XML mengabaikan semua markup kecuali untuk ]]> (artinya tidak mungkin seksen CDATA pada CDATA yang lain). CDATA yang lain akan di block sampai CDATA di tutup ]]>


4. Bagian Keempat Pada bagian ini adalah Tempalte CSS (Cescading style sheet)


/* Use this with templates/template-twocol.html */

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
text-decoration:underline;
.............

/* Footer
----------------------------------------------- */
#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}

/** Page structure tweaks for layout editor wireframe */
body#layout #header {
margin-left: 0px;
margin-right: 0px;
}
]]></b:skin>
</head>

Catatan bahwa CDATA disini diakhri dengan ]]>

dan...

5. Bagian Kelima contoh bagian ini adalah


<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='2' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='Beta Blogger For Dummies (Header)' type='Header'/>
<b:widget id='HTML6' locked='true' title='' type='HTML'/>
</b:section>
</div>

<div id='content-wrapper'>
<div id='newsidebar-wrapper'>
<b:section class='sidebar' id='newsidebar' preferred='yes'>
<b:widget id='HTML10' locked='false' title='CONTACT AUTHOR' type='HTML'/>
<b:widget id='LinkList1' locked='false' title='' type='LinkList'/>
<b:widget id='HTML4' locked='true' title='' type='HTML'/>
<b:widget id='HTML1' locked='true' title='' type='HTML'/>
<b:widget id='HTML9' locked='false' title='' type='HTML'/>
<b:widget id='HTML7' locked='false' title='' type='HTML'/>
<b:widget id='HTML8' locked='false' title='' type='HTML'/>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
</b:section>
</div>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='yes'>
<b:widget id='HTML2' locked='false' title='' type='HTML'/>
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog'/>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
</b:section>
</div>

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML5' locked='true' title='' type='HTML'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='HTML11' locked='false' title='' type='HTML'/>
</b:section>
</div>

<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>

</div> <!-- end content-wrapper -->

<div id='footer-wrapper'>
<b:section class='footer' id='footer'>
<b:widget id='Text1' locked='false' title='' type='Text'/>
</b:section>
</div>

</div></div> <!-- end outer-wrapper -->

</body>
</html>
Pada bagian ini terlihat jelas <body> di close </body>. See also Cara Memasang Adsense dalam Postingan

1 komentar:



Popular Posts