Cara membuat tab view slick pada blog

Cara membuat tab view slick pada  blog,
Pilih Rancangan > Edit Html > centang "Expand Widget Template"
Kemudian Letakkan kode berikut diatas kode ]]></b:skin>

#slick_area{background-color:#fff;padding:8px;margin:10px 0;line-height:18px}
#slick_area a{color:#000;text-decoration:none}
.slick_area a:hover{color:#fff}
ul.slick{margin:2px 5px 5px 5px;padding:0px}
ul.slick li{list-style:none;display:inline;background-color:transparent;padding:7px 18px;text-decoration:none;font-size:10px;text-color:#dedede;font-weight:bold;text-transform:uppercase;cursor:pointer;border:1px solid #585858}
ul.slick li:hover{border:1px dotted #f00}
ul.slick li.active{background-color:transparent;border:1px solid #585858;color:#dedede}
.content-slick{background-color:transparent;border:1px solid #585858;color:#dedede;min-height:0;padding:5px 5px 5px;text-align:left}
.content-slick ul{margin:10px;padding:0}
.content-slick ul li{list-style:none;border-bottom:0px solid #585858;padding:5px}
.content-slick ul li:last-child{border-bottom:none}
.content-slick ul li:hover,.content-slick ul li a:hover{display:block;background-color:transparent}
.content-slick ul li a{text-decoration:none;color:black;display:block}

Selanjutnya Letakkan kode berikut ini diatas kode </body>

<script type='text/javascript'>
$(document).ready(function(){
$(&#39;#tabdua, #tabtiga&#39;).hide();
$(&quot;ul.slick li&quot;).click(function () {
$(&quot;.active&quot;).removeClass(&quot;active&quot;);
$(this).addClass(&quot;active&quot;);
$(&quot;.content-slick&quot;).slideUp();
var content_show = $(this).attr(&quot;title&quot;);
$(&quot;#&quot;+content_show).slideDown();
});
});
</script>

Simpan Template.

Sekarang Saatnya Menambah Widget Tabview Jquery ini :
Dari Dashboard Pilih Rancangan , kemudian klik Tata Letak - Add Widget -pilih 'Html/Javascript' dan copy pastekan kode berikut :

<ul class="slick">
<li title="tabsatu" class="slick active">Tab Satu </li>
<li title="tabdua" class="slick active">Tab Dua </li>
<li title="tabtiga" class="slick">Tab Tiga </li>
</ul>
<div id="tabsatu" class="content-slick">
kode HTML/Javascript di Tab Satu
</div>
<div id="tabdua" class="content-slick">
 kode HTML/Javascript di Tab Dua
</div>
<div id="tabtiga" class="content-slick">
 kode HTML/Javascript  di Tab Tiga
</div>