Tampilkan postingan dengan label Koding. Tampilkan semua postingan
Tampilkan postingan dengan label Koding. Tampilkan semua postingan

Selasa, 27 Juni 2017

4 Model Threaded Comment Hack Berikut Tutorial

4 Model Threaded Comment Hack Berikut Tutorial

4 Model Threaded Comment Hack Berikut Tutorial. Sobat blogger, threaded comments hack atau komentar dengan style bertingkat memang sedang banyak di gunakan banyak blogger saat ini,termasuk saya juga menggunakannya,keuntungan dengan threaded comment hack,kotak komentar anda menjadi bisa lebih bergaya,keren dan elegant,termasuk penambahan atribut rel="nofollow yang sudah di pasang di threaded comments hack ini dan juga seo friendly.

Threaded comment hack juga menggunakan atribut open new tab atau bisa di sebut target_blank pada penggunaan user comment, target blank ini bertujuan ketika seorang user mengklik salah satu akun yang berkomentar akan membuka tab baru, dan tentu saja tidak harus meninggalkan blog anda meskipun mengklik salah satu akun google komentator.

Disini saya ingin berbagi tutorial 4 model threaded comment hack yang berbeda beda model dan yang sudah di share di blog ini, namun saya akan meringkasnya dalam satu artikel supaya mudah bagi anda menemukan tutorialnya.

Cara Membuat Threaded Comment Hack Blogger Style 1

Cara Membuat Threaded Comment Hack Blogger Style 1

Cara Membuat Threaded Comment Hack Blogger Style 2

Cara Membuat Threaded Comment Hack Blogger Style 2

Cara Membuat Threaded Comment Hack Blogger Style 3

Cara Membuat Threaded Comment Hack Blogger Style 3

Cara Membuat Threaded Comment Hack Blogger Style 4

Cara Membuat Threaded Comment Hack Blogger Style 4
Nah itulah sobat blogger , 4 macam atau 4 model threaded  comment hack berikut tutorialnya, semoga ada yang di sukai, untuk lebih dan kurangnya saya mohon maaf, salam sukses selalu.

Cara Membuat Navigasi Angka Halaman Blog 2017


Cara Membuat Navigasi Angka Halaman Blog. Sobat blogger, navigasi halaman blog adalah sebuah nomor urutan untuk halam blog,navigasi halamn blog ibarat sebuah buku yang terdapat banyak artikel dan dengan halamannya, maka jika sebuah blog atau website dengan banyak artikel tapi tidak mempunyai navigasi halaman, mungkin akan sangat susah untuk pengunjung menjelajahi artikel-artikel anda yang ada di blog dan terlihat aneh mungkin.
Cara Membuat Navigasi Halaman Blog
Navigasi halaman pada sebuah blog,menurut saya adalah hal yang wajib di terapkan pada sebuah blog, selain memudahkan pembaca halaman blog atau website anda,navigasi halaman dapat meningkatkan pageview dan dapat menurunkan tdingkat bounce rate sekalgus mempercantik tampilan pada sebuah blog.
maka sangat di sayangkan jika blog anda tidak mempunya navigasi halaman,maka jika pengunjung ingin melihat artikel yang lebih lama,akan susah untuk menemukannya

Maka dari itu bagi anda yang ingin menambahkan navigasi urutan halaman atau nomor urut angka halaman pada blog anda,silahkan ikuti tutorial yang saya berikan,caranyapun cukup sangat mudah untuk di terapkan saya ambil kode ini dari blog Maskolis.


Cara Membuat Navigasi Halaman Blog/ Urutan Angka Halaman Blog

  1. Buka akun blogger anda.
  2. Pilih menu template > Klik edit Html 
  3. Lalu silhkan anda letakan code di bawah ini tepat di atas kode ]]></b:skin> 
.showpageNum a {
color:#FFF;padding:4px  10px;
margin:0 2px;
text-decoration:none;
-webkit-border-radius:2px;-
moz-border-radius:2px;
background:#848484
}        
.showpageOf {
color:#222;
margin:0 6px 0 0
}        
.showpageNum a:hover {
background:#222;
color:#FFF
}        
.showpagePoint {
color:#FFF;
text-shadow:0 1px 2px #333;
padding:4px  10px;
margin:0 2px;
-webkit-border-radius:2px;
-moz-border-radius:2px;
background:#222;
text-decoration:none
}

