Setelah kemaren memposting tentang cara membuat Related Posting menggunakan Daftar list berdasarkan Label dan Related Posting menggunakan Gambar(Thumbnail). Nah kali ini sedikit berkaitan dengan Related Posting menggunakan Gambar(Thumbnail).
Nah, untuk menampilkan Related Posting menggunakan Gambar anda bisa lihat disini cara membuatnya.
Namun ada sedikit kekurangan dari Related posting ini, yaitu anda tidak bisa menampilkan Related postingnya dalam jumlah yang banyak, jumlah yang ditampilkan sebatas ukuran lebar halaman posting saja, seperti halnya blog ini, hanya bisa menampilkan 4 judul serta gambar dari related posting tersebut.
Lalu bagaimana cara menampilkan related posting tersebut dalam jumlah yang banyak...???
Oke, yang ingin di sharingkan kali ini mencoba mengangkat tentang menggunakan metode Marquee pada thumbnail related posting. Untuk contoh anda bisa lihat kebawah posting ini.
Setelah mengutak-atik sedikit, sampai sempat sedikit error, hingga akhirnya saya membuat blog lagi khusus untuk eksperimen kode ini (lebay neehhh), dan akhirnya berhasil juga nih Thumbnail Related Posting menggunakan metode marqueenya....karena ternyata utk membuat agar bisa berhasil namun tidak membuat seluruh dari komponen related posting ini berjalan semua harus ada sedikit perubahan.
Oke langsung saja deh...
Nah, untuk membuatnya, anda cukup melakukan perubahan pada kotak code yang kedua().
Contoh codenya seperti ini :
Cukup ganti seluruh code tersebut dengan code dibawah ini :
Anda bisa mengganti angka 10 dengan jumlah yang anda inginkan, ini adalah jumlah related posting yang ingin di tampilkan.
Jika sudah selesai, silakan simpan hasil kerja anda.
NB : Untuk yang sudah menggunakan code Thumbnail related post ini, jika anda ingin mencari code tersebut di Template anda, anda bisa menggunakan Ctrl+F lalu ketik code yang anda cari (misalnya : <!-- Related Posts with Thumbnails Code Start-->).
NB : Sedikit informasi, yang saya ketahui untuk Related posts marquee ini hanya compatible jika anda menggunakan browser Firefox, Flock, Opera.
Smoga berhasil,
Smoga bermanfaat
Terima Kasih
Nah, untuk menampilkan Related Posting menggunakan Gambar anda bisa lihat disini cara membuatnya.
Namun ada sedikit kekurangan dari Related posting ini, yaitu anda tidak bisa menampilkan Related postingnya dalam jumlah yang banyak, jumlah yang ditampilkan sebatas ukuran lebar halaman posting saja, seperti halnya blog ini, hanya bisa menampilkan 4 judul serta gambar dari related posting tersebut.
Lalu bagaimana cara menampilkan related posting tersebut dalam jumlah yang banyak...???
Oke, yang ingin di sharingkan kali ini mencoba mengangkat tentang menggunakan metode Marquee pada thumbnail related posting. Untuk contoh anda bisa lihat kebawah posting ini.
Setelah mengutak-atik sedikit, sampai sempat sedikit error, hingga akhirnya saya membuat blog lagi khusus untuk eksperimen kode ini (lebay neehhh), dan akhirnya berhasil juga nih Thumbnail Related Posting menggunakan metode marqueenya....karena ternyata utk membuat agar bisa berhasil namun tidak membuat seluruh dari komponen related posting ini berjalan semua harus ada sedikit perubahan.
Oke langsung saja deh...
Nah, untuk membuatnya, anda cukup melakukan perubahan pada kotak code yang kedua().
Contoh codenya seperti ini :
<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><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>
<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:loop>
<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'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://serba-seru.blogspot.com/2010/02/thumbnail-related-post-artikel-terkait.html' style='display:none;'>Thumbnail Related Post</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger tutorials</a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->
<!-- remove --><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>
<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:loop>
<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'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://serba-seru.blogspot.com/2010/02/thumbnail-related-post-artikel-terkait.html' style='display:none;'>Thumbnail Related Post</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger tutorials</a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->
Cukup ganti seluruh code tersebut dengan code dibawah ini :
<!-- Marquee Serbablog Related Posts with Thumbnails Code Start-->
<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=12"' type='text/javascript'/></b:if></b:loop>
<h3><b>Related Posts</b></h3>
<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=10;
var relatedpoststitle="";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
<a href='http://serba-seru.blogspot.com/2010/02/thumbnail-related-posting-with-marquee.html' style='float:right;' target='_blank'>Thumbnail Related Post Berjalan (Marquee)</a></div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://serba-seru.blogspot.com/' style='display:none;'>Serba Blog</a>
</b:if>
</b:if>
<!-- Marquee Serbablog Related Posts with Thumbnails Code End-->
<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=12"' type='text/javascript'/></b:if></b:loop>
<h3><b>Related Posts</b></h3>
<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=10;
var relatedpoststitle="";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
<a href='http://serba-seru.blogspot.com/2010/02/thumbnail-related-posting-with-marquee.html' style='float:right;' target='_blank'>Thumbnail Related Post Berjalan (Marquee)</a></div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://serba-seru.blogspot.com/' style='display:none;'>Serba Blog</a>
</b:if>
</b:if>
<!-- Marquee Serbablog Related Posts with Thumbnails Code End-->
Anda bisa mengganti angka 10 dengan jumlah yang anda inginkan, ini adalah jumlah related posting yang ingin di tampilkan.
Jika sudah selesai, silakan simpan hasil kerja anda.
NB : Untuk yang sudah menggunakan code Thumbnail related post ini, jika anda ingin mencari code tersebut di Template anda, anda bisa menggunakan Ctrl+F lalu ketik code yang anda cari (misalnya : <!-- Related Posts with Thumbnails Code Start-->).
NB : Sedikit informasi, yang saya ketahui untuk Related posts marquee ini hanya compatible jika anda menggunakan browser Firefox, Flock, Opera.
Smoga berhasil,
Smoga bermanfaat
Terima Kasih
Mantap sob, saya coba ya di blog saya
ReplyDeletebiar keren kyk punya nya Mas :)
related post wit marquee.. contohnya seperti punya kamu kan?? wah keren.. tapi memperlama loading blog ga ya??
ReplyDeletekok ga mau ya?
ReplyDeletekok malah error? help me
@ Agung : td kayaknya ada code yg kehapus...skrg udh di benerin tuh...+ udh di uji coba lagi....ma'nyussss....thanx infonya yaaa...hampir aja tuh jd kasus script codenya...heheheheeee...
ReplyDelete@ ambar : kl liat dr loading blog...kan bisa liat sendiri blog ini, sebenarnya kl blognya udh pake thumbnail related, trus mau di bikin marquee...ga bakal ngaruh dg loading blog, coz cm nambah sedikit code aja tuh...
oQe jUGa nI hAsil eKKsperimennYa sObat,,
ReplyDeleteThanks mamen, skrg udah bisa :D
ReplyDeletekenapa yah sob blog aq g bisa dipasang artikel terkait ?
ReplyDeletenice info... thanks sob
ReplyDeleteThx banget bro....
ReplyDeletebisa dijadikan bahan modifikasi nich....
ReplyDeletekeren bozz
ReplyDeleteakan segera dicoba
bos bisa g marqueenya dipercepat jalannya,soalnya marqueenya menurut saya terlalu lama
ReplyDeleteKeren Banget kapan-kapan masuk di http://blogharriz.blogspot.com ya...
ReplyDeleteSelamat pagi bozz.. nanya ne kalo buat recent post ada ga bos sprt " Thumbnail Related Posting with Marquee "
ReplyDelete@ ~MJ_QueeN~ : bisa dipercepat, cari aja tulisan ini scrollamount='2' , trus ganti angka 2 dengan angka sesuai selera...
ReplyDelete@ ALMANDURY : maksudnya gimana yaaa...???
@ All : Thanx atas kunjungannya
Sudah terpasang gan.
ReplyDeleteThanks..
Tks gan berhasil.. tp tetap sm tidak bs tampil di hal muka..
ReplyDeletekok ga muncul ya gan?? yg muncul cuma tulisan related post nya doang.. thumbnail gambarnya ga nongol? gimana solusinya??
ReplyDeletemanatb gan,,, mohon untuk nyedottttttttttttt
ReplyDeletemakasih...sangat bermanfaat nie
Nice share kak Admin ....
ReplyDeleteSangat Bagus Buat Blog ane template standar :)
KEREN MAS THANKS Y...SALAM KENAL
ReplyDeletemantab gan sangat membantu untuk mempercantik blog
ReplyDeletelihat hasilnya di blog saya http://aboutkomik.blogspot.com/2011/10/hulk-hijau.html tpi saya lagi ngedit warnanya biat kelihatan menarik
ReplyDeletehehehe... sekalia lagi top dah buat agan
mantap artikelnya sob..
ReplyDeleteinformasi bermanfaat sekali.
thx udah sharing