Jika Anda ingin menyimpan semua javascript yang ada pada template ini silahkan klik link download di bawah ini :
Template ini bertipe magazine, banyak sekali fitur yang saya pasang pada
template ini. Tidak terlalu susah untuk memasangnya, apalagi jika Anda
sudah tebiasa dengan template buatan saya akan sangat mudah untuk
memahaminya. Untuk lebih memudahkan dalam pemasangan widget pada
template ini perhatikan screenshot layout di bawah ini :
Saya sengaja menggunakan layout Old Blogger Interface untuk
memudahkan semua tampilan, soalnya kalau layout blogger baru ada fitur
scroll-nya jadi tidak bisa sampai ke bawah. Berikut ini cara pemasangan
fitur-fitur yang ada pada template ini :
- Slider
Slider pada template ini bekerja otomatis menampilkan postingan terbaru, Cara memasangnya, perhatikan kolom pada layout diatas yang sudah saya beri tulisan slider. Setelah itu masukkan kode berikut ini ke dalamnya :<div id='featuredContent'>
<div id='slideshow'>
<div id='slideshowThumbs'>
<ul><script>
document.write(" <script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script> </ul>
</div>
<div class='post' id='slideshowContent'>
<script>
document.write(" <script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script></div>
</div>
<script type='text/javascript'>
$(function() {
$("#slideshowThumbs ul").tabs("#slideshowContent > div", {
effect: 'fade',
fadeOutSpeed: 1000,
rotate: true
}).slideshow({
clickable: true,
autoplay: true,
interval: 3000
});
});
</script>
<div class='clear'>
</div>
</div> - Tab View Widget per Label
Perhatikan gambar diatas, untuk merubah judul tab (diary, jazz dan sebagainya) cari kode berikut ini di Edit HTML :Title1="DIARY";Title2="JAZZ";Title3="HEALTH";Title4="SPORT";Title5="COMEDY"
Setelah ketemu ganti tulisan berwarna biru diatas dengan judul yang ingin Anda tampilkan pada tab view widget kategori.
Sedangkan untuk mengisi widget tersebut dengan label, masih pada Edit HTML cari kode berikut ini (jangan lupa untuk mencentang expand widget template) :<div class='tabber' id='tab1'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/sport?max-results="+numposts9+"&orderby=published&alt=json-in-script&callback=showrecentposts9\"><\/script>");
</script></div>
<div class='tabber' id='tab2'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/lifestyle?max-results="+numposts9+"&orderby=published&alt=json-in-script&callback=showrecentposts9\"><\/script>");
</script></div>
<div class='tabber' id='tab3'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/economics?max-results="+numposts9+"&orderby=published&alt=json-in-script&callback=showrecentposts9\"><\/script>");
</script></div>
<div class='tabber' id='tab4'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/diary?max-results="+numposts9+"&orderby=published&alt=json-in-script&callback=showrecentposts9\"><\/script>");
</script></div>
<div class='tabber' id='tab5'>
<script>
document.write(" <script src=\"/feeds/posts/default/-/health?max-results="+numposts9+"&orderby=published&alt=json-in-script&callback=showrecentposts9\"><\/script>");
</script></div>
<div class='clear'>
</div>Tulisan warna merah diatas adalah kelima label yang saya masukkan pada widget tabber kategori ini, silahkan Anda ganti dengan label Anda dan sesuaikan dengan judul tab view yang sudah dibuat. - Widget Label
Yang termasuk dalam widget label pada layout template ini adalah : Label 1, Label 2, Label 4, Label 4, Label 5 dan Video Category. Anda tinggal memasukkan atau ketik nama label yang sudah Anda buat pada kotak tersebut. Seperti contoh gambar di bawah :
- Widget Subscribe me
Letaknya pada sidebar sebelah kanan paling atas, masih di layout kemudian pilih kotak HTML/Javascript kemudian masukkan kode berikut ini di dalamnya :<style type='text/css'>
.social a{color: #6e6e6e;font: bold 12px Calibri,Helvetica, Arial, sans-serif;text-decoration: none;padding: 3px 5px 2px;position: relative;display: inline-block;text-shadow: 0 1px 0 #fff;-webkit-transition: border-color .218s;-moz-transition: border .218s;-o-transition: border-color .218s;transition: border-color .218s; background: #f3f3f3;border: solid 1px #dcdcdc;}
.social a:hover {color: #333;border-color: #999;-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);-webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);}
.social a:active{color:#000;border-color: #444;}
.sub-box{width:300px;background:();padding: 2px 5px 7px 2px;font-family:Droid Sans,Helvetica,Arial;}
.emailform{margin:16px 0 0; display:block; clear:both;}
.emailtext{margin:10px 0 0;background:#f6f6f6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgaPpnV5hjp9HeTeJDOiN5AFiIh4ubBQdH47zPQQGejop3Cg_FQqN5u9cRbZy4OL3iNGpv6GkdxGAZRnfarSL9QPu3WttPfk7bN2AEoVKzdoWFAFZJTiEuw7mGh-HQ85sihOwlazeIXeA/s1600/email.png) no-repeat scroll 4px center;padding:6px 5px 6px 34px;color:#444;font-weight:bold; text-decoration:none;border:1px solid #ccc;width:175px;}
.emailtext:hover{background: #f3f3f3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgaPpnV5hjp9HeTeJDOiN5AFiIh4ubBQdH47zPQQGejop3Cg_FQqN5u9cRbZy4OL3iNGpv6GkdxGAZRnfarSL9QPu3WttPfk7bN2AEoVKzdoWFAFZJTiEuw7mGh-HQ85sihOwlazeIXeA/s1600/email.png) no-repeat scroll 4px center;border-color:#999;}
.emailtext:focus{outline:none;}
.sub-button{color:#eee;font-weight:bold; text-decoration:none;padding:5px 10px; border:1px solid #666;cursor:pointer;background:#999}
.sub-button:hover{color:#444;border-color: #999;background:#ccc}
</style>
<center><div class="social" style="padding: 0pt 0pt 0pt 5px;">
<table><tbody><tr><td>
<a href='http://feedburner.google.com/fb/a/mailverify?uri=maskolis' target='_blank'><img alt='newsletters' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwoRWp8NQRvB0INDdGFoMbChDwv1gNN7ZhX5Z6IfCO5OpR5_WYGPZjbA1WJQv10LRFpR9Hiv6UehsV409DuOK4V8SH6bIvkRaesET-KBQwQzZI2l6Pu0Ob4nWHZvoun7ImMpsGCcgOAe0/s1600/mail.png" border="0" title='newsletters'/></a> </td>
<td> <a href='http://feeds.feedburner.com/maskolis' target='_blank'><img alt='rss' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEPQWt-VeNmB0oTMiDZQ0nDPjDRoviVJcudggxGmuhoZ3pGm-NJ1Gbr9PQk1HWqO0XUwpp3wyq1OgtbQ5GyZGoWLBJdFEkfeXTHlfx7YSAcczBclsPwknk43jtSYZVToxKoN41e7QrlzQ/s1600/rss.png" border="0" title='rss'/></a> </td>
<td> <a href='http://twitter.com/maskolis' target='_blank'><img alt='twitter' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAUoMfeIfvevCq3W9Xc0AhGTnPbmHlQENVe7F3sPmpthRAeqgzBeCKcMvB9fgEWRX2UDBxbppso1okAwoABWI5hYbnMJYZ3L9tgUZdY2dOK4WHVT8bY9VOAVk6uzt-ZQ4BHAhj3WjpL7s/s1600/twitter.png" border="0" title='twitter'/></a> </td>
<td> <a href='http://www.facebook.com/maskolis' target='_blank'><img alt='facebook' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXQin4HulmcXHEkd5l0u43AqOh8OcDmVL04usty1l41FVhHVk5lgAoTQzzQF6AKhXIctsU3q6Vzd8-YiYLR90lniKf86vAT-2pW7thy2dOmFwhFQ7EY_EfLyTT9w5HxzM_VJAfM_gleB4/s1600/facebook.png" border="0" title='facebook'/></a> </td>
<td> <a href='http://www.youtube.com/maskoli' target='_blank'><img alt=' youtube' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSFbyycT_sz6fmzn8pm8kcb2mVPbUrwt99KalP7j4a36UqiqVkyTsPUhKMKwDDRnCG9YP3W6SG55pXd6p6KNVCoUvp1GDCafBSd6CQMpjkxAvp02qmMsyzjvuFXNKd6P_F4eejRELoVnQ/s1600/youtube.png" border="0" title='youtube'/></a>
</td></tr></tbody></table> </div></center>
<center>
<div class='sub-box'>
<div style="text-align: left; display: inline-block;">
<h8 style="display:block;font-family:'calibri';font-size:15px;font-weight:bold;">Subscribe via RSS Feed</h8>
<small><i>If you enjoyed this article just <a href='http://feeds.feedburner.com/JohnyTemplate' target='_blank' title='feedburner'>
<b>click here</b></a>, or subscribe to receive more great content just like it.</i></small>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=maskolis', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="maskolis" name="uri"/>
<input type="hidden" name="loc" value="fr_FR" />
<input type="text" onblur="if (this.value == "") {this.value = "Enter your email...";}" onfocus="if (this.value == "Enter your email...") {this.value = ""}" value="Enter your email..." name="email" class="emailtext" />
<input type="submit" class="sub-button" value="Enter" title='' alt='' />
</form></div></div></center> - Reply Comment
Untuk mengaktifkan fungsi reply pada komantar pada template ini, ganti Blog ID pada template ini pada Edit HTML (jangan lupa centang expand widget template) : 149656394876047094setelah ketemu ganti dengan blog ID anda