Kerangka ini juga kerangka yang saya gunakan pada template ini. Kerangka ini dapat anda gunakan sebagai kerangka default dalam langkah pembuatan template blog.
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML expr:class='data:blog.languageDirection + " no-js rwd"' expr:dir='data:blog.languageDirection'>
<head>
<meta charset='utf-8'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'><link href='https://plus.google.com/ID_G-pluss' rel='author'/></b:if>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType == "error_page"'>
<title>404: Page Not Found ~ <data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> ~ <data:blog.title/></title>
</b:if>
</b:if>
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='blogger' name='generator'/>
<link expr:href='data:blog.homepageUrl + "favicon.ico"' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " - RSS"' rel='alternate' type='application/rss+xml'/>
<link expr:href='"http://www.blogger.com/feeds/" + data:blog.blogId + "/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if>
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:else/>
<meta expr:content='data:blog.pageName + " - " + data:blog.title' name='description'/>
</b:if>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='Deskripsi - Blog' name='description'/>
<meta content='Keyword blog' name='keywords'/>
</b:if>
<style type="text/css"><!-- /* <b:skin><![CDATA[
Disini nantinya akan di isi CSS untuk Layout Tata Letak
*/]]></b:skin>
<style type='text/css'>
/*
Name : Kerangka template dengan Schema.org
Designer: Rifan Hidayat
URL : http://ngudang.blogspot.com
*/
Tulis CSS anda disini, mulai dari outer-wrapper dan seterusnya
</style>
Jquery disini
</head>
<body expr:class='data:blog.pageType' itemscope='itemscope' itemtype='http://schema.org/WebPage'>
<div id='outer-wrapper'> <!-- Disini posisi elemen outer-wrapper -->
<header class='header' id='header' itemscope='itemscope' itemtype='http://schema.org/WPHeader'>
<!-- Disini lokasi untuk Header judul dan deskripsi Blog -->
</header>
<div id='main-wrapper' itemprop='mainContentOfPage'>
<!-- Disini lokasi untuk posting dan komentar dan b:section dibawah ini adalah widget untuk posting dan komentar -->
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'/>
</b:section>
</div>
<aside id='sidebar-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPSideBar'>
<!-- Disini Lokasi sidebar blog yang berisi widget, dan kode b:section dibawah ini adalah kode untuk widget sidebar -->
<b:section class='sidebar' id='sidebar-kanan' showaddelement='yes'>
</b:section>
</aside>
<div class='clear'> </div>
<div class='clear'/> <!-- Pembatas dari outer-wrapper -->
<footer class='clear' id='site-footer' itemscope='itemscope' itemtype='http://schema.org/WPFooter'>
<!-- Disini lokasi footer, bisa di isi widget dan copyright desainer -->
</footer>
</div> <!-- Akhir dari outer-wrapper -->
<!--</body>--></body></HTML>
wah boleh juga nih, keren mas...
ReplyDeletecoba dulu sob..... :D :D :D
ReplyDeleteSederhana Tapi Hasilnya Bagus Sob.Itu Udah Valid Html 5 ya??
ReplyDeleteuntuk validasi HTML dan CSS3 akan saya bahas pada tutorial selanjutnya :-bd
Deletewah buat bahan membuat template blog neh :D
ReplyDeletecoba dlu kang :D
ReplyDeleteBoleh juga nih :bd
ReplyDeletemakasih sob, bagus nih :)
ReplyDeletethanks kerangkanya sob :bd
ReplyDeletemau ane bikin bikin
Mantab Nih :D Coba Pake Ya :D
ReplyDeletewah boleh juga nih gan :D
ReplyDeletekerangka yang sangat sempurna
ReplyDeleteizin ambil om
bagus nih
ReplyDeletecommentback nya ya :-bd : http://halimtc.blogspot.com/
ok gan
Deletenanti saya mluncur :-bd
I am test comment
DeleteWah,kayanya epic banget nih \o/ coba dulu ahh.. B)
ReplyDeleteSederhana tapi cepat gan!!
ReplyDeletekerangkannya mantap,pengen belajar buat template tapi ribet ( ane nggak suka hal yg ribe :v )
ReplyDeletepake template orang lain aja deh :D
Mantapp gan, langsung praktekk :D
ReplyDeleteMakasih udah dishare gan, ane belajar dulu
ReplyDeletewah, lumayan dapet post beginian, buat belajar lagi deh.
ReplyDeletesalam mas saya pendatang baru di Blogger.
hehe :)
wah boleh juga tuh kerangkanya, boleh ane edit lagi dan nerusin :D
ReplyDeletepgn bljr ane gan buat template sndri, trusin tutorial nya ya gan
ReplyDeleteSchema org memang penting untuk template :) biar seonya nambah :D
ReplyDeletemakasih yaa gan, ini sangat keren.
ReplyDeletemaaf baru bisa kembali tadi pagi internet saya sedang down
waahhh patut ane coba nih gan :D
ReplyDeleteBoleh Juga Nih Gan :D
ReplyDeleteBoleh nih kerangkanya untuk buat template blog baru :-bd
ReplyDeletekeren gan
ReplyDeleteMantap Bro :)
ReplyDeleteCocok nih buat yg lagi belajar bikin template, di jamin jadi bagus :D
ReplyDelete\o/ Coba Dulu Nih... :D :p Mau bikin Template Baru
ReplyDeleteoke, thanks gan atas tempenya...
ReplyDeleteagan nih sepertinya kuliah di web design :W
ReplyDeleteThank you bro !
ReplyDeletenah ini yang saya cari2 untuk belajar membuat template sendiri... makasih mas.... |o| kalo berkenan kunjingi blog saya yang berantakan http://antoncabon.blogspot.com
ReplyDeleteschema.org untuk bagian komentar juga mas :D
ReplyDeleteThanks infonya guys :)
ReplyDeletehttp://goo.gl/8yKBo1