Sebelum
besok libur karena ada keperluan penting selama dua hari, kali ini saya bagi
lagi dua template yang super jelek dari Johny. Saya sampai sekarang masih mikir
kok ya bisa-bisanya pakai nama Johny di setiap template yang saya buat. Padahal
tidak ada satupun keluarga atau kerabat dekat yang punya nama Johny, mungkin
dulu saya pengin punya nama Johny, tapi nggak kesampaian. Okeehhh... karena
dari tadi sudah ada panggilan melulu dari HP, langsung saja nikmati kedua
template super jelek kali ini, yang satu pake slider yang lain saya buat biasa dengan
dua kolom seperti yang banyak diminta sama teman-teman blogger di kolom
komentar.
Slider
Masukkan kode berikut pada kolom kosong di bawah header. Masuk ke Layout/Tata Letak >> Add a Gadget pilih HTML/Javascript :
<div
class='lof-main-wapper' id='slider'>
<div class='slider-main-outer'>
<ul class='slider-main-wapper'>
<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='slider-navigator-outer'>
<ul class='slider-navigator'>
<script>
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script>
</ul>
</div>
</div>
<div class='slider-main-outer'>
<ul class='slider-main-wapper'>
<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='slider-navigator-outer'>
<ul class='slider-navigator'>
<script>
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script>
</ul>
</div>
</div>
Kode
diatas bekerja berdasarkan artikel terbaru, jika Anda ingin menampilkan label
atau kategori tertentu baca postingan saya tentang Modifikasi Slider Lofslidernews
Maknyus.
Widget Komentar
Masukkan kode di bawah ini pada widget sidebar :
<style
type="text/css">
ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
.tb_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.tb_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 30,
characters = 60,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://html-scripts.googlecode.com/files/rcentcmmntavr.js"></script>
<script type="text/javascript" src="http://www.maskolis.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>
ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
.tb_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.tb_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 30,
characters = 60,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://html-scripts.googlecode.com/files/rcentcmmntavr.js"></script>
<script type="text/javascript" src="http://www.maskolis.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>
Ganti URL warna merah http://www.maskolis.com
dengan URL blog Anda.
Widget random post
Widget random post
<script
type="text/javascript">
var randarray = new Array();var l=0;var flag;
var numofpost=7;function randomposts(json){
var total = parseInt(json.feed.openSearch$totalResults.$t,10);
for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
document.write(item);}}
}document.write('</ul>');}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>
var randarray = new Array();var l=0;var flag;
var numofpost=7;function randomposts(json){
var total = parseInt(json.feed.openSearch$totalResults.$t,10);
for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
document.write(item);}}
}document.write('</ul>');}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>
Angka 7 pada kode
diatas adalah jumlah random post yang ditampilkan, silahkan ganti sesuai
keinginan.
Search Box
Search Box
Search box
atau kotak pencarian yang saya gunakan pada template ini saya ambil dri Google
CSE, silahkan And langsung ketik Google CSE di halaman Google kemudian
membuat kotak search. Gampang caranya, tinggal ikuti petunjuk yang ada. Atau
Anda bisa ganti dengan kotak search dari tutorial yang banyak beredar di
internet.
Template
ini sama dengan Bukan Johny, bedanya template ini tidak ada slidernya,
lebih sederhana dan gampang sekali cara pemakaiannya. Nama template ini....
bingung mau dikasih nama apa, ahh lagian juga ngapain dikasih nama yang penting
isinya bung. Demonya pakai blog seadanya, yang penting templatenya jalan.
Kedua template ini dasarnya dari Johny Wuss, jadi semua tag H1 dan H2 sudah terpasang, tapi belum saya validasi HTML nya. Jangan terlalu fokus mengatasi masalah error validasi HTML, sangat wajar jika sebuah blog mempunyai error pada struktur HTMLnya. Santai saja, yang penting berbagi, membuat artikel yang bermanfaat bagi pembaca, bukankah setelah kita mati hanya tiga hal yang bisa terus memberikan manfaat salah satunya yaitu ilmu dan informasi yang kita berikan kepada orang lain? Hahaha... malah seperti pak Ustadz, ya itu tadi dua template yang saya bagikan gratis kepada teman-teman semua disini.
Kedua template ini dasarnya dari Johny Wuss, jadi semua tag H1 dan H2 sudah terpasang, tapi belum saya validasi HTML nya. Jangan terlalu fokus mengatasi masalah error validasi HTML, sangat wajar jika sebuah blog mempunyai error pada struktur HTMLnya. Santai saja, yang penting berbagi, membuat artikel yang bermanfaat bagi pembaca, bukankah setelah kita mati hanya tiga hal yang bisa terus memberikan manfaat salah satunya yaitu ilmu dan informasi yang kita berikan kepada orang lain? Hahaha... malah seperti pak Ustadz, ya itu tadi dua template yang saya bagikan gratis kepada teman-teman semua disini.
Dan satu
lagi template ini bukan template responsif, karena saya tidak punya HP
canggih untuk mengakses Internet dan belum pernah sekalipun browsing lewat HP.
Untuk saat ini mungkin saya masih belum butuh responsif, suatu saat nanti jika
HP saya sudah pakai merek terkenal seperti beri-beri mungkin baru mendalami
responsif template. Oke.. jika tertarik silahkan dipakai, jika ada yang kurang
jelas kebangeten banget, ini template sangat sederhana dan semua fitur yang
saya pasang sudah saya berikan dalam bentuk tutorial sebelumnya. Tapi kalau mau
tanya ya silahkan saja isi kotak komentar di bawah, sekian dulu dan selamat
malam mau istirahat dulu, besok mesti berangkat pagi-pagi.
PENGUMUMAN PENTING
Silahkan baca sendiri disini
Điện - Điện tử
Cơ khí - Ô tô
Xây dụng - Nông nghiệp
Kinh tế - Du lịch
Công nghệ TT - Ngoại ngữ
Đăng nhận xét