Cara membuat sitemap otomatis untuk blog

Sitemap adalah salah satu bagian penting dari sebuah website atau blog.
Dengan sitemap, pengunjung akan mudah menjelajahi dan menemukan isi yang bermanfaat dan dibutuhkan.

Secara default, blog blogspot (blogger.com)bisa menggunakan rss feed-nya sebagai sitemap (peta situs), akan tetapi akan lebih baik lagi bila anda sebagai blogger juga menyediakan Sitemap html + javascript yang lebih mudah dan enak dibaca pengunjung.

Manfaat lain dari Sitemap adalah juga akan mempermudah bots search engine menjelajahi dan mengindex isi website/blog untuk dipublikasikan pada penggunanya.

Berikut ini adalah contoh sitemap :

• Html/javascript sitemap : http://azrut91.blogspot.com/p/site-map.html
• Xml sitemap : http://your-blogger.blogspt.com/atom.xml?redirect=false&max-results=500
• Rss feed as sitemap : http://your-blogger.blogspot.com/feeds/posts/default?published&max-results=500

Berikut ini adalah cara membuat sitemap html/javascript yg update otomatis (contoh)
(cara mengubah rss feed menjadi Javascript)

1. Kunjungi situs www.feed2js.org
2. Build 
3. Masukkan alamat rss feed blog anda ( contoh : http://www.your-blog.com/feeds/posts/default?published&max-results=100 ) + angka 100 jangan dirubah
4. Generate javascript
5. Copy lalu paste kode javascript kedalam post baru, beri judul post dg "sitemap" atau "peta situs
6. Publish, selesai

 Kelebihan sitemap javascript
- Mudah membuatnya
- Update otomatis setiap ada post artikel baru

 Kekurangan sitemap javascript
- Tidak seo friendly
- tidak terbaca oleh bots search engine
- tidak bisa digunakan untuk sitemap di website webmaster search engine
- penyedia jasa feed2js hanya bisa menampilkan maximal 100 link

Cara membuat sitemap HTML utk blogger
Bila anda ingin membuat Sitemap (peta situs) yang lebih seo friendly, anda bisa membuatnya dengan cara yang setengah otomatis.
Caranya :
1. kunjungi http://www.xml-sitemaps.com/
2. Masukkan alamat situs/blog anda
3. Start
4. Tunggu hingga selesai
5. Simpan hasilnya

Keterangan :
- Hasil pembuatan sitemap yang akan anda peroleh ada 3 jenis,
1. Sitemap dengan format xml (sitemap.xml)
2. Sitemap dengan  format xml.gz
3. Sitemap dengan format html

Bila anda memiliki situs yang di hosting sendiri, anda bisa menyimpan dan menggunakan semua jenis sitemap di atas sebagai peta situs weblog anda, 
tapi bila anda blogger blogspot, anda hanya perlu menyimpan file "sitemap.html" saja untuk dijadikan peta situs html.

Cara memasukkan sitemap.html ke dalam postingan blog
1. Klik kanan file sitemap.html yang telah anda simpan
2. Pilih "open with" atau buka dengan aplikasi wordpad editor (notepad juga boleh)
3. Copy isi file "sitemap.html" mulai dari "setelah tag body  hingga sebelum tag /body"
4. Paste ke dalam postingan sitemap (bisa anda letakkan di bawah sitemap javascript di atas)

Kelebihan Sitemap Html dibandingkan Javascript (di atas)
- Mudah membuatnya
- Lebih seo friendly (mudah dibaca dan dijelajahi bots search engine)
- Enak dibaca

Kekurangan Sitemap Html dibandingkan Javascript (di atas) 
- Tidak bisa update secara otomatis

Cara membuat postingan menjadi 10 top search google hanya 1 jam

Hai teman-teman pembahasan kali ini mengenai Cara membuat postingan menjadi 10 top search google hanya 1 jam, sebenarnya saya bingaung mau kasih judul apa tapi memang aslinya bukan 1 jam tapi 15 menit postingan kita yang baru kita buat menjadi nomor 1 di pencarian search google
, hanya waktu 15 menit saja bisa menjadi nomor satu itupun bukan sembarang judul pesaingnya juga banyak dengan jumlah data yang ada 650.000 kalian bisa menjadi nomor satu cuma dengan hanya 15 menit saja.

Okey sobat perhatikan gambar di bawah ini:

Sobat sudah lihat kan artikel saya yang berjudul Kumpulan blog dofollow update Oktober 2011
pringkat nomor satu di pencarina google cuma hanya 1 jam padahal pesaingnya pun sobat lihat sendiri gambar pertaman 634.000 nah judul blog ku ini juga saya yakin menjadi nomor 1 di search google dengan jangka waktu 15 menit saja coba kalau tidak percaya klik di google judul postingan ini ketik saja Cara membuat postingan menjadi 10 top search google, Okey sobat pengen tahu kan rumusnya apa. Okey saya akan memberikan 4 kata kunci ini dari pengalaman pribadi saya ikuti langkah-langkah yang akan saya berikan:

Pertama sobat buat sebuah postingan yang menurut sobat itu sangat di cari orang dan jangan asal kopy-paste kalau mengkopy sobat tulis sumbernya tidak rugi kok supaya kekuatan trafik sobat akan bertambah dan postingan yang sobat buat walaupun  tidak mempunyai PR atau pagerank tapi sobat bisa ngalahin blog yang berpagerank apalagi yang berpagerank tinggi misalnya 3 atau 4  duh mungkin baru buat 1 menit langsung muncul hehehehe maaf yah sobat yang pageranknya tinggi mohon dukungannya juga hehehe, nah kita kembali lagi ke pembahasan kita, untuk satu postingan yang sobat buat akan memperkuat traffik blog yang 0 pagerank untuk sebuah jaminana bahkan akan terus muncul untuk membantu postingan lain jika ada tekanan postingan yang bagus dari blog sobat.

Yang ke 2 setelah postingan jadi langsung kopi link ke blog-blog jejaring sosial seperti facebook dan lain-lain.
Yang ke 3 masukan link postingan tersebut di tool instan google tidak usah saya jelaskan sobat semua pasti ngerti.
Yang ke 4 setelah di instankan dan semua beres lakukanlah ping agar blog sobat langsung di kunjungi mesin-mesin pencari dengan begitu postingan sobat langsung terindex. Klik di sini Cara ampuh menggunakan Ping Blog di google search engine bagi yang belum mengerti bagi yang sudah yah alhamdulillah sukses slalu kawan hehehe.

Nah ini yang terpenting dan saya minta maaf, saya sendiri belum mampu melakukanya karnaa faktor biaya saya ngeblog ini saja pakai gratisan kawan jadi belum begitu mampu untuk melakukan yang ini. Bagi sobat yang mampu silahkan lakukanlah karna ini yang terpenting buat postingan rutin karna paling cepat terindex dan google bisa akui blog kita adalah blog terbaik, sobat pasti mengerti buat postingan yang baik itu 1 hari 1 postingan tapi rutin, paling banyak 2, jangan lebih karna sia-sia rugi kalau banyak-banyak karna google hanya mengindex 2 postingan 1 hari di setiap blog selanjutnya sebagai pengikut seperti postingan saya ini dengan judul Cara Mengambil Gambar Dari Layar Komputer jadi terindex tapi urutannya di bawah tapi tetap masuk 10 top karna saya pakai 2 postingan walaupun tidak di pringkat pertama, Nah Google hanya bisa mengindex 26 postingaan untuk  pagerank 0 untuk selurunh postingan kalau yang berpegerank tentu lebih besar. aduh saya tidak bisa jelaskan banyak karna terlalu panjang sobat-sobat sendirilah yang bisa menilainya saya hanya bisa memberi sedikit pengetahuan saya jadi kalau ada kata-kata saya yang salah mohon di maafkan.

Okey deh sekian dulu pembahasan saya mengenai Cara membuat postingan menjadi 10 top search google hanya 1 jam, Semoga Bermanfaat. Amin

Cara Membuat Tombol Show Hide Komentar

Cara Membuat Tombol Show Hide Komentar | Selamat pagi ,,.!! sambil nunggu sahur ada baiknya saya buat posting untuk sobat blogger, kali ini postingan tentang Cara Membuat Tombol Show Hide Komentar , saya menerapkan tombol show hide ini pada blog saya beberapa jam yang lalu ,, intinya selain buat mempercantik blog, tombol show hide ini juga berfungsi untuk memperingkas jumlah atau komentar yang ada di blog ini. biar kagak ribet dikit ..!

Baiklah langsung saja anda perhatikan langkahnya di bawah ini .!

1. Login Blogger
2. Pilih Tabs "Rancangan" -> Klik "Edit HTML" -> Cek "Expand Widget Template"
3. Carikan kode ]]></b:skin> dan letakkan kode di bawah ini tepat di atas kode ]]></b:skin>

