Kamis, 01 Desember 2011

Memasang Widget Google Followers

Memasang Widget Google Followers | Tutorial Blog

Tutorial kali ini mungkin bukan hal yang asing bagi para blogger yang sudah lama pakai Blogspot, jadi tutorial ini buat para pemula saja. Google Followers atau Google Friend Connect (GFC) adalah suatu program komunitas sosial seperti BlogCatalog, MyBlogLog, dan lain-lain. Tepatnya, Google Friend Connect merupakan sarana penghubung untuk memudahkan kita berinteraksi satu sama lain. Kita bisa menambah, mengundang, mengunjungi teman-teman kita dengan mengklik fotonya. Dan dari sini pula kita dapat meningkatkan trafik blog kita.
Widget Google Friend Connect dapat memudahkan pengunjung agar bisa dengan mudah menjadi pelanggan artikel. apalagi jika Anda menggunakan blogger, maka setiap artikel yang terbit dari blog yang diikuti ( Di Follow ) akan tampil di dashboard blogspot Anda.
Berikut cara Memasang Widget Google Followers :
  1. Login ke Blogger klik Design/Rancangan > Page Element/Elemen Laman.
    Design Page Element
  2. Klik Add a Gadget/Tambah Gadget.
    Add Gadget
  3. Pilih Followers.
    Widget Followers
  4. Terakhir klik Save.
    Widget Followers
Selesai... Widget Google Followers sudah terpasang di blog Anda.
Selanjutnya postingan saya tentang memasang Widget Followers Google Friend Connect.

Rabu, 30 November 2011

Memasang Widget Search Box

Memasang Widget Search Box | Tutorial Blog

Tutorial kali buat sobat yang masih belum bisa dan ingin memasang widget Kotak Penelusuran (Search Box) di blog. Cara memasangnya tidak menggunakan coding, karena sekarang Blogger sudah menyediakan widget Kotak Penelusuran. Jadi caranya lebih mudah dari Membuat Kotak Pencarian (Search Box).
Berikut cara Membuat Search Box di Blog :
  1. Login ke Akun Blogger milik Anda, pilih Rancangan (Design) > Elemen Laman (Page Elements).
    Design Page Element
  2. Klik Tambah Gadget (Add a Gadget).
    Add Gadget
  3. Pilih Kotak Penelusuran (Search Box).
    Search Box
  4. Pada bagian Judul / Title, isi dengan Cari di Blog Ini atau kata lain yang Anda inginkan. Pada bagian Tab, centang pada Blog ini (This Blog).
    Search Box
  5. Terakhir klik tombol Simpan (Save), dan lihat hasilnya.
    Save Widget
Semoga tutorial ini bisa membantu sobat yang ingin Memasang Search Box di Blog.

Selasa, 29 November 2011

Membuat Kotak Pencarian (Search Box)

Membuat Kotak Pencarian (Search Box) | Tutorial Blog

Tutorial kali ini saya akan berbagi cara Membuat Kotak Pencarian (Search Box).
Berikut caranya :
  • Login ke Dasbor blogger, klik Design (Rancangan) > Edit HTML, Taruh kode ini di atas kode  ]]></b:skin>
    berikut kodenya:
    #search {
    width: 280px;
    font-size: 11px;
    float: right;
    margin: 0;
    padding: 6px 0 0;
    }
    #searchform {
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: inline;
    }
    #searchbox {
    background: #84CAF6;
    width: 220px;
    color: #000;
    margin: 0;
    padding: 4px 0 3px 5px;
    border: 1px solid #005BC3;
    display: inline;
    font: normal 12px Georgia, Times New Roman, Trebuchet MS;
    }
    #searchbutton {
    background: #84CAF6 !important;
    color: #000;
    margin: 0 0 0 5px;
    padding: 3px 3px 2px;
    border: 1px solid #005BC3;
    font: bold 11px Georgia, Times New Roman, Trebuchet MS;
    }
  • Save Template.
  • Sekarang ke Page Element, klik Add a Widget > HTML/Javascript Masukkan kode ini di dalam area content.
  • <div id='search'>
    <form action='/search/' id='searchform' method='get' style='display:inline;'>
    <input id='searchbox' maxlength='200' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Search...&quot;;}' onfocus='if (this.value == &quot;Search...&quot;) {this.value = &quot;&quot;}' type='text' value='Search...'/>
    <input class='btn' type='submit' value='Go'/>
    </form>
    </div>
  • Save dan lihat hasilnya.
