Showing posts with label teknik blog. Show all posts
Showing posts with label teknik blog. Show all posts

Wednesday, October 12, 2011

Buat Form Kontak Di Blog

Dalam menjalankan aktifitas blogging, kita pasti tidak akan pernah lepas dari interaksi dengan para pengunjung blog kita. Biasanya interaksi ini muncul ketika ada pembaca blog milik kita yang menanyakan mengenai isi konten yang kita publikasikan. Entah sekadar bertanya untuk mulai berkenalan, belum jelas, hingga menambahkan materi yang dirasa perlu dilengkapi.

Bagi penanya yang bisa diakomodir lewat kotak komentar bukan menjadi masalah. Tapi, bagaimana jika penanya tersebut ingin berkomunikasi lebih jauh dengan kita? Tentunya kita harus menyediakan form kontak beserta alamat kontak kita semisal email dan no.telp yang bisa dihubungi.

Untuk menghadapi masalah tersebut, kita dapat menyediakan form kontak yang bisa dijadikan tempat bagi para penanya untuk bisa melakukan kontak lebih jauh dengan kita. Manfaat lainnya adalah dengan form kontak ini akan membuat blog kita terkesan lebih profesional.

Cara membuat form kontak di blog ini adalah sebagai berikut:

Pertama, kunjungi situs kontactr.


Lakukan proses signup/registrasi dengan mengisi semua informasi yang dibutuhkan. Ingat, pada tahap ini isi dengan alamat email yang akan menjadi tujuan saat ada orang mengirimkan pesan kepada kita lewat form kontak kita nantinya.


Setelah selasai, maka kita akan dikirimi link aktifavasi akun kontactr ke dalam alamat email kita. Buka email dan klik link tersebut untuk proses aktivasi.


Setelah akun aktif, maka kita harus log in terlebih dahulu. Isi dengan username dan password kita tadi.


Pada tahap selanjutnya, kita akan dibawa pada halaman yang menyediakan kode untuk memunculkan form. Ada dua pilihan. Gunakan kode AJAX Widget jika ingin menampilkan form kontak dalam halaman posting. Dan gunakan kode Buttons jika ingin menampilkan tombol untuk memunculkan form kontak dan tombol tersebut diletakan pada sidebar blog kita.


Salin dan tempelkan kode tersebut dalam blog kita. Selesai.

Sekarang blog kita telah memiliki form kontak yang cukup elegan bukan?
Contoh dari form kontak ini dapat dilihat pada halaman Contact Us di blog ini.

Ada yang belum paham?
Salam blogger!

Friday, August 12, 2011

Cara Merubah Bentuk Kursor Pada Blog

Meski bukan menjadi perhatian utama, merubah bentuk kursor komputer yang tampil dalam blog kita bisa menjadi hal yang menyenangkan. Selain mendapatkan kepuasan dari modifikasi, merubah kursor pada blog juga akan memberikan kesan yang berbeda bagi pengunjung blog kita. Paling tidak, mereka akan terkesan dengan bentuk kursor yang tampil beda daripada bentuk kursor yang biasa mereka temui.


Bentuk standar dari sebuah kursor adalah tanda panah. Kita dapat mengubahnya menjadi berbagai bentuk menarik sesuai dengan selera kita pada beberapa situs penyedia kursor ini.

Bagaimana cara mengubahnya?

Pertama, masuk ke dalam akun blogger kita masing-masing.
Kemudian klik fitur rancangan.
Klik add gadget.
Pilih HTML/JavaScript.
Masukan kode di bawah ini.

<style type="text/css">body, a, a:hover {cursor: url(alamat kursor), progress;}</style>

Misalnya,

<style type="text/css">body, a, a:hover {cursor: url(http://cur.cursors-4u.net/smilies/smi-3/smi203.cur), progress;}</style>

Klik simpan dan selesai.

Mengubah bentuk kursor pada blog itu sangat mudah bukan?
Dengan mengubah bentuk kursor, maka blog kita akan tampil beda dan lebih stylis dibandingkan blog yang lainnya.
Jika ada tanggapan silakan sampaikan lewat kotak komentar ya kawan.
Salam blogger!

Saturday, July 30, 2011

Cara Buat Label Blog Menjadi Dua Kolom

Secara default, tampilan label sebuah blog akan muncul dalam satu kolom. Tampilan ini kadang dirasa oleh sebagian blogger menyita terlalu banyak ruang dan kurang efisien. Karena masih ada ruang kosong di sebelah keterangan label tersebut yang tidak digunakan. Sebagai ilustrasi, coba lihat ruang kosong bertanda kotak merah yang terbuang percuma.


Bagaimana untuk mengatasi hal itu?
Kita dapat menggunakan cara membuat label blog menjadi dua kolom agar hemat tempat. Selain menghemat ruang, cara ini juga akan membuat tampilan label terlihat lebih modis karena berbeda dengan tampilan label yang biasanya kita jumpai di blog lainnya.

Cara untuk membuatnya adalah sebagai berikut :

Langkah 1.

Pastikan jika kita sudah memasang widget label blog dalam sidebar blog kita.
Setelah itu, pilih tampilan daftar, jangan cloud.

Langkah 2.

Pertama, masuk ke dalam akun blogger kita.
Klik fitur rancangan.
Klik edit HTML.
Contreng Expand Template Widget.
Cari kode berikut ini.

]]></b:skin>

