Koendya: Template

Bagi pengguna template baru blogger.com diharapkan tutorial ini bermanfaat bagi anda, karena postingan kali ini adalah bagaimana caranya memasukkan kode HTML pada Blog, khususnya buat anda para blogger yang menggunakan template baru dari blogger.com. Baiklah untuk tidak memperpanjang mukhaddimah marilah kita mulai pembahasannya. (Emang ceramah pakai mukhaddimah segala. hehehehe).
Oke dech, mari kita mulai... letsgo....
1. Ketik http://www.blogger.com
2. Login dengan User ID dan Password anda
3. Klik Menu Tata Letak
4. Klik Tambah Gadget
5. Pilih HTML/Javascript
6. Masukkan Kode HTML pada kolom yang disediakan
7. Klik Simpan / Save
8. Untuk Memindahkan Posisinya, anda bisa drag ke tempat yang diinginkan kemudian lepaskan, dan jangan lupa klik save lagi setelah selesai. Klik View/Pratinjau untuk melihat hasilnya. Selamat mencoba ya, semoga bermanfaat..... dan jangan lupa comment ke postingan ini ......

»» Readmore this article...

Setelah beberapa waktu tidak melakukan update pada blog zona-klik, kali ini admin akan memberikan sedikit tips seputar blog kepada pembaca setia zona-klik yang mungkin telah lama menunggu posting terbaru pada blog ini. Adapun posting kali ini zona-klik ingin sharing tentang "Membuat Related Post Dengan Thumbnails". . Dimana Related Post tersebut berbeda dengan Related Post yang dibahas pada artikel ini. Related Post pada artikel sebelumnya hanya menampilkan link judul posting dibawah artikel yang berhubungan dengan artikel yang sedang dibaca, sedangkan related post dengan thumbnails akan menampilkan link judul beserta gambar.

Berikut adalah lagkah-langkah yang harus dilakukan untuk membuat Related Post Dengan Thumbnails :

1. Login ke account blogger anda

2. Masuk ke halaman Edit Html dan jangan lupa beri tanda centang pada "Expand Widget Templates"

3. Cari dan temukan kode </head>

4. Gantilah kode tersebut dengan kode dibawah ini :

<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>

</head>

5. Cari dan temukan lagi kode dibawah ini pada halaman Edit HTML Template blog anda

<div class='post-footer-line post-footer-line-1'>

6. Letakkan kode dibawah ini persis dibawah kode diatas

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:if></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger widgets</a>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=5;
var relatedpoststitle="Related Posts";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>

7. Simpan Template

Apabila langkah-langkah diatas di lakukan dengan benar coba lihat hasilnya pada blog anda, maka related post dengan thumbnails muncul pada halaman posting.

Semoga bermanfaat.

»» Readmore this article...

Koendya

Rabu, 28 Desember 2011

Memasang Kode HTML pada Blog

Membuat Related Post Dengan Thumbnails

Kamis, 10 November 2011

Penyedia Template Blogspot Gratis