Mengatur Baris Followers Pada Blog

Mengatur Tampilan Baris Followers Blog, Waduh bingung juga ya mau mencari judul yang tepat untuk postingan kali ini, maksudnya adalah mengganti dan mengatur tampilan followers blog dan mengatur baris untuk tampilan followersnya, secara default atau standarnya bloggger menampilkan widget followers dengan 4 baris(seperti yang sudah pernah saya pasang sebelumnya), jujur saja saya kurang nyaman dengan tampilan 4 baris ini karena saya nilai terlalu banyak untuk di tampilkan di sidebar blog yang sedikit agak sempit,dan yang paling penting jika kita mengubah tampilannya dengan hanya dua baris saja maka akan sedikit meringankan loading dan berat blog,

sudah bolak balik mencari referensi di dunia perblogan bagaimana Mengatur Tampilan Baris Followers Blog menjadi 2 baris anggota akhirnya saya menemukan caranya bagaimana untuk mengatur tampilan followers dengan tampilan followers 2 baris saja, dengan mengturnya menggunakan Google Friend Connect

Langsung saja saya akan coba sharing dengan teman blogger yang ingin mengubah tampilan followers hanya 2 baris saja atau kurang dari 4 baris untuk menghemat tempat, berat blog dan tentu saja untuk mempercepat loading blog kita;

Berikut langkah cara Mengatur Tampilan Baris Followers Blog.

1. Silahkan tuju situs http://www.google.com/friendconnect/
2. Klick Tombol Ayo Mulai atau Get Started dan masuk dengan Email untuk account blog anda
3. pilih blog yang akan di ubah tampilan followersnya dibagian kiri windows dan pilih Tambah Gadget Anggota.
4. Silahkan atur Lebar Widget dan Sederet Wajah untuk mengatur baris, pilih warna yang sesuai dengan template anda,
5. Klick Tombol Buat Kode HTML serta Salin dan tempel kode ke situs web/blog tempat gadget ingin anda pasang/munculkan.

Setelah kode HTML sudah Anda dapatkan, sekarang tinggal tempatkan code tersebut pada elemen halaman baru atau gadget di blog Anda, caranya sama seperti memasang widget hiden shoutbox, memasang widget jam, widget kalender atau yang lainya ;

• dari Dasbor==> Tata Letak ==> Tambah Gadget ==> HTML/javaScript
• copy code HTML yang sudah di dapatkan tadi dan
• Simpan

Sekarang silahkan lihat hasilnya, apakah sudah berubah tampilan Followers Anda setelah melakukan langkah mengatur tampilan baris Followers Blog dengan Friend Connect, jika Anda punya cara lain silahkan disharing pada kolom komentar ya.

Bagi Anda yang sudah memasang Followers melalui gadget dasar Pengikut melaului widget standarnya (dengan 4 baris), silahkan hapus widget tersebut dan diganti dengan widget Followers melalui kode HTML dari Google friend Connect.

cara ini lumayan mengurangi ukuran dan berat blog yang kita harapkan bisa meringankan loading time blog kita.

Read more ...

Manfaat Seorang Blogger

Sudah taukah Anda, arti dari Blogger? mungkin sebagian ada yang sudah tau dan juga pasti sebagian ada yang belum tau. Arti dari sebutan Blogger adalah Seseorang yang memiliki sebuah Blog dan sekaligus yang mengelolanya.
Tujuan Seorang Blogger juga masing-masing pasti berbeda, tergantung dari setiap orangnya misalnya: Hanya sekedar Hobbi, Mencari Penghasilan atau mungkin hanya sekedar iseng saja. Membuat sebuah Blog memang mudah, akan tetapi sangat sulit untuk mengelola blog tersebut, bisa berminggu-minggu, berbulan-bulan, bahkan bisa memakan waktu bertahun-tahun, untuk menjadikan Blog tersebut bisa dikenal oleh orang banyak. Karena bergulat dengan Blog itu terkadang bisa terasa bosan, tetapi sebenarnya banyak sekali manfaat menjadi seorang Blogger, diantaranya adalah sebagai berikut:

1. Suka Membaca
   mungkin karena kita menjadi blogger,terkadang kita juga mencari artikel-artikel yang menarik dan unik untuk dijadikan sebuah referensi.
2. Berwawasan Luas
   selain dijadikan referensi,setelah kita membaca, kita juga mendapat banyak ilmu yang bermanfaat, dan bisa berbagi ilmu dengan teman kita.
3. Kreatif
   ketika kita akan membuat posting, pasti banyak sekali yang kita pikirkan untuk dijadikan artikel, disitulah kita bisa belajar membuat ide-ide baru dan kalimat-kalimat yang bisa bermanfaat bagi banyak orang.
4. Gaul
   gaul adalah seseorang yang mudah mencari teman dan mengetahui informasi terbaru, termasuk kita para blogger, kita mudah mencari teman seperti melalui forum blogger dan berkomentar di blog orang lain, dari situlah kita mendapatkan banyak teman dan bisa berkenalan.

Read more ...

Cara Membuat Artikel Terkait di Sidebar

Postingan tentang artikel terkait (related post) ini sudah sering yang  membahas, tepatnya diblog ini, dan di blog-blog lain. Namun sayangnya postingan tersebut tidak ada yang membahas cara menampilkan artikel terkait di sidebar.
Pengunjung akan disuguhkan artikel terkait milik Anda di sebelah postingan atau di sidebar, bukan dibawah postingan yang selama ini kita lihat.
Sebenarnya artikel terkait ini bisa juga diletakkan dibawah postingan, tapi saya tidak akan membahasnya karena sudah pernah saya bahas di postingan saya yang lalu.







Baiklah, sekarang ikuti langkah-langkahnya dibawah ini :

