Cara Mudah Membuat Popular Post Bergerak / Slider

Moga tulisan ini bisa membuat Blog agan / adek jadi lebih menarik dan nambah cantik ea, caranya simple dan sangat mudah jadi langsung aja cekidot ea...

Berikut caranya :

1. Masuk ke Blog
2. Pilih Rancangan
3. Tambah Gadget "Entri Popular" ( Jika gadget entri popular/ popular post sudah ) langsung saja menuju>
4. Tambah Gadget "HTML java scrip"
5. Copy kode di bawah ini dan paste pada gadget HTML java scrip tadi

<style type="text/css" media="screen"> #PopularPosts1 { overflow:hidden; margin-top:5px; padding:0px 0px; height:280px; } #PopularPosts1 ul { width:342px; overflow:hidden; list-style-type: none; padding: 0px 0px; margin:0px 0px; } #PopularPosts1 li { width:334px; padding: 5px 5px; margin:0px 0px 5px 0px; list-style-type:none; float:none; height:80px; overflow: hidden; background:#fff url() repeat-x; border:1px solid #ddd; } #PopularPosts1 li .item-title { color:#A5A9AB; font-size:1em; margin-bottom:0.5em; } #PopularPosts1 li .item-title a { text-decoration:none; color:#4B545B; font-size:11px; height:18px; overflow:hidden; margin:0px 0px; padding:0px 0px 2px 0px; } #PopularPosts1 li img {float:left;margin-right:5px;background:#EFEFEF;border:0;} #PopularPosts1 li .item-snippet { overflow:hidden; font-family:Tahoma,Arial,verdana, sans-serif; font-size:10px; color:#262B2F; 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: 5px; -moz-border-radius: 5px;} .tags span, .tags a {-webkit-border-radius: 8px; -moz-border-radius: 8px;} 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://bangjefri-code.googlecode.com/files/popularpost.js" type="text/javascript"></script>

Selanjutnya simpan template dan lihat hasilnya.
Demikian cara membuat popular post berjalan untuk menambah tampilan blog anda lebih menarik.

Cara membuat Popular Post yang unik

Style Popular Post Menarik, keren dan Unik - Tutorial Memodifikasi tampilan Popular Post agar terlihat menarik ini bagus di terapkan agar tampilan blog sobat tidak terlihat kuno dan jadul, Style Popular Post ini sedikit saya modifikasi yang sebelumnya adalah Style Popular Post Warna Warni buatan Arlina Design, Popular Post ini saya terapkan pada template sebelumnya yaitu Micrown Soft Grid.

Tampilan Popular Post kali ini unik karena sangat berbeda dari style Popular Post yang terlihat pada blog/website yang sering kita temukan.

Pastinya sobat sudah tahu fungsi dari widget ini yaitu menampilkan postingan yang paling banyak dilihat oleh pengunjung berdasarkan waktu bisa setiap minggu, bulan, atau sepanjang waktu.

Berikut Tutorial cara membuat Widget Popular Post menjadi menarik :

Note : Jika di Template sobat telah terpasang CSS Popular Post, hapus CSS Popular Post tersebut agar tidak terjadi kesalahan nantinya.

Setelan Wiget Popular Post sesuaikan dengan screenshot di bawah ini :

1. Buka Blogger > Template > Edit HTML > Kemudian tambahkan CSS di bawah ini tepat di atas kode ]]></b:skin> atau </style>