5.  Selanjutnya letakan kode di bawah ini tepat di atas kode </body>  
<script  type='text/javascript'>      
var  home_page=&quot;/&quot;;      
var  urlactivepage=location.href;      
var  postperpage=10;      
var  numshowpage=7;      
var upPageWord  =&#39;&#9668;&#39;;      
var downPageWord  =&#39;&#9658;&#39;;      
</script>      
<script  src='http://miscah.googlecode.com/files/pagenav.js'  type='text/javascript'/>

Catatan :
var  postperpage=10; Adalah jumlah post yang di tampilkan pada halaman yang dibuka, silahkan sesuaikan menurut  posting anda.      
var  numshowpage=7;  Adalah jumlah tombol navigasi di halaman.

Jika sudah di sesuaikan lalu save template dan pastikan tombol navigasi halaman muncul di blog anda.
oke sobat,saya rasa cukup sekian tutorial cara membuat navigasi nomor halaman pada blog.
lebih dan kurangnya saya mohon maaf.

Cara Membuat Related Post di Bawah Postingan Blog 2017


Cara Membuat Related Post di Bawah Postingan Blog. Related Post atau artikel terkait ala Kang ismet ,memperlihatkan artikel yang terkait dengan kategori yang di eksporsur sesuai kategori yang di pilih, artikel terkait atau related post ini sangat efektif untuk meningkatkan traffic pengunjung blog anda, karena dengan related post, pengunjung akan di tawarkan artikel lainnya dengan kategori yang di pilih, related post ini juga sangat efektif untuk menurunkan tingkat bounce rate pada blog,

Seperti yang kita tahu bahwa google sangat menyukai blog yang tingkat bounce ratenya sangat rendah, related post ini juga sangat ringan untuk loading ,karena related post atau artikel terkait ini akan di buat tanpa tumbhnail atau gambar, nah bagi anda yang ingin menggunakan related post ini, silahkan ikuti tutorial saya di artikel ini.

Cara Membuat Related Post / Artikel Terkait
Sumber Gambar : Blog.kangismet.net

Gambar di atas adalah tampilan related post yang akan kita buat, cukup simple dan ringan untuk loading.
Sebelum anda melakukan tutorial ini, silahkan backup template anda untuk menjaga kesalahan erorr pada template.

Cara Membuat Related Post Di Bawah Posting Blog. 
1. Buka akun blogger anda.
2. Pilih menu template > klik edit Html.
3. Copy code di bawah ini dan letakan tepat di atas kode ]]></b:skin>

#related-post background:none;width:100%;margin-top:35px;margin-bottom:10px;padding:5px 0 10px 0px}
#related-post h4{font-size:150%;text-transform:uppercase;margin:0 0 15px;padding:0;font-weight:normal}
#related-post li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn35shmDK_wgp_t2HxYnBmZ9YNyGlGUsojdWFVymwwzXJXSGjBE2PjGXJB0xXLl7wJpXopKTsp5kQObjufw4a0thw5Ryt6-0-LHYv6KjmpJPQaoJCVOcLoYiAm5yfQMgteLDcThaLuQGtm/s1600/bullet.png) no-repeat 1px 5px;color:#2c3e50;text-indent:0;line-height:1.6em;margin:0;padding:0 0 3px 19px}
#related-post .widget{margin:0;padding:0}
#related-post ul{list-style:none;margin:0;padding:0}

4. Lalu copy code dibawah ini dan letakan tepat dibawah </article>

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Related Post Widget Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Related Post Widget Start -->
<div class='related-post' id='related-post'/>
<script type='text/javascript'>
var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
&quot;<data:label.name/>&quot;<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop></b:if>];
var relatedPostConfig = {
homePage: &quot;<data:blog.homepageUrl/>&quot;,
widgetTitle: &quot;&lt;h4&gt;Related Post&lt;/h4&gt;&quot;,
numPosts: 6,
titleLength: &quot;auto&quot;,
containerId: &quot;related-post&quot;,
newTabLink: false,
widgetStyle: 1,
callBack: function() {}
};
</script>
<!-- Related Post Widget End -->

</b:if>

</b:if>
</b:includable>

5. Save template.

Selesai, nah untuk melihat hasilnya, silahkan lihat di bawah posting blog anda, namun jika anda mengalami keluhan dalam tutorial ini, silahkan ajukan di kolom komentar, lebih dan kurangnya saya mohon maaf, semoga sukses selalu.

Cara Merubah Cursor Menjadi Animasi Lucu Unik Keren