Setelah itu, masukan kode berikut tepat di atas kode yang sudah kita cari di atas.

#Label1 li {float:left;width:45%;}

Klik simpan dan selesai.


Keterangan :

  1. Sebelum melakukan editing template blog, pastikan jika kita telah mendownload template blog kita sebelumnya sebagai langkah antisipasi jika ada kegagalan saat proses editing berlangsung.
  2. Gunakan tombol Ctrl+F untuk mempercepat proses pencarian kode HTML yang ingin kita temukan.
  3. Ganti angka 45% pada #Label1 li {float:left;width:45%;} untuk mengubah lebar kolom label blog kita sesuai selera.


Membuat tampilan label blog menjadi dua kolom ternyata mudah bukan?
Sekarang coba lihat bagaimana hasilnya setelah kita praktikan, bagus bukan?
Jika ada pertanyaan silakan sampaikan lewat kotak komentar ya kawan.
Salam blogger!

Friday, July 22, 2011

Cara Buat Address Bar Berjalan

Saat kita mengunjungi sebuah blog, kadang kita terpana dengan penampilan address bar yang bisa berjalan. Address bar yang berjalan ini membuat kebanyakan blogger terpaku untuk melihatnya. Selain terlihat unik dan menarik, adress bar yang berjalan juga mampu menampilkan kata atau kalimat yang panjang dalam address bar tersebut.



Cara untuk membuat address bar berjalan adalah sebagai berikut :

Pertama, masuk ke dalam akun blogger kita masing-masing.
Klik fitur rancangan.
Klik edit HTML.
Klik/contreng expand widget template.
Cari kode berikut.

</head>

Masukan kode berikut di atas kode </head>.

<SCRIPT language='JavaScript'>
var txt="tulisan pada address bar";
var kecepatan=170;var segarkan=null;function bergerak() { document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
</SCRIPT>

Klik simpan dan selesai.

Keterangan:

  1. Sebelum melakukan editing kode HTML pada template, download template blog kita terlebih dahulu sebagai langkah antisipasi jika proses editing kita mengalami kegagalan.
  2. Gunakan tombol Ctrl + F pada keyboard untuk mempercepat proses pencarian kode yang berada pada template blog kita.
  3. Ganti tulisan pada address bar dengan tulisan yang kita inginkan.


Sekarang saat kita membuka blog kita, maka address barnya akan berjalan sendiri dengan otomatis. Menarik bukan?
Ada yang ingin menambahkan?
Jika ada yang ingin menanggapi silakan sampaikan lewat kotak komentar ya kawan.
Salam blogger!

Thursday, July 21, 2011

Cara Menghilangkan Klik Kanan Pada Mouse

Kegiatan blogging saat ini sangat rentan dengan aksi pembajakan melalui copy paste. Blogger yang menjalankan kegiatan bloggingnya semata untuk mencapai popularitas yang tinggi secara instan kerap kali melakukan aktifitas. Tentu tindakan copy paste konten milik blog lain ini sangat merugikan bukan? Salah-salah, blog kita yang dibajak maupun blog lain yang membajak bisa dibanned Google karena memiliki konten duplikat/sama.


Hal lain yang cukup menjengkelkan dari aksi asal copy paste ini adalah kebanyakan blogger yang membajak konten tidak mencantumkan link sumber konten tersebut berasal.

Sebagai blogger yang baik dan berkualitas, kita hendaknya berusaha untuk budayakan anti copas pada postingan blog. Hal ini menjadi sangat penting mengingat tujuan kita menjalani blogging adalah untuk berekspresi dan berbagi, bukan untuk mencuri dan mencari keuntungan materi semata. Betul?

Melakukan aksi copy paste merupakan tindakan yang diperbolehkan, tetapi dalam batas kewajaran tentunya. Kita dapat menyalin konten miliki blog orang lain sebagai pelengkap atau karena kita memang suka dengan konten tersebut. Akan tetapi, ingat jika kita harus menunjukan etika blogging yang baik dengan mencantumkan link sumber konten tersebut berasal.

Nah, untuk mencegah tindakan copy paste konten blog yang tidak terbendung, kita dapat melakukan cara mencegah copas postingan blog dengan menonaktifkan fungsi blok pada mouse. Selain itu, kita juga dapat menghilangkan fungsi klik kanan pada mouse agar artikel dalam blog kita tetap aman dari aksi copy paste.

Bagaimana Cara Menghilangkan Klik Kanan Pada Mouse?

Pertama masuk ke dalam akun blogger kita masing-masing.
Klik fitur rancangan.
Klik tambah gadget.
Pilih HTML/JavaScript.
Masukan script berikut ini.

<script>
var message="peringatan";
///////////////////////////////////
function clickIE4(){if (event.button==2){alert(message);return false;}}
function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(message);return false;}}}
if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;}
else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;}
document.oncontextmenu=new Function("alert(message);return false")
</script>

