10 Pondasi HTML Pada Hypothesis Blogger

Tanpa menambah ataupun merubah versi asli dari DIY Thesis Skin Promo, bahwa ada 10 pondasi HTML yang saya aplikasikan ke blogger. Berikut ini penjelasan sesuai gambar dan berdasarkan HTML dan CSS Layout original.

1. ID Header
Header kami bungkus bersama tag ID header/ Judul blog bersama class navigasi sehingga menjadi kesatuan heading. Apabila ingin mengeditnya, anda harus menentukan target di header atau di navigasi. 2. Class Navigation
Bersama dengan header navigasi berada di sebelah kanan header yang dibungkus dengan ID Header 3. ID Promo Bar
Memungkinkan kita untuk menambah widget seperti hotnews dan lain-lain. 4. Content Box
Induk dari content, headline container, post box, dan sidebar menjadi kesatuan layout. Ini berfungsi untuk layout responsive. 5. Content
Area pembungkus untuk area posting blog. Atau area artikel seperti judul isi artikel. Area ini membungkus headline, post box, dan sidebar. 6. Headline Container
Ciri khas Thesis template yaitu mengubah judul posting ke tag header. Maka dari itu template ini tidak luput dari metode ini. Silahkan lihat semua template thesis mengubah area posting ke dalam tag

atau H1 7. Post Box
8. Sidebar
9. Foot
10 Footer

Pada content box dan content mencakup sidebar, bisa juga disebut content box adalah outer-wrapper atau sejenisnya.

Jika dari area terluar kemudian lebih detail lagi ID dan Class akan seperti ini
Untuk lebih komplit tentang ID HTML Hypothesis Skin Template silahkan lihat di ID HTMLnya

[click to continue]

Social Media Meta Tag for Hypothesis Blogger Template

This is social meta tag update for hypothesis blogger template. If you dont using our template you can add this script if your twitter cards for blogspot not working.

Test in Twitter cards validator at : 05 July, 2015
Type Summary Cards with normal image

<meta content='summary' name='twitter:card'/>
<meta content='@ahmadmaryuki' name='twitter:site'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<b:else/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
</b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
<b:else/>
<meta expr:content='data:post.snippet' name='twitter:description'/>
</b:if>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' name='twitter:image:src'/>
<b:else/>
<meta content='https://googledrive.com/host/0B9TVRU0AhL0yfkkxcllpRnN1NFhIMmtHYXZxZjQ2azQ2NXB3cnhkWlhCUnl2M3NXMXBweUU/1435922914_vector_65_11.png' name='twitter:image:src'/>
</b:if>

Please following this alert coz very important!

This code should be add in <b:includable id='post' var='post'>
  <div class='post hentry'>
This code for XHTML 4.1 strict, for HTML5 will be error code on meta tag
This code if in hypothesis was included.

Before i publish this post about social media meta tag for blogger, i find a powerfull social media tag. I find on github by Milan Aryal 11 day ago. You can see it's original code on github here and see the result.

Test in Facebook Debuger at : (Under Test)
Type open graph protocol

[click to continue]