Memasang Tombol Share Dibawah Postingan

Memasang Tombol Share Dibawah Postingan | Tutorial Blog

Tombol share, seperti gambar dibawah ini :

berguna untuk memudahkan pengunjung blog yang ingin membagikan artikel yang telah dibacanya ke jaringan mereka, seperti Facebook Like, Twitter Tweet, Google +1, dan lain-lain.

Berikut Cara Memasang Tombol Share Dibawah Postingan :

1. Login ke Blogger, Klik Design/Rancangan > Edit HTML.
   
2. Beri tanda centang pada Expand Template Widget.
   
   Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
3. Cari kode <data:post.body/>, Tekan Ctrl + F pada keyboard untuk menggunakan fasilitas pencarian browser, lalu ketikkan kode yang dicari, pilih kode <data:post.body/> yang nomor dua.
4. Jika sudah ketemu Copy script di bawah ini dan paste di dibawah kode <data:post.body/> yang ke dua.
   <!-- AddThis Button BEGIN -->

   <div class="addthis_toolbox addthis_default_style ">

   <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>

   <a class="addthis_button_tweet"></a>

   <a class="addthis_button_google_plusone" g:plusone:size="medium"></a>

   <a class="addthis_counter addthis_pill_style"></a>

   </div>

   <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e8062ca66617053"></script>

   <!-- AddThis Button END -->
5. Terakhir klik SIMPAN / SAVE TEMPLATE.
   

Sekian Tutorial tentang Memasang Tombol Share Dibawah Postingan.

Artikel lainnya :

• Membuat Tombol Share Post Melayang
• Widget Google Followers Show Hide 
• Membuat Daftar Isi Blog

Cara Mencari Keyword Populer

Cara Mencari Keyword Populer | Tutorial Blog

Buat Sobat yang sudah lama di dunia blogging pastinya tahu betul apa fungsi keyword. Akan lebih baik jika kita menggunakan keyword yang lagi booming atau populer saat ini, karena dengan menggunakan keyword yang lagi populer maka pengunjung kita dari search engine akan meningkat, tentu saja harus di sertai isi konten yang bagus dan penerapan seo on page. Karena itu pula kita perlu mencari tahu Keyword yang lagi populer saat ini.

Dibawah ini beberapa situs yang dapat Anda gunakan untuk mencari keyword yang lagi populer :

• Adwords.
  Tempat ini untuk mencari keyword abadi dan sangat saya sarankan buat anda yang ingin cari traffik abadi lewat search engine google.
  keyword populer by google adwords
• Google Insight.
  Situs ini untuk mencari keyword musiman lewat google insight dimana kita akan tahu keyword yang sering diketikkan orang 7 hari terakhir, sebulan terakhir ataupun setahun terakhir.
  keyword populer by google insight
• News Google
  Situs satu ini untuk mencari keyword topik beberapa hari terakhir yang meledak dan sangat booming.
  keyword populer by google news
• Berita populer di yahoo indonesia
  Nie tempat buat anda cari keyword populer lewat yahoo indonesia.
  keyword populer yahoo indonesia
• Alexa
  Untuk mencari keyword populer yang ada di alexa secara realtime setiap detik update silakan kunjungi :
  keyword populer by alexa
  berlaku untuk keyword bahasa inggris.
• News Feedjit
  Tempat ini buat mencari keyword populer yang ada di feedjit secara realtime update setiap detik.
  keyword populer by feedjit
• Twitter
  Buat mencari keyword populer di twitter yang jadi trending topik di twitter. silakan kunjungi halaman :
  keyword populer by twitter.

Semoga bermanfaat...

Menyembunyikan Widget di HomePage

Menyembunyikan Widget di HomePage | Tutorial Blog

Trik yang satu ini berguna untuk memperingan loading blog pada HomePage, dengan menyembunyikan widget yang tidak perlu di tampilkan, otomatis loading blog waktu menampilkan homepage akan lebih cepat. Widget tersebut akan di tampilkan pada halaman dan postingan.

Berikut cara Menyembunyikan Widget di HomePage :