Semoga bermanfaat...!

Artikel lainnya :

Senin, 28 November 2011

Membuat Related Post (Artikel Terkait)

Membuat Related Post (Artikel Terkait) | Tutorial Blog

Related post atau Artikel Terkait sangat bermanfaat untuk memberitahu pengunjung tentang artikel yang lain dalam satu label / category pada blog kita.
Berikut cara Membuat Related Post :
  • Login ke Blogger, Klik Design/Rancangan > Edit HTML.
    Membuat Artikel Terkait
  • Beri tanda centang pada Expand Template Widget.
    Membuat Artikel Terkait
    Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
  • Cari kode </head>, lalu Copy kode dibawah ini dan letakkan diatas kode </head>.
    <!--Simple Related Posts Scripts Start-->
    <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 < 5) {
    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>
        <!--Simple Related Posts Scripts and Styles End-->
  • Kemudian silakan Sobat cari kode seperti berikut
    <div class='post-footer-line post-footer-line-1'>
    Lalu letakkan kode berikut dibawah kode tersebut.
    <!-- Simple Related Posts Code Start-->
    <b:if cond='data:blog.pageType == &quot;item&quot;'><div id='related-posts'>
    Related Post on <b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'><script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/>
    </b:if></b:loop>
    <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script></div></b:if>
    <!-- Simple Related Posts Code End-->
  • Terakhir klik Save / Simpan Template.
    Membuat Artikel Terkait
Selamat mencoba dan semoga berhasil Membuat Related Post (Artikel Terkait).

Minggu, 27 November 2011

Membuat Auto Read More

Membuat Auto Read More | Tutorial Blog

Auto Read More adalah opsi yang otomatis memotong artikel Sobat saat di tampilkan pada home page blog Anda. Auto Read More ini dilengkapi dengan pengaturan jumlah karakter, Ada 2 pengaturan jumlah karakter yaitu jumlah karakter Read More tanpa gambar dan jumlah karakter Read More dengan gambar.
Berikut cara membuat auto read more :
  1. Login ke akun Blogger Sobat, klik Design / Rancangan  > Edit HTML.
    Penting!!! Biasakan men-Download / membackup template blog Anda sebelum mengedit template.
  2. Beri tanda centang pada Expand widget template, kemudian letakkan kode berikut ini di atas kode </head> (tekan Ctrl+F untuk mempermudah dalam pencarian kode)
    <script type="text/javascript">
    var thumbnail_mode = &quot;float&quot; ;
    summary_noimg = 250;
    summary_img = 220;
    img_thumb_height = 120;
    img_thumb_width = 220;
    </script>
    <script type="text/javascript">
    //<![CDATA[
    function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf("
    ",a)!=-1){a++}b=b.substring(0,a-1);return b+" [...]"}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>
    "+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
    //]]>
    </script>
    Anda juga dapat merubah kode berikut:
    var thumbnail_mode = "float";
    summary_noimg = 250;
    summary_img = 250;
    img_thumb_height = 120;
    img_thumb_width = 120;
    Ganti angka pada summary_noimg untuk mengatur jumlah karakter yang tampil pada kutipan artikel tanpa gambar.
    Ganti angka pada summary_img untuk mengatur jumlah karakter yang tampil pada kutipan artikel dengan gambar.
    Ganti angka pada img_thumb_height untuk mengatur tinggi gambar yang tampil pada kutipan artikel.
    Ganti angka pada img_thumb_width untuk mengatur lebar gambar yang tampil pada kutipan artikel.
  3. Selanjutnya cari kode <data:post.body> lalu ganti dengan kode ini;
          <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
    <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
    <span class='rmlink' style='float:left'><a expr:href='data:post.url'><b>More about</b> &#8594;</a></span>
    </b:if>
  4. Ganti kata left dengan right untuk menampilkan link readmore di bagian kanan.
    Ganti kata More about dengan kata yang Anda inginkan. Misalnya Read More,Baca Selengkapnya, Selanjutnya atau Seterusnya.
  5. Terakhir klik Pratinjau / Preview untuk melihat hasilnya. Jika Anda rasa sudah sesuai, klik tombol Simpan / Save Template.
Catatan : Jika Sobat menggunakan opsi ini, Artikel pada halaman juga akan terpotong.
Semoga tutorial ini bisa berguna buat sobat yang ingin Membuat Auto Read More.

Sabtu, 26 November 2011

Cara Membuat Schedule / Jadwal Postingan di Wordpress

Cara Membuat Schedule / Jadwal Postingan di Wordpress | Tutorial Blog

Pada postingan kali ini saya akan berbagi cara membuat Jadwal Postingan di WordPress. Jika kita menggunakan opsi ini maka postingan yang kita buat akan dipublish secara otomatis sesuai pengaturan yang kita lakukan. Untuk Blogspot silakan baca Membuat Schedule / Jadwal Postingan Blogspot.

Berikut Cara Membuat Schedule / Jadwal Postingan di Wordpress :
  1. Login ke Dashboard Wordpress Anda, klik Posts > Add New, dan buat sebuah postingan.
    Post Addnew WP
  2. Sebelum di Publish klik Edit yang terletak disamping Publish immediately.
    Schedule Post
  3. Atur tanggal dan jam kapan postingan Sobat ingin dipublish.
    Jadwal Postingan
  4. Terakhir klik tombol Schedule.
    Jadwal Postingan
Semoga tutorial diatas bermanfaat buat sobat yang ingin Membuat Schedule / Jadwal Postingan di Wordpress.

Jumat, 25 November 2011

Cara Membuat Schedule / Jadwal Postingan

Cara Membuat Schedule / Jadwal Postingan | Tutorial Blog

Schedule atau Jadwal dalam memposting artikel memang penting. Dengan jadwal posting yang teratur, berarti kita konsisten, ini menandakan kita rajin dan aktif dalam ngeblog. Tutorial kali untuk blogspot, untuk wordpress.com silakan baca Cara Membuat Schedule / Jadwal Postingan di Wordpress.

Cara ini bisa digunakan buat sobat yang sibuk dan tidak sempat untuk posting artikel setiap harinya, misalkan Anda membuat 4 postingan, akan lebih baik jika Sobat terbitkan satu persatu, daripada Anda terbitkan sekaligus. Blogger akan menyimpan postingan Anda sampai waktu yang telah Anda tetapkan.

Berikut cara Membuat Jadwal Postingan di Blogspot :
  1. Login ke akun Blogger milik Anda, pilih New Post / Entri Baru, dan buat sebuah postingan.
  2. Sebelum diterbitkan klik Post Options.
    Schedule Post
  3. Akan muncul opsi-opsi di bawah Post Editor, pilih Scheduled at / Dijadwalkan pada lalu isi tanggal dan jam sesuai keinginan Anda.
    Jadwal Postingan
  4. Terakhir klik Publish Post / Terbitkan Entri. Maka Postingan tersebut akan diterbitkan sesuai tanggal dan jam yang telah ditentukan.
    Publish Post
Sekian tutorial tentang Cara Membuat Schedule / Jadwal Postingan.

Senin, 21 November 2011

Setting Komentar Tanpa Moderasi

Setting Komentar Tanpa Moderasi | Tutorial Blog

Opsi ini memberikan kita kesempatan untuk melakukan filter pada setiap komentar yang masuk ke blog. maksudnya setiap komentar tidak langsung di tampilkan di blog, tetapi harus melalui persetujuan dari Admin blog untuk bisa di tampilkan atau tidak.
Jika Sobat gak mau ribet, mending ospi ini dimatikan, jadi apabila ada komentar oleh pengunjung bisa langsung tampil di blog tanpa disetujui atau di moderasi terlebih dahulu oleh admin, kecuali untuk komentar SPAM, komentar yang dianggap SPAM tidak akan muncul secara otomatis.
Perlu diingat, semua link yang dikirim oleh pengunjung pada saat komentar juga akan langsung tampil. Baik itu link yang diperbolehkan, maupun link-link yang tidak diperbolehkan, jadi sebelum Sobat menerapkan setting komentar ini, sebaiknya pertimbangkan terlebih dahulu.

Berikut Tutorial Setting Komentar Tanpa Moderasi :
  • Untuk Wordpress
    1. Login ke Wordpress Anda, pada dashboard klik Settings > Discussion.
      Tutorial Blog
    2. Kemudian hapus tanda centang [ √ ] pada An administrator must always approve the comment dan Comment author must have a previously approved comment.
      Tutorial Blog
    3. Lalu klik Save Changes.
      Tutorial Blog
  • Untuk Blogspot
    1. Login ke blogger, klik Settings > Comments.
      Settings Comments
    2. Pada Comment Moderation pilih Never.
      Tutorial Blog
    3. Terakhir klik Save Settings.
      Save Settings
Demikian Postingan saya tentang Setting Komentar Tanpa Moderasi.

Minggu, 20 November 2011

Cara Mengetahui Blog Kena Banned

Cara Mengetahui Blog Kena Banned | Tutorial Blog

Istilah “Banned Google“ pasti tidak asing lagi buat Sobat-sobat yang selama ini bergelut dengan dunia blog dan website. Banned google merupakan sebuah istilah dari tindakan google yang terhadap blog atau website yang dicurigai oleh mesin pencari google melakukan spam atau teknik black hat SEO. Jika Blog Sobat sampai di banned oleh Google berarti website anda dianggap google 100% telah melakukan spam dan isi website anda tidak sesuai dengan apa yang diindex google. akibatnya website anda 100% tidak diindex google. Juga istilah yang ini, “Penalty Google” merupakan sebuah peringatan menuju banned google. Artinya website tersebut tidak 100% spam, hanya direktori yang dianggap spam saja yang dikeluarkan indexnya dari google. misalkan halaman posting anda 100% copy-paste dan melakukan tindakan spam lainnya maka sedikit demi sedikit index single posting anda akan hilang dari index google

Untuk melihat website / blog kita dibanned google atau kena penalty google, caranya mudah, Coba Sobat ketik site:namadomainanda.com di form pencarian Google, jika hasilnya tidak ada itu berarti akun atau blog Sobat terkena banned google, jika berkurang di bandingkan dengan hari-hari sebelumnya, itu berarti akun / blog anda terkena penalty google atau Sobat jarang posting. untuk mengetahui page index blog anda setiap harinya akan lebih mudah jika Sobat menginstal WebRank Toolbar.

Untuk mengetahui sebuah blog atau website terkena banned dan penalty google, Sobat dapat mengikuti cara berikut :
  • Masuk ke www.bannedcheck.com.
  • Ketikkan url blog Sobat dalam form dan klik Submit, anda akan diberi keterangan hasil dari bannedcheck apakah blog Sobat di banned oleh Google atau tidak.
Semoga penjelasan singkat ini bisa bermanfaat buat sobat untuk Mengetahui Blog Kena Banned.