Ads (728x90)

Cara Membuat Popular Post Dengan Gambar Berputar - Hallo friend FULL VERSION FREE DOWNLOAD GAMES , SOFTWARE , TEMPLATE , EBOK ETC, Sharing software on the game and this time entitled Cara Membuat Popular Post Dengan Gambar Berputar, I have provided a complete game with the download link and crack. hopefully the game and software content of posts I wrote this for you can understand. Okay, here's the game and the software.

Cara Membuat Popular Post Dengan Gambar Berputar


Cara Membuat Popular Post Dengan Gambar Berputar ~ Pada kesempatan kali ini,saya akan berbagi tutorial bagaimana Cara Membuat Popular Post Dengan Gambar Berputar.Dengan membuat popluar post,maka pengunjung pada blog kita mengetahui artikel apa yang sedang populer pada blog kita.Dengan adanya animasi gambar berputar pada widget popular post kita,maka blog sobat akan terlihat leibh hidup dan keren.
Contoh Popular Post
Jika sobat tertarik untuk membut Popular Post Dengan Gambar Berputar,sobat bisa mengikuti tahapan pembuatannya.
◘ Tahap Pertama : 
♦ Masuk akun Blogger - design/Rancangan - Add Gadget dan pilih Popular Post
♦ Setiap widget default blogger akan langsung memberi nama pada widget tersebut, misalnya "Popular Posts". Kalian bisa menggantinya dengan nama lain sesuai dengan keingginan.
♦ Dalam menu Popular Post kalian ceklist image thumbnail, untuk snippet tidak perlu
♦ Jumlah popular Post yang ingin ditampilkan, kalian isi dengan yang diinginkan
♦ Save
◘ Tahap Kedua :
♦ Masuk menu Design/Rancangan - Edit HTML, dalam peng-editan ini tidak perlu men-ceklist Expand Widget Template
♦  Kemudian cari kode ]]></b:skin> dan tempatkan kode CSS dibawah ini di atasnya.
.popular-posts .item-thumbnail {
float:left;
}
.popular-posts ul {
padding-left:30px;
}
.popular-posts ul li {
list-style-image: none;
list-style-type: none;
display:inline;
}
.popular-posts ul li img {
padding:0px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
border: 2px solid #CCC;
}
.popular-posts ul li img:hover {
border:2px solid #ccc;
-moz-transform: scale(1.3) rotate(-360deg);
-webkit-transform: scale(1.3) rotate(-360deg);
-o-transform: scale(1.3) rotate(-360deg);
-ms-transform: scale(1.2) rotate(-360deg);
transform: scale(1.3) rotate(-360deg);
}
♦ Selanjutnya cari kode <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>
♦ Dan ganti semua kode tersebut dengan kode kode dibawah ini :
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if> <div class='widget-content popular-posts'> <ul> <b:loop values='data:posts' var='post'> <li> <b:if cond='data:showThumbnails == &quot;false&quot;'> <b:if cond='data:showSnippets == &quot;false&quot;'> <!-- (1) No snippet/thumbnail --> <a expr:href='data:post.href'><data:post.title/></a> <b:else/> <!-- (2) Show only snippets --> <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div> <div class='item-snippet'><data:post.snippet/></div> </b:if> <b:else/> <b:if cond='data:showSnippets == &quot;false&quot;'> <!-- (3) Show only thumbnails --> <div class='item-thumbnail-only'> <div class='item-thumbnail'> <a expr:href='data:post.href' expr:title='data:post.title'> <b:if cond='data:post.thumbnail'> <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/> <b:else/> <img alt='' border='0' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize' src='http://www.freetradeireland.ie/site/images/no-image.gif'/> </b:if> </a> </div> </div> <b:else/> <!-- (4) Show snippets and thumbnails --> <div class='item-content'> <b:if cond='data:post.thumbnail'> <div class='item-thumbnail'> <a expr:href='data:post.href' target='_blank'> <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/> </a> </div> </b:if> <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div> <div class='item-snippet'><data:post.snippet/></div> </div> <div style='clear: both;'/> </b:if> </b:if> </li> </b:loop> </ul> <b:include name='quickedit'/> </div> </b:includable>
</b:widget>
♦ Save template sobat.
Note:Kode yang diberi warna hijau popularposts1 tiap template berbeda, terkadang pengkodeannya adalah popularposts2, jika hal itu terjadi, kalian ganti saja popularposts1 dengan popularposrts2.
Bagaimana sobat?Mudahkan...
Demikian Tutorial bagaimana Cara Membuat Popular Post Dengan Gambar Berputar.Semoga bermanfaat bagi kita semua.

Salam Blogger

Article : Cara Membuat Popular Post Dengan Gambar Berputar
article Title : Cara Membuat Popular Post Dengan Gambar Berputar


Thus articles Cara Membuat Popular Post Dengan Gambar Berputar

A few games and software Cara Membuat Popular Post Dengan Gambar Berputar, hopefully can provide benefits to all of you. Okay, so the post game and software this time.

You're reading an article Cara Membuat Popular Post Dengan Gambar Berputar and this article is a url permalink https://softsharest.blogspot.com/2013/02/cara-membuat-popular-post-dengan-gambar.html Hopefully this article This can be useful.

Posting Komentar

  1. Waahhh Makasih Info Nya Gan
    Patut Di COba

    #Comment Back http://sharing4rt.blogspot.com

    BalasHapus
  2. wahh, mantep nih tips...!
    makasih ya kak ^_^

    BalasHapus
  3. wah nice info gan ,,,salam kenal

    BalasHapus
  4. terimakasih Gan, matap artikelnya,

    BalasHapus
  5. boleh neh di coba

    BalasHapus
  6. Makasi gan tipsnya, izin nyoba gan..=)

    electro-bee.blogspot.com

    BalasHapus
  7. Kok cuplikan di Home blog saya jadi nggak ada ya?

    Salam kenal!

    BalasHapus
    Balasan
    1. maksudnya cuplikan apa ya gan?

      ok salam kenal juga ... !!!

      Hapus
  8. mau nayak dikit....
    gimana ya... kalau cara buat like box pada blog itu, kan udah dibuat tapi yang keluar cuma box dan namanya aja; nggak ada tombol likenya....
    tolong dipostkan ya.. tutorialnya...
    sama... satu lagi.,.,.berkunjung juga ya keblog ku
    "delcivzatrickit123.blogspot.com"

    BalasHapus