#comments {
display : none;
}
.stylewadah {background: #none;
padding: 5px;
}

#comments {
display : none;
}
.stylewadah {background: #none;
padding: 5px;
}
a.tombol-komentar{background:   url(http://i1187.photobucket.com/albums/z389/RICKY_ALDIYANSYAH/plus.gif) 85% 55% no-repeat;display:block;padding:15px 40px 15px 15px;border:1px solid #000000}
a.tombol-komentar:hover{background: url(http://i1187.photobucket.com/albums/z389/RICKY_ALDIYANSYAH/plus.gif) 85% 55% no-repeat;display:block;padding:15px 40px 15px 15px;border:1px solid #000000;}
a.active.tombol-komentar{background: url(http://i1187.photobucket.com/albums/z389/RICKY_ALDIYANSYAH/minus.gif) 85% 55% no-repeat;border:1px solid #000000}

4. Lalu carilah kode </head> dan letakkan kode di bawah ini tepat di atas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
    $(&quot;.tombol-komentar&quot;).click(function(){
        $(&quot;#comments&quot;).slideToggle(&quot;slow&quot;);
        $(this).toggleClass(&quot;active&quot;);
        return false;
    });
});
</script>

5. Setelah itu Carilah kode <b:includable id='comments' var='post'>selengkapnya di bawah ini

</b:includable>
<b:includable id='comments' var='post'>

6. Terakhir, Letakkan kode dibawah ini, tepat di bawah kode <b:includable id='comments' var='post'>

<center>
<div class='stylewadah'>
<a class='tombol-komentar' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 0'>Silahkan Berkomentar Disini<b:else/><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></b:if>
</a>
</div>
</center>

7. Setelah itu klik "Simpan Template"

Nah untuk hasilnya anda bisa buka salah satu postingan anda. baik yang udah ada komentarnya atau yang belom ada komentarnya ..!!
cukup sekian dari saya semoga artikel yang ilmunya sedikit copas ini ( wkwkwk ) saya harap bisa bermanfaat bagi anda semua ..!!

Download Green Hacker Portal Template

DEMO   |  DOWNLOAD
DEMO 2

                                                             Password file:  shift-7

Sedikit Tutorial...

•   EFek Shadow Pada Border
  
  Jika ingin menambah efek bayangan seperti pada view kedua diatas, maka cari dulu kode dibawah ini pada edit html, biar lebih mudah klik Ctrl+F. (disini saya pakai border paling luar)

#footer {

width:550px;

clear:both;

margin:0 auto;

padding-top:15px;

line-height: 1.6em;

text-transform:lowercase;

letter-spacing:.1em;

text-align: center;

padding: 5px;

background-color:#000000;

border:1px double #0000FF;

-moz-border-radius:10px;

-webkit-border-radius:10px;

Lalu tambahkan kode berikut tepat dibawahnya::

box-shadow: 0 0 40px 4px #A03FFA;

-moz-box-shadow: 0 0 40px 4px #A03FFA;

-webkit-box-shadow: 0 0 40px 4px #A03FFA

border-radius:3px;

-moz-border-radius:3px;

NB: - Anda dapat menambahkan efek shadow pada border yang lainnya tinggal muter otak dikitlah.  - kode warna html yang berwarna merah diatas dapat anda ganti sendiri dengan kode warna yang lain. (Kalau kode diatas saya gunakan warna ungu). Jika ingin tahu kode warna yang lain anda dapat klik disini.

• Mengganti Lagu/Music

Cukup cari kode ini :
<object data="http://divine-music.info/musicfiles/01 Moves Like Jagger (feat. Christin.swf"
lalu ganti tulisan yang berwarna merah diatas dengan URL lagu pilihanmu, perlu diingat lagu yang dipilih biar lebih minimalis pilih ekstensi .swf... Anda bisa cari di search google, indowebster, devine-music, 4shared, dan  lain sebagainya.

Mungkin itu saja, yang lain saya rasa sudah bisa sendiri.. Cukup sekian tentang Shift-7 portal template (Platform Blogger). Semoga dapat bermanfaat, apabila ada pertanyaan, silahkan tinggalkan komentar dibawah. 

Membuat Tab View Widget Kategori Mantab Banget

Kali ini saya akan membuat satu lagi tutorial mengenai salah satu fitur yang ada pada template Johny Sompret Banget, yaitu membuat tab view widget per kategori. Sebelumnya saya juga pernah membahas cara membuat simple tabber pada sidebar. Ya rencananya saya nanti akan membuat semua tutorial tentang berbagai fitur yang ada pada template-template buatan saya. Tidak ada yang mesti dirahasiakan, semua fitur akan saya jelaskan satu persatu cara pembuatannya, sehingga ke depannya diharapkan Anda mampu membuat template sendiri, syukur bisa dibagikan kepada teman-teman blogger yang lain atau minimal dipakai sendiri. Dan siapa tahu setelah itu ada yang mau menjadi partner saya dalam membuat template blogger atau paling tidak membuat sebuah tutorial baru untuk bisa dibagikan kepada pengguna blogger, karena selama ini saya bekerja sendirian, bikin tutorial sendiri, bikin template juga sendiri, jadi kalau ada yang mau bantu, silahkan saya sangat berterima kasih sekali.

Kembali ke tutorial tab view widget per kategori, widget ini menampilkan 4 post dengan thumbnail dalam tiap satu label atau kategori, untuk lebih jelasnya silahkan lihat gambar di bawah, dan klik demo biar lebih jelas.

DEMO

Langsung saja pada cara membuatnya :

1. Pertama Anda meesti login ke blogger dengan akun Anda
2. Kedua pilih blog yang ingin anda tambahkan slider ini.
3. Setelah itu masuk ke template >> Edit HTML, kemudian centang expand widget templates
4. Untuk berjaga-jaga jika terjadi kesalahan dalam pengeditan nantinya, sebaiknya backup dulu template anda.
5. Setelah semua langkah diatas anda lakukan, letakkan kode berikut ini diatas kode ]]></b:skin> :
   
   #tabber-wrapper{width:640px;float:left;word-wrap:break-word;overflow:hidden}
   ul.tab-view{float:left;list-style:none;height:32px;border-bottom:1px solid #aaa;border-left:1px solid #aaa;width:638px;margin:0;padding:0}
   ul.tab-view li{float:left;height:31px;line-height:31px;border:1px solid #aaa;border-left:none;overflow:hidden;position:relative;background:#eee;margin:0 0 -1px;padding:0}
   ul.tab-view li a{text-decoration:none;color:#26231c;display:block;border:1px solid #eee;outline:none;font-weight:700;padding:0 15px}
   html ul.tab-view li.active,html ul.tab-view li.active a,html ul.tab-view li.active a:hover{background:#eee;color:#026ab5;border-bottom:1px solid #eee}
   .tab-wrapper{border:1px solid #aaa;border-top:none;overflow:hidden;clear:both;float:left;width:638px;background:#eee;margin-bottom:15px}
   .tabber{padding:10px 0}
   .tabber .column{float:left;display:inline;width:146px;margin:0 0 0 11px}
   .tabber h2{font:bold 12px Arial;line-height:15px;margin:7px 0 5px}
   .tabber h2 a{color:#222}
   .tabber h2 a:hover{color:#026ab5}
   Karena pada blog demo yang saya gunakan lebar main-wrapper (kolom postingan) adalah 640px maka untuk membungkus tab view widget lebarnya harus sama, yaitu 640px. Anda bisa sesuaikan dengan lebar main-wrapper pada template yang Anda gunakan.
   Dan untuk tab viewnya sendiri lebarnya harus dikurangi 2px (1px kanan dan kiri), karena tab ini dibungkus dengan border setebal 1px, sehingga lebarnya menjadi 638px. Lebar tiap satu post disini 146px, jika pada template yang Anda gunakan lebar main-wrapper lebih kecil, maka lebar untuk satu post ini pun juga harus diperkecil sehingga jarak antara bagian sisi kanan dan kiri sama.
6. Langkah selanjutnya masih pada posisi Edit HTML, masukkan kode berikut ini diatas kode </head> :
   
   <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
   <script src='https://masolis-javascript.googlecode.com/svn/trunk/tabview.js' type='text/javascript'/>
   <script type='text/javascript'>
   //<![CDATA[
   imgr=new Array();imgr[0]="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgexgkVJpDJilzuMqKXjCpinaTrDoPMduIXV9F1UDFr0cqhR6xJM6jQ72d-TE77_6JNrt5nr9t9sVUY7n-80GBfftMh_L04s0U_UZNiPzCvVE53seyKxRLINgDw2NVMuU2EsP5peoPw-F8/s1600/no+image.jpg";showRandomImg=true;aBold=true;summaryPost=80;numposts=4;Title1="Norah Jones";Title2="Diana Krall";Title3="Sting";Title4="Basia";Title5="Sade";Title6="Jamie Cullum";function removeHtmlTag(strx,chop){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}s=s.join("");s=s.substring(0,chop-1);return s}function showrecentposts(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))img[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;var trtd='<div class="column"><a href="'+posturl+'"><img width="146" height="95" src="'+img[i]+'"/></a><h2><a href="'+posturl+'">'+posttitle+'</a></h2><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p></div>';document.write(trtd);j++}}
   //]]>
   </script>

   Keterangan :
   

   Perhatikan URL script warna biru diatas, itu adalah kode script jQuery.min.js seri terbaru yang saya gunakan untuk membuat tab view widget. Jika pada template Anda sudah terdapat jQuery.min.js walaupun serinya berbeda, kode warna biru diatas tidak perlu lagi Anda masukkan. Cukup satu jQuery.min.js yang ada di template, terserah mau seri berapa, kalau bisa versi yang terbaru.

   Tulisan warna merah : Norah Jones, Diana Krall dan seterusnya adalah judul untuk tab view widget, anda bisa ganti sesuai katehori yang ingin ditampilkan pada widget tersebut. Warna biru (146 dan 95) diatas adalah ukuran lebar dan tinggi thumbnail pada satu post kategori, silahkan ukurannya disesuaikan.
7. Kemudian masukkan kode berikut sebelum kode </body> :
   
   <script type='text/javascript'>
    //<![CDATA[
   jQuery(document).ready(function(){$(".tabber").hide();$("ul.tab-view li:first").addClass("active").show();$(".tabber:first").show();$("ul.tab-view li").click(function(){$("ul.tab-view li").removeClass("active");$(this).addClass("active");$(".tabber").hide();var activeTab=$(this).find("a").attr("href");$(activeTab).fadeIn();return false})});
    //]]>
   </script>
8. Langkah selanjutnya adalah bagaimana cara menempatkan tab view widget tersebut pada blog kita. Jika Anda ingin meletakkan pada bagian atas sebelum post seperti pada demo, cari kode <div id='main-wrapper'>, kemudian letakkan kode berikut ini dibawahnya :
   <div id='tabber-wrapper'>
   <ul class='tab-view'>
   <li><a href='#tab1'><script>document.write(Title1);</script></a></li>
   <li><a href='#tab2'><script>document.write(Title2);</script></a></li>
   <li><a href='#tab3'><script>document.write(Title3);</script></a></li>
   <li><a href='#tab4'><script>document.write(Title4);</script></a></li>
   <li><a href='#tab5'><script>document.write(Title5);</script></a></li>
   <li><a href='#tab6'><script>document.write(Title6);</script></a></li>
   </ul><div class='clear'/>
   <div class='tab-wrapper'>
   <div class='tabber' id='tab1'>
   <script>
   document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/Norah Jones Lyrics?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
   </script></div>
   <div class='tabber' id='tab2'>
   <script>
   document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/Diana Krall?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
   </script></div>
   <div class='tabber' id='tab3'>
   <script>
   document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/Sting?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
   </script></div>
   <div class='tabber' id='tab4'>
   <script>
   document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/Basia?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
   </script></div>
   <div class='tabber' id='tab5'>
   <script>
   document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/Sade Lyrics?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
   </script></div>
   <div class='tabber' id='tab6'>
   <script>
   document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/Jamie Cullum Lyrics?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
   </script></div>
   <div class='clear'/>
   </div></div>
   Tulisan warna merah pada kode diatas adalah label atau kategori yang saya tampilkan pada tab view widget, silahkan ganti dengan label Anda sendiri dan sesuaikan dengan judul tab view pada langkah nomer 6 diatas. Dan jika Anda ingin menampilkan widget ini di bawah postingan, letakkan kode tersebut diatas kode berikut ini (jika tidak ada cari yang mirip) :
   

   <!-- spacer for skins that want sidebar and main to be the same height-->
   <div class='clear'>&#160;</div>
   
   </div> <!-- end content-wrapper -->

9. Terakhir, save templates dan lihat hasilnya. 

Nah itu tadi tutorial membuat tab view widget yang banyak ditanyakan oleh teman-teman blogger pada artikel sebelumnya. Silahkan dicoba, jika masih ada yang kurang jelas silahkan tinggalkan pesan di kotak komentar. Selamat mencoba dan semoga bermanfaat.