/* CSS Popular Post */ .PopularPosts .item-thumbnail{float:none;margin:0 0 10px} .PopularPosts .item-title{background:rgba(0,0,0,0.5);position:absolute;display:block;clear:both;z-index:10;top:0;left:0;right:0;bottom:0;padding:15px;transition:all .4s;} .PopularPosts .item-title:hover{background:rgba(0,0,0,.2)} .PopularPosts .item-title a{color:rgba(255, 255, 255, 0.88);font-weight:700;font-size:100%;text-shadow:0 0 5px rgba(0,0,0,0)} .PopularPosts .item-title:hover a,.PopularPosts .item-title a:hover{color:rgba(255,255,255,1);text-shadow:0 0 5px rgba(0,0,0,.3)} .PopularPosts .widget-content ul li img{translate(0,0) scale(1.0);transition:all .8s linear} .PopularPosts .widget-content ul li:hover img{transform:translate(0,-20px) scale(1.05);transition:all 3.6s linear;} .PopularPosts img{display:block;height:auto;width:100%;padding:0;backface-visibility:hidden;} .PopularPosts .item-snippet{display:none;} .PopularPosts ul li .item-content{position:relative;overflow:hidden;} .PopularPosts ul{padding:0;line-height:normal;counter-reset:count;} .PopularPosts .widget-content ul li{position:relative;padding:10px 0;overflow:hidden;max-height:100px;transition:all .4s;} .PopularPosts .widget-content ul li:before{color:#fff;counter-increment:count;content:counter(count);position:absolute;right:-15px;top:-5px;font:bold 80px/1 Sans-Serif;z-index:11;transition:all .4s;} .PopularPosts .widget-content ul li:hover:before{right:-55px;} .PopularPosts ul li:nth-child(1) .item-title:hover,.PopularPosts ul li:nth-child(2) .item-title:hover,.PopularPosts ul li:nth-child(3) .item-title:hover,.PopularPosts ul li:nth-child(4) .item-title:hover,.PopularPosts ul li:nth-child(5) .item-title:hover,.PopularPosts ul li:nth-child(6) .item-title:hover{background:rgba(0,0,0,0.2);}

2. Selanjutnya tambahkan Script di bawah ini dan letakan di atas kode </body>

<script type='text/javascript'> // Thumbnail Popular Post $(document).ready(function() {$('.PopularPosts img').attr('src', function(i, src) {return src.replace( 's72-c', 's400' );});}); //<![CDATA[ // Custom Popular Post $(".popular-posts ul li .item-snippet").each(function(){var t=$(this).text().substr(0,120),s=t.lastIndexOf(" ");s>10&&$(this).text(t.substr(0,s).replace(/[?,!\.-:;]*$/,"..."))}); //]]> </script>

Selesai, simpan template dan lihat hasilnya.

Result

Sekian.. Semoga Tutorial "Membuat Widget Popular Post Menarik di Blog" ini bermanfaat. Terima kasih.

Referensi : www.arlinadzgn.com/2015/08/widget-popular-post-warna-warni.html

Referensi : http://www.idblanter.com/2015/09/membuat-widget-popular-post-menarik-di-blog.html 

Berapa Penghasilan Blogger

Membahas masalah penghasilan tentu saja jawaban yang anda inginkan adalah bayaran yang menggiurkan dari jutaan, belasan, puluhan, ratusan sampai miliaran dan itu memang nyata bisa iya bisa juga tidak berpenghasilan sama sekali tergantung pada diri anda sendiri. karena seperti yang sudah daya cantumkan juga kebanyakan dari para blogger gagal karena yang mereka buru adalah penghasilan dan kebanyakan adalah dari pemburu penghasilan ini hanya menyimpulkan penghasilan yang menggiurkan tanpa usaha dan kerja keras, memang banyak para blogger yang mempunyai penghasilan yang menggiurkan dan saya acungi jempol karena kerja keras mereka dari biasa menjadi luar biasa dari pemburu menjadi diburu itulah seorang blogger yang awalnya iseng merajuk sebuah artikel dan memfokuskan pada hobi menulis menjadi pengumpul recehan dan beralih menjadi jutawan. 

jika anda berminat untuk menjadi seorang blogger hal yang pertama harus anda lakukan adalah menjadikan Jurnalis/Pekerjaan menulis menjadi Hobi barulah kita melaju dan berkembang ke tahap perekrutan visitor dan tahap terakhir adalah mengumpulkan recehan bukan memburu recehan karena hal yang di lakukan oleh para blogger newbie yang hanya memburu penghasilan hanya akan menemukan titik buta dimana kualitas artikelnya sangatlah buruk karena tidak melihat dan menjalankan tahap demi tahap, menjadikan mereka bingung dan menemukan titik jenuh titik kemalasan dan putus asa.

jadi penghasilan seorang blogger pada intinya adalah tergantung pada diri anda sendiri tentunya sesuai dengan perjuangan yang anda lakukan namun bukan perjuangan mengolah penghasilan tetapi perjuangan anda dalam dunia Blogger

Domain Gratis

Salam SEO Cirebon

Kali ini saya akan mencoba mengembangkan sebuah strategi untuk meningkatkan pengunjung blog kita dengan memanfaatkan domain gratis dari www.freenom.com atau kita kenal dengan Dot Tk www.dot.tk/id/index.html

 

Tentu saja dengan keunikan dari sebuah domain ini yang benar – benar gratis untuk periode 1 tahun dan menurut saya dari kebanyakan blogger yang sudah mengetahui hal ini pastinya mereka lebih memilih menggunakan domain Dot Tk ini ngetimbang menggunakan domain dari bawaan blog gratisan (blogspot / Wordpress) karena jenis domain ini belum banyak yang menggunakan dari kalangan blogger newbie maka dari pada itu saya mencobangkannya untuk mengganti URL blogspot.com dan wordpress.com menjadi domain.tk/gl/ml atau kalian bias memilih sendiri dengan login atau sigup ke www.dot.tk/id/index.html

Dari beberapa yang sudah saya pakai mungkin untuk para blogger yang hanya sekedar hobi menulis artikel akan tertarik dengan layanan domain gratis ini, ea di bilang gratis siapa yang ga tertarik namun ada juga beberapa hal untuk para blogger yang membuat konten atau artikel untuk berburu dollar harus mengetahui dasar ini karena domain ini tidak support untuk Afliansi google adsense Hosted hanya bisa di gunakan untuk Akun google adsense Non-Hosted namun jangan kuatir untuk itu saya perinci

.

                     Rincian

1. Untuk Afliansi local seperti, klik saya, adsense camp, kumpul blogger atau afliansi lainya domain ini cukup bias untuk menarik visitor karena saya juga pernah menggunakannya dan bias di pasang iklan dari afliansi local.
2. Tidak bisa di gunakan untuk mengupgrade Akun google Hosted ke Non-Hosted kecuali anda menggunakan domain gratis ini di sertai dengan Hosting ada kemungkinan bias untuk Upgrade
3. Domain yang gratis hanya beberapa saja
4. Pengaturan CPanel yang menurut saya tergolong mudah
5. Gratis hanya untuk 1 Tahun
6. Maksimal karakter untuk Domainya pun terbatas hanya 31 Karakter
7. Domain ini sangat cocok untuk media toko online dan para blogger yang membuat artikel untuk pengembangan atau hobby saja

name domain sangat berpengaruh untuk menarik para visitor dan mungkin sedikit ulasan yang bisa saya sampaikan untuk anda semua dan semoga bisa bermanfaat untuk anda

Blogger Template Minima Responsive Free

Template terbaru dengan tema Blogger Template Minima Responsive Free adalah template dengan design yang sangat unik dan memuaskan saat berada di tampilan gadget dengan sangan responsive dan SEO

Download

Template yang sangat responsive ini juga di lengkapi dengan fitur - fitur yang sangat menarik untuk mempercantik para pengunjung blog anda dan diantaranya adalah

• Responsif
• SEO
• Kustom Threaded Comment
• 2 Kolom
• White Base Tema Warna
• Iklan responsif siap
• Tepung Roti
• Tulisan Terkait dengan Thumb
• Kotak Pencarian
• Share Button
• Top Menu Dropdown
• Main Menu Dropdown
• Halaman bernomor Navigasi
• Top Social Bookmark
• Kustom 404 Halaman
• Nah Dokumentasi
• berlangganan Box
• Facebook Komentar
• Komentar Terbaru
• 3 berbeda Sitemap Gaya
• Halus Kembali ke atas Tombol
• Ramping
• Lebih ...

Yups dengan template ini anda tidak akan rugi dan pastinya tidak akan menyesal sudah memakai template ini, template yang sangat di gemari para pengunjung karena tampilannya yang sangat cantik hampir menyerupai sebuah WEB terlebih dengan tambahan fitu - fiturnya tentunya kalian tidak akan jenuh, selamat menikmati

 

Cara Agar Template yang anda pakai semakin ringan dan cepat

Pengen Template Pilihan anda menjadi super Fast atau Template yang anda pakai terasa berat...??

Tentu saja Template yang ringan dan cepat sangatlah menjadi idaman para blogger tentunya demi kenyamanan Visitor blog kita dan maka dari pada itu untuk kesuksesan kita bersama saya juga sharing trik dan tips untuk membuat blog anda fast dan ringan tentunya memakai template idaman anda pun tidak terlalu mengganggu Visitor karena banyak sekali Visitor yang mengeluh saat menjumpai Blog – blog yang lemot gara2 beban templatenya dan kebanyakan dari Visitor lebih memilih untuk batal mengunjungi blog anda dan memilih Blog lain yang lebih nyaman untuk mereka kunjungi.

Yuk Belajar nih caranya Tips dan Triknya silahkan di pakai dan tentunya buat yang Newbie dan belum mengerti edit template Bisa asuk Edit template dan edit HTML terus ikuti langkah berikut ini

1. Cari dengan menekan Ctrl + F dan ganti Kode <b:skin><![CDATA[ dengan memparse Kode tersebut atau bias copy dengan kode di bawah ini

&lt;style type=&quot;text/css&quot;&gt;&lt;!-- /* <b:skin><![CDATA[

 Catatan Kode ini adalah Kode Parse dari Kode bawaan template anda dan tentunya hanya memparse tidak akan merubah tampilan Template Blog anda
dan sebelum anda mengedit template alangkah baiknya anda juga membackup template anda buat jaga - jaga dan kalau udah terlanjur anda bisa melakukan langkah Ctrl + Z di edit template anda agar template editan anda bisa di Undo

Kalau anda ingin belajar sendiri dengan memparse kode yang akan anda rubah silahkan anda bisa memparsenya dengan Tool Parse Di menu Navigasi Template saya


 Template Lola Visitor kabur

2.  Ganti juga Kode </head> dengan memparsenya atau bias dengan kode ini

&lt;!--</head>--&gt;&lt;/body&gt;

3. Ganti juga Kode </body> dengan kode Parsenya atau bias dengan kode di bawah ini

&lt;!--</body>--&gt;&lt;/body&gt;

4. Ganti Backgroud template anda dengan 1 warna jangan dengan gambar

5. Buang Java Script yang tidak terlalu penting

6. Pasang Widget Sesuai yang anda perlukan jangan terlalu banyak menampilkan Widget yang kurang perlu

Silahkan anda coba dan nikmati The Fast Faforit My Template,