• Login ke Blogger, Klik Design/Rancangan > Edit HTML.
  
• Beri tanda centang pada Expand Template Widget.
  
  Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
• Cari kode Widget yang ingin Anda sembunyikan, sebagai contoh saya gunakan kode Free Backlink yang terletak di HTML3.
  
• Letakkan kode dibawah ini di antara kode widget tersebut.
      <b:if cond='data:blog.homepageUrl != data:blog.url'>
      Kode Widget Yang Mau DiSembunyikan
      </b:if>
  Misal :
  <b:widget id='HTML3' locked='false' title='Free Backlink' type='HTML'>
  <b:includable id='main'>
  <!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'><h2 class='title'><data:title/></h2></b:if> <div class='widget-content'><data:content/></div></b:includable>
  </b:widget>
  Jadinya seperti ini :
  <b:widget id='HTML3' locked='false' title='Free Backlink' type='HTML'>
  <b:includable id='main'>
      <b:if cond='data:blog.homepageUrl != data:blog.url'>
  <!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'><h2 class='title'><data:title/></h2></b:if> <div class='widget-content'><data:content/></div>
      </b:if>
  </b:includable>
  </b:widget> 
• Terakhir klik Save / Simpan Template.
  

Selain cara di atas untuk memperingan Loading blog sobat juga dapat melakukan Compress CSS, Mengkompress Image, dll.

Semoga Bermanfaat...

Membuat Link Berbintang-Bintang

Membuat Link Berbintang-Bintang | Tutorial Blog

Kali ini saya akan berbagi tentang salah satu cara untuk mempercantik blog, yaitu Membuat Link Berbintang-Bintang saat di sentuh cursor. Cara lainnya sobat dapat Membuat Efek Bintang Pada Kursor, Membuat Tombol Share Post Melayang, memasang Widget Google Followers Show Hide, dll.

Berikut Cara Membuat Link Berbintang-Bintang :

1. Login ke Blogger, Klik Design/Rancangan > Edit HTML.
   
2. Beri tanda centang pada Expand Template Widget.
   
   Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
3. Cari kode :
   a:hover {
   color:#0000ff;
   text-decoration:underline; 
   }
   Akan lebih mudah jika Anda mencari a:hover saja.
4. Jika sudah ketemu ganti kode yang berwarna merah dengan kode di bawah ini.
   { background-image: url(http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/dip.gif);}
5. Terakhir klik SIMPAN / SAVE TEMPLATE.
   

Sekian Tutorial tentang Membuat Link Berbintang-Bintang.

Memasang Widget Google Plus Button

Memasang Widget Google Plus Button | Tutorial Blog

Berikut cara Memasang Widget Google Plus :

1. Masuk ke http://www.google.com/webmasters/+1/button/
2. Atur ukuran tombol Google Plus.
   
3. Copy kode yang diberikan.
   
4. Selanjutnya Login ke blogger, Lalu Klik Design / Rancangan.
   
5. Klik Add a gadget / tambah gadget.
   
6. Pilih Menu HTML/Java Script.
   
7. Lalu letakkan Kode Google Plus sobat pada area konten widget.
8. Terakhir klik Save.
   
   Selesai...

Untuk memasang tombol Google Plus pada setiap postingan silakan baca Memasang Tombol Google Plus di Pojok Postingan.

Semoga Bermanfaat...

Membuat Efek Bintang Pada Kursor

Membuat Efek Bintang Pada Kursor | Tutorial Blog

Untuk mempercantik blog, mungkin Anda bisa menggunakan effect bintang berjatuhan pada cursor, trik yang satu ini akan membuat bintang berjatuhan dari cursor saat cursor digerakkan, walaupun menurut saya itu hanya tanda [+] yang berjatuhan. hehe...

Untuk membuat efek bintang berjatuhan pada blog sobat dapat memasangnya pada widget HTML/JavaScript blog sobat, atau melalui menu Edit HTML.

• Melalui widget HTML/JavaScript