Klik simpan dan selesai.

Keterangan :

  • Ganti peringatan dengan tulisan sesuai selera.


Sekarang blog kita sudah selangkah lebih aman dari aksi copy paste dengan perlindungan menonaktifkan fungsi klik kanan pada mouse.

Ada yang ingin menambahkan?
Jika ada yang ingin menanggapi silakan disampaikan lewat kotak komentar ya kawan.
Salam blogger!

Sunday, July 17, 2011

Cara Buat Random Post Di Blog Versi III

Pada pembahasan sebelumnya kita sudah pernah belajar bersama bagaimana cara buat random post di blog dan cara buat random post di blog versi II. Nah, pada kesempatan kali ini kita juga akan membahas mengenai tema yang sama, tetapi dengan cara yang berbeda untuk menamba pengetahuan blogging kita.


Yang membedakan pada pembahasan kali ini adalah kita akan membuat random post di blog tanpa melalui editing kode HTML template yang kadang cukup membingungkan bagi sebagian blogger khususnya pemula. Kita hanya perlu menambahkan script pada pilihan gadget HTML/JavaScript.

Bagaimana cara buat random post di blog versi III ini?

Pertama, masuk terlebih dahulu ke dalam akun blogger kita masing-masing.
Klik fitur rancangan.
Klik tambah gadget.
Pilih HTML/JavaScript.
Masukan script berikut ini.

<script type="text/javascript">
var randarray = new Array();var l=0;var flag;
var numofpost=10;function randomposts(json){
var total = parseInt(json.feed.openSearch$totalResults.$t,10);
for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
document.write(item);}}
}document.write('</ul>');}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&
callback=randomposts" type="text/javascript"></script>

klik simpan dan selesai.

Keterangan :

  • var numofpost=10 menunjukan jumlah random post yang ditampilkan dalam sidebar blog kita, ganti sesuai selera.


Mudah bukan?
Jika ada pertanyaan dan tanggapan silakan sampaikan lewat kotak komentar ya kawan.
Salam blogger.

Saturday, July 16, 2011

Menampilkan Judul Postingan Saja Pada Halaman Utama

Sebagian blogger beranggapan jika menampilkan terlalu banyak postingan dalam halaman utama blog membuat blog mereka menjadi terasa kurang nyamana untuk dilihat. Selain karena terlalu rumit dengan banyaknya kalimat dan gambar, menampilkan terlalu banyak postingan di halaman utama juga pasti membuat ukuran blog menjadi berat hingga pada akhirnya membuat proses loading blog tersebut menjadi lebih lama.


Salah satu alternatif yang biasanya digunakan adalah dengan cara membuat read more pada blog. Dengan adanya read more akan membuat tampilan setiap postingan yang ada di halaman depan blog menjadi lebih ringkas, sehingga membuat tampilan lebih nyaman dan ukuran blog pun tidak terlalu berat.

Akan tetapi, ada cara lain yang dapat kita coba guna mempermudah akses pembaca dalam mengamati postingan blog kita sekaligus membuat tampilan utama blog menjadi lebih ringan, ringkas, dan jelas. Kita dapat mencoba menampilkan judul postingan saja pada halaman utama.

Bagaimana cara menampilkan judul postingan saja pada halaman utama blog?

Pertama, masuk ke dalam akun blogger kita masing-masing.
Klik fitur rancangan.
Klik edit HTML.
Berikan tanda contreng pada Expand Template Widget.
Cari kode HTML berikut ini.

]]></b:skin>

Kemudian tempelkan kode berikut ini tepat sesudah kode HTML di atas.


<style type='text/css'>
     <b:if cond='data:blog.pageType != &quot;item&quot;'>
     <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
     .post-body{display:none;}
     </b:if>
     </b:if>
     </style>


Klik simpan template dan selesai.


Keterangan :

  1. Gunakan tombol Ctrl + F pada keyboard untuk mempermudah pencarian kode HTML yang kita inginkan.
  2. Sebelum menjalankan aktifitas editing kode HTML template, download terlebih dahulu template blog kita sebagai antisipasi jika terjadi kegagalan saat proses editing berlangsung.



Nah, sekarang setiap postingan yang kita publikasikan akan muncul judul postingannya saja pada halaman utama blog kita. Hal ini akan membuat tampilan blog lebih hemat ruang dan simpel.

Ada yang ingin menambahkan?
Jika ingin bertanya dan menanggapi silakan disampaikan saja lewat kotak komentar di bawah ini ya kawan.
Salam blogger.