Assalamualaikum..wr.wb ....Salamsejahtera dan sukses selalu buat sobat semua, ! Sekarang saya akan berbagi dan membahas tentang Cara Mudah Membuat Artikel Terkait Dengan Gambar Bergerak kesamping di Blog dan
semoga artikel ini bermanfaat buat sobat yang mampir di blog ini, bila
berkenan setelah membaca artikel ini sobat bisa meluangkan untuk
meninggalkan jejak pada kotak komentar dan Insya Alloh saya akan
berkunjung balik ke blog/web sobat sebagai tanda terima kasih saya atas
kunjungannya.
Cara Mudah Membuat Artikel Terkait Dengan Gambar Bergerak (Efek Marquee) di Blog mungkin sudah tak asing lagi, namun berdasarkan pengalaman yang saya dapatkan setelah berselancar di google beberapa tutorial yang ada ternyata ada yang tidak bisa diterapkan alias gagal. Namun setelah sekian banyak blog/web yang menyediakan tutorial ini saya menemukan tutorial yang cocok dengan template blog saya, dan setelah di amati dan diperhatikan ternyata penyebab dari kegagalan tutorial sebelumnya itu ada pada kode Javascriptnya yang tidak ada. inilah Cara Mudah Membuat Artikel Terkait Dengan Gambar Bergerak (Efek Marquee) di Blog yang sudah lengkap dengan javascriptnya.
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode </head>
6. Taruh (copy paste) kode berikut ini di atasnya :
<!--Related Posts with thumbnails Scripts and Styles Start-->
<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://my-project-favicon.googlecode.com/files/relatedposts.js.txt' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
7. Lalu cari kode di bawah ini :
<div class='post-footer-line post-footer-line-1'>
-Atau jika tidak menemukannya cari kode berikut ini
<p class='post-footer-line post-footer-line-1'>
8. Jika sudah ketemu salah satu kode tersebut, Copy paste kode berikut tepat dibawahnya
<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>
</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://lebih-kreatif.blogspot.com/' style='display:none;'></a>
</b:if>
</b:if>
Sekian Dulu Tips Trick dan Cara Mudah Membuat Artikel Terkait Dengan Gambar Bergerak kesamping di Blog
Cara Mudah Membuat Artikel Terkait Dengan Gambar Bergerak (Efek Marquee) di Blog mungkin sudah tak asing lagi, namun berdasarkan pengalaman yang saya dapatkan setelah berselancar di google beberapa tutorial yang ada ternyata ada yang tidak bisa diterapkan alias gagal. Namun setelah sekian banyak blog/web yang menyediakan tutorial ini saya menemukan tutorial yang cocok dengan template blog saya, dan setelah di amati dan diperhatikan ternyata penyebab dari kegagalan tutorial sebelumnya itu ada pada kode Javascriptnya yang tidak ada. inilah Cara Mudah Membuat Artikel Terkait Dengan Gambar Bergerak (Efek Marquee) di Blog yang sudah lengkap dengan javascriptnya.
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode </head>
6. Taruh (copy paste) kode berikut ini di atasnya :
<!--Related Posts with thumbnails Scripts and Styles Start-->
<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://my-project-favicon.googlecode.com/files/relatedposts.js.txt' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
7. Lalu cari kode di bawah ini :
<div class='post-footer-line post-footer-line-1'>
-Atau jika tidak menemukannya cari kode berikut ini
<p class='post-footer-line post-footer-line-1'>
8. Jika sudah ketemu salah satu kode tersebut, Copy paste kode berikut tepat dibawahnya
<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>
</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://lebih-kreatif.blogspot.com/' style='display:none;'></a>
</b:if>
</b:if>
Sekian Dulu Tips Trick dan Cara Mudah Membuat Artikel Terkait Dengan Gambar Bergerak kesamping di Blog
Anda sedang membaca artikel tentang Cara Cepat dan Mudah Membuat Artikel Terkait / Related Post Dengan Gambar Bergerak Kesamping di Blog , Anda boleh menyebar luaskan atau mengcopy - paste artikel di atas jika memang sangat bermanfaat bagi anda.. Dengan syarat anda harus meletakkan link di bawah ini sebagai sumbernya..