1. Login Ke Blogger. Pilih Design/Rancangan > Page Element.
2. Klik Add a Gadget / Tambah Gadget. Pilih HTML/JavaScript.
3. Masukkan kode berikut ke dalam area konten.
   <script src='http://wadah-tutorial.googlecode.com/files/red_star.js' type='text/javascript'/></script>
   Warna bintang diatas berwarna merah. Anda dapat menggantinya dengan warna lain.
   Berikut beberapa kode yang lain :
   <script src='http://wadah-tutorial.googlecode.com/files/yellow_star.js' type='text/javascript'/></script>   *Warna Kuning

   <script src='http://wadah-tutorial.googlecode.com/files/green_star.js' type='text/javascript'/></script>   *Warna Hijau

   <script src='http://wadah-tutorial.googlecode.com/files/blue_star.js' type='text/javascript'/></script>   *Wana Biru
4. Terakhir klik Simpan / Save.

• Melalui menu Edit HTML

1. Login Ke Blogger. Pilih Design/Rancangan > Edit HTML.
2. Beri centang pada Expand Widget Templates.
3. Cari kode ]]></b:skin>
4. Kemudian copy kode diatas dan taruh dibawah kode ]]></b:skin>
   penting : hapus tanda </script> pada kode tersebut.
5. Terakhir Save / Simpan Template.

Silakan dicoba dan semoga berhasil Membuat Efek Bintang Pada Kursor.

Mengganti Next-Prev Navigasi Dengan Judul Post

Mengganti Next-Prev Navigasi Dengan Judul Post | Tutorial Blog

Sebelumnya saya pernah posting tentang Mengganti Navigasi Next-Prev dengan Image. Untuk kali ini saya akan berbagi cara Mengganti Next-Prev Navigasi Dengan Judul Post.

Navigasi next-prev yang menggunakan judul post cukup memancing para pembaca dan pengunjung blog untuk melihat artikel sebelum dan sesudah dari post yang sedang dibaca, karena yang tampil adalah judul artikelnya. Trik ini belum terbukti dapat mengoptimalkan seo, namun secara logika trik ini cukup berhubungan dengan seo karena jika kita ganti next-previous dengan judul post sesudah dan sebelumnya, mungkin ada pengunjung yang tertarik untuk membaca dan mengklik judul tersebut, otomatis jumlah pageviews akan bertambah.

Berikut cara Mengganti Next-Prev Navigasi Dengan Judul Post :

1. Login ke blogger, pilih Rancangan/Design, kemudian pilih Edit HTML, lalu beri centang expand template widget.
   Tips : Biasakan membackup / mendownload template anda terlebih dulu sebelum meng-edit template.
2. Cari kode berikut ini dibawah kode ]]></b:skin>
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript">

   </script>
   Ket : Jika belum ada Copy kode tersebut dan paste dibawah kode ]]></b:skin>
3. Save template Anda
4. Selanjutnya pilih Elemen Laman / Page Element, klik Tambah Gadget / Add a Gadget dan pilih HTML/Javascript, lalu letakan kode dibawah ini pada area konten widget.
   <style type="text/css">

   #blog-pager-newer-link {width:200px;text-align:left;}

   #blog-pager-older-link {width:200px;text-align:right;}

   </style>

   <script type="text/javascript">

   $(document).ready(function(){

   var newerLink = $("a.blog-pager-newer-link").attr("href");

   $("a.blog-pager-newer-link").load(newerLink+" .post-title:first", function() {

   var newerLinkTitle = $("a.blog-pager-newer-link").text();

   $("a.blog-pager-newer-link").text("<< " + newerLinkTitle);

   });

   var olderLink = $("a.blog-pager-older-link").attr("href");

   $("a.blog-pager-older-link").load(olderLink+" .post-title:first", function() {

   var olderLinkTitle = $("a.blog-pager-older-link").text();

   $("a.blog-pager-older-link").text(olderLinkTitle + " >>");//rgt

   });

   });

   </script>
5. Klik Save dan lihat navigasi pager blog Sobat.

Sekian trik untuk Mengganti Next-Prev Navigasi Dengan Judul Post.