Membuat Artikel Terkait di Blog

Subscribe in a reader
avatar

Penulis : vgathy


Jam Posting : 23.58

Bookmark and Share
Membuat Related Post di blog cukup banyak variasinya.semuanya tergantung selera pemilik (author) blog itu sendiri. Related Post dengan menampilkan hanya dalam bentuk gambar atau image membuat blog kelihatan lebih modern.
Simple Blogger Tutorial memberikan tips kepada kita bagaimana cara membuat related post with thumbnail pada blog dengan bantuan effect jquery.

Urutan pemasangannya sebagai berikut :
Buka Dashboard blog anda, kemudian klik rancangan dan pilih Edit HTML.
Cari kode </head> lalu letakan kode dibawah ini diatas kode </head>

<!-- CSS (required if needed) -->
<link type="text/css" href="http://blogger-related-posts.googlecode.com/svn/v2/style1.css" rel="stylesheet" />

<!-- jQuery Library (required only once) -->
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js'/>

<!-- jQuery Plugin (required) -->
<script type='text/javascript' src='http://blogger-related-posts.googlecode.com/files/jquery.related-posts-widget-2.0.min.js'/>

(lihat yang berwarna biru. Jika anda telah memasang script jQuery di blog, silahkan check apa jQuery yang anda pasang merupakan versi baru atau bukan)

kemudin untuk memanggil jQuery yang sudah terpasang, silahkan copy-paste kode berikut ini

<!--~~~~~~~~ Calling widget -->
<script type="text/javascript">
//<![CDATA[

$(document).ready(function(){
$('#related-posts-widget').relatedPostsWidget();
});
//]]>
</script>
<!--~~~~~~~~~~~~~~~~~~~~~~~~-->

kemudin letakan sebelum kode </head>

Simpan template anda.

Selanjutnya, menempatkan posisi related post.

Klik rancangan, tambah gadget blog kemudian copy paste script html dan letakkan di widget tambahan.


<!--~~~~~~~~~~~~~~~~~~~~~~~ required HTML -->
<div class="related-posts-widget">

<!-- {
thumb_size:'s104-c'
,titles:0
,max_posts:12
,tags:[]
,show_n:4
,animate:'width'
} -->
loading..
</div>
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->

simpan dan lihat hasil pekerjaan diatas.

sumber : http://www.simplebloggertutorials.com

Ikuti di Buzz

1 komentar:

Posts