Cara Merubah Cursor Menjadi Animasi Lucu Unik Keren, Sobat blogger, apa pernah anda mengunjungi sebuah blog, ketika kita ada di blog tersebut, cursor mouse kita berubah menjadi lucu dan unik keren, bahkan seperti cursor seorang peri cinta kaya di tv, wkwkwk, untuk cara mempercantik blog semua bisa di lakukan, termasuk mengubah atau membuat cursor menjadi lucu, unik dan keren, nah biasanya hal seperti ini memang punya kesan tersendirinya pada blog.
Apa sobat blogger juga ingin mengubah atau membuat cursor pada blog anda, sekarang saatnya saya akan membuat tutorial cara merubah cursor mouse menjadi keren lucu dan unik. yu jika anda sekarang ingin mengubah cursor tersebut menjadi keren lucu dan unik, ikuti tutorial yang saya berikan.

Mengubah Cursor Menjadi Animasi Lucu Unik Keren

Cara Mengubah Widget Cursor Menjadi Animasi Lucu Unik Keren Pada Blog

1. Pertama anda buka atau klik link ini http://www.cursors-4u.com/anime/
2. Pada halaman baru, pilih salah satu widget cursor anime yang anda suka atau pilih kategori lainnya dan klik pada icon tersebut.
Lihat contoh gambar di bawah :
Cara Mengubah Cursor Menjadi Animasi Lucu Unik Keren
3. Jika anda sudah memilih salah satu cursor, klik icon tersebut, maka akan muncul halaman baru.
4. Sekarang buka akun blogger anda, Pilih menu Tema / Template > klik edit HTML.

Cara Mengubah Cursor Menjadi Animasi Lucu Unik Keren di Blog

-Copy kode pertama dan letakan diatas kode </body>
-Copy kode kedua dan letakan diatas kode ]]></b:skin> atau </style> 
Cara Mengubah Cursor Menjadi Animasi Lucu Unik Keren di Blog
5. Jika sudah klik save template dan lihat hasilnya :)
Oke sobat blogger, saya rasa sudah cukup di tutorial "Cara Mengubah Cursor Menjadi Animasi Lucu Unik Keren di Blog" sukses selalu. :)

cara membuat widget social media sticky keren dan sudah valid HTML


Sobat blogger kali ini saya ingin berbagi sebuah tutorial tentang cara membuat widget social media sticky keren dan sudah valid HTML5 , jadi widget ini berisi social button yang di  terapkan sekaligus di satu kolom widget, untuk kegunaan widget ini sendiri, tentu saja untuk menambahkan followers kita dan untuk penampakannya silahkan lihat gambar di bawah ini.

Cara Membuat Widget Sticky Valid HTML5

Nah itu adalah contoh untuk gambarnya, kalo mau lebih jelas bisa lihat di sidebar blog saya, karena saya juga menggunakan widget ini dan jika anda juga tertarik untuk memasangnya silahkan ikuti tutorial yang saya berikan :

Cara Membuat Widget Social Sticky Valid HTML5.
1. Buka akun blogger anda
2. Pilih Menu Template > Klik Edit HTML.
3. Sekarang letakan kode di bawah ini tepat di atas kode </body>

 
<script type='text/javascript'>
//<![CDATA[
(function(){var fb1=document.createElement('script');fb1.type='text/javascript';fb1.async=true;fb1.src='http://connect.facebook.net/id_ID/all.js#xfbml=1','facebook-jssdk';var fb2=document.getElementsByTagName('script')[0];fb2.parentNode.insertBefore(fb1,fb2)})();(function(){var tw1=document.createElement('script');tw1.type='text/javascript';tw1.async=true;tw1.src='http://platform.twitter.com/widgets.js';var tw2=document.getElementsByTagName('script')[0];tw2.parentNode.insertBefore(tw1,tw2)})();(function(){var gp1=document.createElement('script');gp1.type='text/javascript';gp1.async=true;gp1.src='https://apis.google.com/js/plusone.js';var gp2=document.getElementsByTagName('script')[0];gp2.parentNode.insertBefore(gp1,gp2)})();
$(document).ready(function(){
$("#on-top").sticky({topSpacing:0});
});
</script>
<script src='https://googledrive.com/host/0B0Dd8XYrtgdDQS03RzFLSmx6RVE/sticky.js' type='text/javascript'>
//]]>
</script>

4. Klik Save template anda.
5. Sekarang Pilih Menu Tata Letak > Add Gadget > HTML/Javascript dan paste kode di bawah ini di kolom.