Langkah I

1. Seperti biasa login dulu ke blogger.
   
2. Masuk ke Elemen Halaman.
   
3. Kemudian Tuju Edit HTML.
   
4. Klik Expand Template Widget.
   
5. Letakkan kode berikut ini sebelum kode </head>
   

   <script type="text/javascript">
   //<![CDATA[
   var relatedTitles = new Array();
   var relatedTitlesNum = 0;
   var relatedUrls = new Array();
   function related_results_labels(json) {
   for (var i = 0; i < json.feed.entry.length; i++) {
   var entry = json.feed.entry[i];
   relatedTitles[relatedTitlesNum] = entry.title.$t;
   for (var k = 0; k < entry.link.length; k++) {
     if (entry.link[k].rel == 'alternate') {
      relatedUrls[relatedTitlesNum] = entry.link[k].href;
      relatedTitlesNum++;
      break;
     }
   }
   }
   }
   function removeRelatedDuplicates() {
   var tmp = new Array(0);
   var tmp2 = new Array(0);
   for(var i = 0; i < relatedUrls.length; i++) {
     if(!contains(tmp, relatedUrls[i])) {
      tmp.length += 1;
      tmp[tmp.length - 1] = relatedUrls[i];
      tmp2.length += 1;
      tmp2[tmp2.length - 1] = relatedTitles[i];
     }
   }
   relatedTitles = tmp2;
   relatedUrls = tmp;
   }
   function contains(a, e) {
   for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
   return false;
   }
   function printRelatedLabels() {
   var r = Math.floor((relatedTitles.length - 1) * Math.random());
   var i = 0;
   document.write('<ul>');
   while (i < relatedTitles.length && i < 20) {
     document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
     if (r < relatedTitles.length - 1) {
      r++;
     } else {
      r = 0;
     }
     i++;
   }
   document.write('</ul>');
   }
   //]]>
   </script>

   
   
6. Kemudian cari kode seperti dibawah ini :
   

   <b:if cond='data:post.labels'>
   <data:postLabelsLabel/>
   <b:loop values='data:post.labels' var='label'>
   <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
   </b:loop>
   </b:if>

   
   
7. Lalu sisipkan kode yang berwarna Merah, sehingga hasilnya menjadi seperti berikut :
   

   <b:if cond='data:post.labels'>
   <data:postLabelsLabel/>
   <b:loop values='data:post.labels' var='label'>
   <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
   <b:if cond='data:blog.pageType == "item"'>
   <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
   </b:if> </b:loop>
   </b:if>

   
   
8. Simpan Template, sampai disini proses Edit HTML sudah selesai.
   
9. Sekarang Anda tuju Tata Letak, kemudian klik Tambah Gadget pada sidebar milik Anda.
   
10. Pilih yang HTML/Javascript, kemudian masukkan kode berikut :
    

    <script type="text/javascript">
    removeRelatedDuplicates();
    printRelatedLabels();
    </script>

    
    
11. Jangan lupa beri judul, lalu klik Simpan.

Sampai disitu sudah selesai pembuatan artikel terkait di sidebar. Namun artikel terkait akan selalu muncul di halaman depan blog / Homepage, untuk membuat artikel terkait hanya muncul pada halaman postingan saja, maka sobat harus mengubah beberapa kode lagi.Nah sekarang ikuti langkah keduanya dibawah ini :


Langkah II

1. Klik Edit HTML.
   
2. Klik Expand Template Widget.
   
3. Cari kode yang seperti dibawah ini,Selanjutnya tugas Anda hanya cukup untuk mengambil kode yang berwarna merah !

   <b:widget id='HTML7' locked='false' title='Artikel Terkait Lainnya' type='HTML'>
   <b:includable id='main'>
   <!-- only display title if it's 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>

   
   
4. Kemudian Anda cari kode yang seperti ini ]]></b:skin>  
5. selanjutnya paste kode dibawah ini tepat di bawah kode ]]></b:skin>  
   
   

   <b:if cond='data:blog.pageType != &quot;item&quot;'>

   <style>

   #HTML7{display:none;}

   </style>

   </b:if>

Untuk tulisan HTML 7 dan Artikel Terkait Lainnya, hanya mengambil dari template saya, silahkan Anda sesuaikan dengan template dan judul artikel terkait yang tadi sudah Anda buat.

Sebenarnya cara ini mudah untuk dipraktekan ! yang bilang susah berarti orang yang malas berpikir !

Selamat mencoba ! Happy Blogging...

Read more ...

Cara ganti kursor blog termudah

 Cursor merupakan anak panah / penunjuk pada komputer , web dan lainya yang berfungsi untuk melakukan perintah dari mouse. kali ini kita akan membahas cara mengganti kursor blog.

langsung saja mari kita ikuti step demi step tutorial ini

1.Loggin blog
2.Masuk ke rancangan
3.Pilih tata letak
4.Tambah Gadget / Widget
5.Pilih HTML/Javascript
6. Copy pastekan code dibawah ini

<style type="text/css">
body{cursor: url("http://i186.photobucket.com/albums/x100/amoebios_4m/nexuiz_default_cursor_1c.png"), auto;}
</style>

Kode yang berwarna biru adalah link gambar kursor, bisa diganti dengan link dibawah atau upload gambar kursor atau cari link gambar kursor tersebut.

 

http://i1200.photobucket.com/albums/bb321/aNyA_zdej28/FBML%20Vocaloid/C-GUMI.png

http://i186.photobucket.com/albums/x100/amoebios_4m/nexuiz_default_cursor_1c.png

http://i44.photobucket.com/albums/f13/LONG65/Element2.gif

http://i1013.photobucket.com/albums/af252/oneuglycoffin/PhotoshopEdits/cuppycakecursor.png

Read more ...