Tampilkan postingan dengan label widget. Tampilkan semua postingan
Tampilkan postingan dengan label widget. Tampilkan semua postingan
Kamis, 28 November 2013
Cara Membuat Widget Popular Post Blogger Menjadi Lebih Menarik
Saya jarang menggunakan tool kecuali saya tahu saya dapat merancang sesuai dengan preferensi saya. Tim Blogger memperkenalkan Widget Popular Post resmi mereka yang bisa menampilkan potongan posting Anda yang dapat dilihat bersama dengan gambar thumbnail berdasarkan statistik Analytics blog Anda. Tapi tunggu! widget kali ini merupakan langkah maju dari itu. Kami akan menimpa stylesheet untuk widget ini sepenuhnya dengan kostum font dan warna. Anda dapat melihat widget Popular Post ini di sidebar blog saya.Keuntungan terbesar dari widget ini adalah bahwa kita tidak perlu menginstal Javascript apapun yang berat karena kita menggunakan widget yang tersimpan pada server Blogger dan kita hanya akan mengubah tampilan untuk membuatnya menyatu sempurna dengan blog Anda.
Saya harap Anda akan mendapatkan tutorial yang cukup menarik kali ini karena saya akan memberikan trik sederhana tentang cara membuat widget popular post menjadi sangat menarik. Jadi mari kita mainkan!
Menambahkan Widget Popular Post ke Blog
- Login dulu ke Blogger > Layout
- Klik Add a gadget dan pilih gadget "Popular Post" dari daftar yang disediakan blogger
- Setinglah seperti gambar di bawah ini! (Ubahlah Most viewed menjadi All time, hilangkan centang pada image thumbnail dan snippet)
- Simpan widget Anda
- Sekarang masuklah ke Template
- Backup dulu template Anda jika perlu
- Klik Edit HTML
- Carilah kode ini
]]></b:skin>
- Kemudian letakkan kode berikut ini di atasnya
/*--- Genera Popular Posts --- */
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8joZV5gHgnMvYmzagJl2w2djrbOaDU0_t9qCZxcu1Hp0Am-WX2uqYEj4vS51-aQhKx2IBivjIt6CICYTPPgOuvJ-ISFuEgjwXwamkd6n0BDiM0Aur7SGjvikESz3cpwriRLvMNCuZZ1bR/s400/33.gif") no-repeat scroll 5px 8px rgb(255, 255, 255);
list-style-type: none;
margin: 0px 0px 5px;
padding: 5px 5px 5px 20px !important;
border: 1px solid #dddddd;
border-radius: 10px 10px 10px 10px;
}
.popular-posts ul li:hover {
border:1px solid #666666;
}
.popular-posts ul li a:hover {
text-decoration:none;
}
Keterangan:
Anda dapat melakukan perubahan untuk menyesuaikan tampilan default dari kode di atas:
- - Untuk mengubah gambar bullet, gantilah link gambar yang bercetak tebal pada kode di atas dengan URL bullet Anda.
- - Untuk mengubah warna perbatasan dalam mode aktif editlah bagian ini #dddddd
- - Untuk mengubah warna perbatasan pada saat ditunjuk mouse edit bagian ini #666666
- - Anda dapat menggunakan Kode Warna CSS milik saya untuk mencari kode warna yang tepat.
- Dan terakhir, simpan Template Anda dan katakanlah bingo!
Kunjungi blog Anda untuk melihat apakah widget popular post sudah terpasang dengan baik pada sidebar blog Anda. Jangan beritahu saya jika Anda membutuhkan bantuan lebih lanjut dalam mengubah jenis font atau warna. Widget akan secara otomatis menggunakan warna standar dari blog Anda, tetapi jika Anda ingin mengubah untuk sesuatu yang berbeda maka jangan ragu untuk membiarkan saya tahu dengan mem-posting komentar Anda di bawah ini. :D
Jika Anda menyukai artikel ini dan ingin berbagi dengan pembaca Anda mengenai tutorial ini maka silahkan cantumkan linkback ke postingan ini. Salam damai kawan.. :)
Minggu, 24 November 2013
Cara Menyembunyikan Widget Pada Artikel Tertentu
Trik Menyembunyikan Widget Pada Artikel Kontes SEO- Menyembunyikan widget-widget tertentu di halaman posting blog sering dilakukan oleh para blogger yang sedang mengikuti kontes SEO. Trik menyembunyikan widget ini merupakan salah satu cara untuk mempercepat loading halaman artikel itu sendiri serta yang terpenting adalah membatasi (baca: mengurangi) link keluar (outbond link) yang terindeks oleh Google pada halaman artikel kontes tersebut. Sehingga dengan cara seperti ini diharapkan dapat memperbaiki posisi SERP artikel tersebut di Google. Namun tips cara menyembunyikan widget ini tidak hanya khusus untuk artikel kontes seo saja, namun intinya dapat digunakan untuk menyembunyikan widget di halaman artikel tertentu di blog sesuai keinginan kita.
Sebelum kita melangkah ke cara menyembunyikan widget, ada baiknya harus kita ketahui dulu seperti apa kode widget yang ada dalam template. Secara umum bentuk kode widget yang ada dalam template adalah seperti ini :
<b:widget id=HTMLx locked=false title=Nama Widget type=HTML><b:includable id=main><!-- only display title if its non-empty --><b:if cond=data:title != ""><h2 class=title><data:title/></h2></b:if><div class=widget-content><data:content/></div><b:include name=quickedit/></b:includable></b:widget>
Pada setiap template kode widget ini kadang-kadang berbeda, namun khusus untuk kode yang saya tandai dengan warna biru biasanya sama. Jadi fokuskan saja perhatian pada kode yang saya tandai dengan warna birudiatas.
Cara Menyembunyikan Widget di Halaman Posting :
1. Misalnya pada halaman artikel 1000 Backlink Supaya Menang Kontes SEO saya ingin menyembunyikan widget Yang Paling Sering Dibaca atau popular post yang ada di sidebar kanan.
2. Login ke dashboard blogger, pilih Rancangan > Edit HTML, centang Expand template widget.
3. Gunakan tombol Ctrl+F untuk mempercepat pencarian dan ketik nama widget yang ingin dicari (dalam contoh ini: widget Yang Paling Sering Dibaca) trus klik Next.
4. Kode widget yang akan disembunyikan misalnya seperti ini :
<b:widget id=PopularPosts1 locked=false title=Yang Paling Sering Dibaca type=PopularPosts>
<b:includable id=main>
<b:if cond=data:title><h2><data:title/></h2></b:if>
<div class=widget-content popular-posts>
.............bla bla bla.............
<b:include name=quickedit/>
</div>
</b:includable>
</b:widget>
5. Untuk menyembunyikan widget tambahkanlah kode <b:if cond=data:blog.url != "Your_URL_Here"> tepat dibawah kode <b:includable id=main>, masukan link URL postingan pada Your_URL_Here. Serta tambahkan juga kode penutup </b:if> tepat dibawah kode </div>. Sehingga kode lengkap dari dari widget yang akan disembunyikan tadi menjadi seperti ini :
<b:widget id=PopularPosts1 locked=false title=Yang Paling Sering Dibaca type=PopularPosts>
<b:includable id=main>
<b:if cond=data:blog.url != "http://rayhanzhampiet.blogspot.com/2011/08/1000-backlink-supaya-menang-kontes-seo.html">
<b:if cond=data:title><h2><data:title/></h2></b:if>
<div class=widget-content popular-posts>
.............bla bla bla.............
<b:include name=quickedit/>
</div>
</b:if>
</b:includable>
</b:widget>
6. Simpan / Save template anda, dan cobalah buka link halaman artikel 1000 Backlink ini maka anda tidak akan melihat lagi widget Yang Paling Sering Dibaca yang sudah saya sembunyikan.
7. Mission Complete, trik menyembunyikan widget ini BERHASIL !
So buat sobat yang lagi ikutan kontes SEO, semoga trik cara menyembunyikan widget pada artikel tertentu ini bisa sedikit membantu optimasi seo on page yang sedang sobat lakukan. Sehingga artikelnya bisa mendapatkan posisi SERP terbaik di halaman 1 Google. Salam Blogger.
Langganan:
Postingan (Atom)