<div id="on-top"><div style="background:#3498db;font-weight:bold;font-size:150%;text-align:center;padding:10px 0;"><a href="http://www.blogger.com/follow-blog.g?blogID=ID-BLOGGER" target="_blank" title="Follow this blog"><span style="color:#fff">Join</span> <span style="color:#000">Now</span></a></div><div style='background:#fff;margin:0;border:1px solid #ccc;border-bottom:none;border-top:none'><div style='background:#fff;margin:0;'><div class="fb-like-box" data-href="https://www.facebook.com/ID-FACEBOOK" data-colorscheme="light" data-show-faces="false" data-header="true" data-stream="false" data-show-border="false"></div></div><div style="background:#fff; border-top:1px solid #ccc;margin:0; padding:5px 0 5px 40px"><a href="https://twitter.com/ID-TWITTER" class="twitter-follow-button" data-show-count="true" data-show-screen-name='false' data-lang="id">Ikuti @NAMATWITTER</a><div class="g-plusone" data-size="medium" data-count="true" data-width="100" data-href="http://www.madamvia.web.id/"></div></div></div><div class="g-person" data-href="//plus.google.com/ID-GOOGLE+" data-layout="landscape" data-rel="author"></div></div>
Silahkan anda ubah yang saya tandai biru sesuai ID anda dan klik save template.

Selesai, nah itulah tutorial cara membuat widget  button social di sidebar blog anda, oke sobat, atas rasa syukur yang sedalam-dalamnya kepada Allah SWT,mari kita ucapkan Alhamdulillah dan semoga di malem tahun baru ini tahun 2015 dan untuk kedepannya, semoga kita menjadi manusia sebaik-baiknya manusia, yang pasti semoga kita menjadi lebih baik dari tahun sebelumnya, lebih sukses, paling utamanya semakin taat kepada sang khaliq.. selamat malam..

Cara Membuat Iklan Parallax di Posting Blog 2017

Cara Membuat Iklan Parallax di Posting Blog. Apa sih iklan parallax scrolling itu sobat, parallax ini mungkin bisa dikatakan sebuah desain atau efek pada obyek diam saat discroll, setau saya sih begitu, karena memang perkembangan dari design web terus hadir dan semakin menarik untuk diikuti. Para developer pun juga sudah mulai menyesuaikan diri dengan perkembangan tersebut, ya seperti contoh salah satunya dengan teknik iklan parallax ini.

Jelas hal ini untuk mengundang perhatian pembaca pada tampilan iklan tersebut, seperti contoh gambar di atas ini, dan untuk memanjakan mata pembaca dengan membuat tampilan iklan tersebut menjadi parallax, karena kita akan melihat secara keseluruhan gambar tersebut dengan cara menscrolling bagian body web, kurang lebihnya seperti itu penjelasan tentang iklan parallax tersebut, tutorial cara membuat iklan parallax ini saya ambil kodenya dari mas Adhy kompiajaib, sebelumnya terimakasih banyak mas adhi.

Maka untuk update terbaru pun saya tidak mau ketinggalan, dan sekarang jika sobat berminat untuk membuat iklan parallax tersebut diblog sobat, silahkan ikuti tutorialnya.. 

Cara Membuat Iklan Parallax di Blog

