Membuat Popular Posts Bergerak Otomatis

Posted: Rabu, 24 Oktober 2012 by Unknown in
0
Fungsi Membuat Popular Posts Bergerak Otomatis yaitu agar pengunjung bisa melihat seluruh
artikel yang populer tanpa memakan banyak tempat diblog. atau hanya untuk memperindah & mempercantik tampilan, agar pengunjung betah berlama-lama di blog kita.
Jika anda tertarik silahkan simak Tutorial dibawah ini:

Cara Membuat Popular Posts Bergerak Sendiri kebawah
1.Log in ke blog
2.Pilih Tata Letak
3.Tambah Gadget
4.Klik tanda + disebelah tulisan Entri Populer



5.Simpan
6.Pilih Tambah Gadget lagi
7.Klik tanda + disebelah tulisan HTML/JavaScript
8.Copy kode dibawah ini dan paste dikotak  HTML/JavaScript

<style type="text/css" media="screen">

#PopularPosts1 {
overflow:hidden;
margin-top:2px;
padding:0px 0px;
height:310px;
border-bottom: 1px solid #eeeeee;
}
#PopularPosts1 ul {
width:280px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#PopularPosts1 li {
width:280px;
padding: 5px 5px;
margin:0px 0px 2px 0px;
list-style-type:none;
float:none;
height:75px;
overflow: hidden;
background:none;
}
#PopularPosts1 li .item-title {
    color:#ffffff;
    font-size:12px;
    margin-bottom: 2px;
}
#PopularPosts1 li .item-title a {
text-decoration:none;
color:#fffff;
font-size:12px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#PopularPosts1 li img {
float:left;
margin-right:5px;
background:none;
border:0;
}
#PopularPosts1 li .item-snippet {
  overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:12px;
color:#ffffff;
padding:0px 0px;
margin:0px 0px;
}
#PopularPosts1 .item-snippet a,
#PopularPosts1 .item-snippet a:visited {
    color:#3E4548;
    text-decoration: none;
}
#PopularPosts1 .spyWrapper {
    height: 100%;
    overflow: hidden;
    position: relative;  
}
#PopularPosts1 {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}
.tags span,
.tags a {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}
a img {
    border: 0;
}
-->
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
    $('.popular-posts ul').simpleSpy();
});
</script>
<script src="http://accordion-for-blogger.googlecode.com/svn/trunk/simplespy.js" type="text/javascript"></script>

9.Simpan
10.Geser Widget kode diatas lalu taruh diatas atau dibawah letak widget Popular Posts


    

11. Simpan Setelan 

!! Jadi Dechk !!

»»  READMORE...
Posted: Senin, 22 Oktober 2012 by Unknown in
0

Cara Membuat Read More

Cara Membuat Read More



Langsung saja simak cara membuatnya.
  1. Silangkan Log In ke akun blog anda.
  2. Masuk ke Rancangan / Template > Edit HTML
  3. Sebelum melanjutkan ke langkah berikutnya, alangkah baiknya jika anda backup dulu template anda, agar jika ada kesalahan tidak berpengaruh ke blog anada dengan cara klim Download Full Template.
  4. Centang Expand Template Widget.
  5. Cari Kode </head>, ( cari code cepat tekan F3 ) kemudian masukkan kode di bawah ini di bawah kode tersebut :
<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>
    6. Selanjutnya cari kode <data:post.body/> atau <p><data:post.body/></p>
       Ganti kode di atas dengan kode di bawah ini :

 

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>&#187;&#187;&#160;&#160;READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


    7. Terakhir tentunya simpan template anda dengan klik tombol Save Template.

        Catatan : tulisan yang berwarna merah adalah yang bisa anda ganti.
        ==> Summary noimg 430 = tinggi artikel terpenggal tanpa image
        ==> Summar img 430 = tinggi artikel terpenggal dengan image
        ==> Readmore bisa anda ganti dengan Baca Selengkapnya, full read dll.


Demikian tips cara membuat read more di blog,
Semoga Bermanfaat.
»»  READMORE...