Xin chào các bạn, các bạn vừa trãi qua Serie Học Blogger Cơ Bản và đây là bài viết thứ #11 và Title bài viết hôm nay cực kì hot là Tìm hiểu cấu trúc của một Template blogger hoạt động như thế nào, cũng như các thành phần trong blogger
Cấu trúc của 1 website cơ bản như sau
<body>
Cấu trúc của Blogger Template cơ bản như sau
Tiếp theo chúng ta thêm các thành phần vào trong các cặp thẻ <skin>…<b:skin> và <head>…</head>
và sẽ được như sau, bạn dán tất cả vào và sẽ được Layout đơn giản như sau:
<?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 >
<head>
<b:include data=’blog’ name=’all-head-content’/>
<b:if cond=’data:blog.url == data:blog.homepageUrl’>
<title><data:blog.title/></title>
</b:if>
<b:if cond=’data:blog.pageType == "index"’>
<title><data:blog.pageTitle/></title>
<meta content=’Mô tả về blog của bạn’ name=’description’/>
<meta content=’Các từ khóa trên blog của bạn’ name=’keywords’/>
<b:else/>
<title><data:blog.pageName/> – <data:blog.title/></title>
<meta expr:content=’data:blog.pageName + " – Mô tả về blog của bạn"’ name=’description’/>
<meta expr:content=’data:blog.pageName + ", Các từ khóa trên blog của bạn"’ name=’keywords’/>
</b:if>
<b:skin><![CDATA[
body{
background: #cccccc;
font: 16px georgia;
}
#box{
Background:#3399bb;
Width: 990px;
Margin:0 auto;
}
#header{
Background:#4499bb;
thuộc tính 1;
thuộc tính 2;
…;
}
#main-outer{
Background:#113366;
}
#footer{
Background:#6600ee;
}
#sidebar1{
Background:#884400;
width:200px;
float:left;
}
#main{
Background:#646853;
width:590px;
float:left;
}
#sidebar2{
Background:#518643;
width:200px;
float:right;
}
#navbar-iframe {height:0px;visibility:hidden;display:none}
h2 {padding:0; margin:0}
]]></b:skin>
</head>
<body>
<b:section class=’navbar’ id=’navbar’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’Navbar1′ locked=’true’ title=’Thanh điều hướng’ type=’Navbar’/>
</b:section>
<div id=’box’>
Nội Dung Blog
<div id=’header’>
Nội Dung header
<b:section class=’head’ id=’head’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’Header1′ locked=’true’ title='(Tiêu đề)’ type=’Header’/>
</b:section>
</div>
<div id=’main-outer’>
<div id=’sidebar1′>
Nội Dung sidebar1
<b:section class=’sbar1′ id=’sbar1′ showaddelement=’yes’/>
</div>
<div id=’main’>
Nội Dung Bài Viết
<b:section class=’mainpost’ id=’mainpost’ showaddelement=’no’>
<b:widget id=’Blog1′ locked=’true’ title=’Bài đăng trên Blog’ type=’Blog’/>
</b:section>
</div>
<div id=’sidebar2′>
Nội Dung sidebar2
<b:section class=’sbar2′ id=’sbar2′ showaddelement=’yes’/>
</div>
<div style=’clear:both’/>
</div>
<div id=’footer’>
Nội Dung Footer
</div>
</div>
</body>
</html>
DienDan.Edu.Vn Cám ơn bạn đã quan tâm và rất vui vì bài viết đã đem lại thông tin hữu ích cho bạn.DienDan.Edu.Vn! là một website với tiêu chí chia sẻ thông tin,... Bạn có thể nhận xét, bổ sung hay yêu cầu hướng dẫn liên quan đến bài viết. Vậy nên đề nghị các bạn cũng không quảng cáo trong comment này ngoại trừ trong chính phần tên của bạn.Cám ơn.