1. Buka akun blogger Anda
2. Pilih menu template >> klik edit HTML
3. Sekarang letakan kode dibawah ini tepat diatas kode </head>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/
.paralax_div {
  position: relative;
  overflow: visible;
  width: 300px;
  height: 250px;
  margin-right: 20px;
  display: inline-block;
  float: left;
  z-index: 9999;
}
.paralax_div > div {
  overflow: hidden;
  width: 100%;
  height: 100%;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  clip: rect(auto auto auto auto);
}
.paralax_div > div > div {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  margin: 0 auto;
  -moz-transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
.paralax_div > div > div > div {
  width: 100%;
  height: 100vh;
  position: absolute;
  left: 50%;
  top: 0;
  border: none;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background: #ddd;
}
.paralax_div > div > div > div > * {
  margin: 0;
  margin-top: 0;
}
.paralax_div > div > div > div > a {
  width: 100%;
  height: 100vh;
}
.paralax_div img,.paralax_div iframe,.paralax_div ins {
  height: 600px;
  width: 300px;
}
.clear {
  clear: both;
  display: block
}
@media screen and (max-width:640px) {
  .paralax_div {
    width: 100%;
    height: 250px;
    margin: 0 auto;
    float: none;
  }
  .paralax_div > div > div > div {
    left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .paralax_div > div > div {
    width: 100%;
    left:0;
    text-align: center;
  }
  .paralax_div img {
    margin: 0 auto;
    width:auto;
    max-width:100%;
    height:auto;
  }
}
@media screen and (max-width:320px) {
  .paralax_div iframe,.parallax_banner ins {
    margin: 0 auto;
    width:100%;
    height:600px;
  }
}
/*]]>*/
</style>
</b:if>
Selanjutnya sobat cari kode seperti ini <div class='post-body entry-content' 
Jika sudah ketemu, lalu letakan kode dibawah ini tepat diatas kode tadi.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="paralax_div">
  <div>
    <div>
      <div>
        <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGCc_AL1H023kEG_O1tPthyphenhyphenzv80Z1PVLkr-G1RE579NkXKaym-fcjRGZQDcO3JLZUBnCZe_3ccQRhbnwxWsHvvSqCSQGCRfNIQYZoL5vQApoHtvxMJp6MfCBryD12TWKFpPkyeYBoRsqaq/s300/18835763_10208567628658748_4561466345738187918_n.jpg" alt="banner" width="300" height="600" />
      </div>
    </div>
  </div>
<span class="clear"/>
</div>
</b:if>
Silahkan ganti kode gambar atau banner yang saya tandai warna biru dengan gambar atau banner iklan blog sobat atau bisa juga diganti  dengan kode iklan adsense sobat, nah cara membuat iklan parallax tersebut ternyata memang sangat mudah sobat. hehe..

Cara Membuat Template Blog Valid HTML 5

Membuat Template Blog Valid HTML5. Dengan mengikuti tren evolusi HTML ke dalam spesifikasi HTML5, saya juga tidak ingin ketinggalan tentang desain blog berbasis html5, maka saatnya sekarang  anda juga perlu perubahan pada template anda dan mengadopsi HTML5 tag markup semantik ke dalam desain website atau blog anda. , W3C telah melakukan penyampaian tentang pengembangan web untuk html5, browser dan algoritma spider, sekarang saya akan memberi panduan sederhana dalam rangka pengembang web yang dapat anda mulai dengan menggunakan beberapa elemen HTML5 dan CSS3. untuk menyingkat waktu dan tidak mau berbicara panjang lebar tentang HTML5. Mari sekarang kita lakukan perubahan untuk mengadopsi html5 pada template anda.

Cara Membuat Template Blog Valid HTML5

Sekarang silahkan backup template anda sebelum melakukan tutorial ini,untuk jaga-jaga bila terjadi kesalahan erorr dan bisa di kembalikan ke template semula.

Cara Membuat Template Blog Valid HTML5

Langkah 1.  Silahkan anda cari kode seperti dibawah ini.  (Kode bisa di lihat di paling atas )

 <?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 b:version='2' class='v2' expr:dir='data:blog.languageDirection' 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'>
<head>

Kalo sudah ketemu, silahkan anda ganti semua kode tersebut dengan kode di bawah ini.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>

Langkah 2. Ganti kode </html> menjadi </HTML> ( Kode bisa di lihat di paling bawah )
Langkah 3. Sekarang anda cari kode seperti di bawah.

 <b:include data='blog' name='all-head-content'/>

Kalo sudah ketemu ganti kode tersebut dengan kode di bawah.

<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='blogger' name='generator'/>
<link expr:href='data:blog.homepageUrl + &quot;favicon.ico&quot;' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' 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 == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:else/>
<meta expr:content='data:blog.pageName + &quot; - &quot; + data:blog.title' name='description'/>
</b:if>
</b:if>

Langkah 4. Sekarang anda cari kode <b:skin><![CDATA[ dan ganti kode tersebut dengan kode di bawah ini.

<link href='//www.blogger.com/static/v1/widgets/3950009988-widget_css_bundle.css' rel='stylesheet' type='text/css'/>
&lt;style type=&quot;text/css&quot;&gt; &lt;!-- /*<b:skin><![CDATA[*/]]
<style>

Langkah 5. Sekarang anda cari dan hapus semua kode seperti di bawah.

<b:include name='quickedit'/>

Langkah 6. Hapus lagi kode seperti di bawah.

<a expr:name='data:post.id'/>

Langkah 7. Hapus lagi Kode seperti di bawah.

<b:include data='post' name='postQuickEdit'/> 

Langkah 8. Hapus kode seperti di bawah ini, kalo tidak ada silahkan lewati saja.

<div class='post-share-buttons goog-inline-block'>...sampai...</div>

Langkah 9. Ganti semua kode & menjadi &amp;

Langkah 10. selanjutnya hapus semua kode seperti di bawah ini satu persatu.

- allowtransparency='true'
- frameborder='0'
- src=''
- scrolling='no'
- width='100%'
- style='display: none'
Klik save template dan selesai. meski sebenarnya ini tidak 100% full valid Html 5, namun dengan tutorial ini, maka anda dapat mengurangi erorr di W3C Html. Kurang dan lebih nya saya mohon maaf dan semoga bermanfaat.