Cara Membuat Widget Daftar Menu Blog Otomatis

Cara Membuat Widget Daftar Menu Blog Otomatis  - Daftar menu blog yang biasanya ditempatkan pada sidebar blog ini ada juga yang menyebutnya dengan table of content. Cara membuat table of content ini sedikit berbeda dengan daftar isi blog otomatis yang pernah saya posting sebelumnya. Pada widget daftar menu otomatis ini sudah dilengkapi fungsi scroll dan pengunjung blog anda dapat mempercepat pencarian artikel dengan menggunakan opsi pilihan label, title, tanggal posting serta dapat juga menampilkan seluruh isi blog jika kita memilih opsi “All label”. Pada script daftar menu blog yang mau saya share ini, mampu menampilkan sampai max 500 halaman posting. Jika blog anda sudah memiliki lebih dari 500 halaman posting, tinggal diganti saja angka 500 dengan angka 1000 beres !. Dan satu lagi kelebihannya : jika anda mengklik icon panah hitam yang ada didepan judul posting, maka akan memunculkan ringkasan artikel tersebut sepanjang 250 kata. Klik kembali icon panah tersebut untuk menyembunyikan ringkasan.


Cara Membuat Daftar Menu/Isi Di Sidebar Blog :
1.       Login ke dashboard blogger anda.
2.       Pilih Rancangan > Elemen Laman > Add gadget (HTML/JavaScript).
3.       Copy script dibawah ini dan paste pada gadget.

<div style="background:#FFFFFF; no-repeat scroll 0 0; border:2px solid #FFFFFF;height:310px; overflow:auto; padding:10px; width:260px;">
<div id="cl_option">
Loading... </div>
<div id="cl_content_list">
</div>
<script type="text/javascript">
var jumlah_kata_dalam_ringkasan = 250;
</script>
<script src="http://raihanun.googlecode.com/files/DaftarMenuOtomatis.js">
</script>
<script src="http://kamu-klik.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=onLoadFeed&amp;max-results=500">
</script></div>Get this <a href="http://kamu-klik.blogspot.com/2011/12/widget-daftar-menu-blog-otomatis.html" target="_blank"><blink>widget</blink></a>

4.       Silahkan edit pada lebar (width) dan tinggi (height) pada script ini untuk menyesuaikan dengan lebar sidebar blog anda. Dan ganti juga nama blognya dengan nama blog anda.
5.       Save / Simpan.

Tips Blogger : Cara Mengganti Logo Blogger Dengan Logo Sendiri


Tips Komputer | Tips SEO | Tips Blogger
Tips Blogger yang akan saya bahas kali ini bukan hal yang baru, tapi melaikan merupakan hal yang wajib diketahui oleh para Blogger. Biasanya bagi blogger yang masih pemula atau baru Belajar Blogger, seperti halnya saya sendiri, kurang tahu dan masih bertanya-tanya bagaimana Cara Mengganti Logo Blogger Dengan Gambar Sendiri. Yang merasa kurang paham dengan cara ini bisa melihat contohnya pada Adress Bar Blog saya ini, jika blogger yang baru membuat blognya biasanya pada adress bar masih menggunakan logo Blogger yaitu huruf "B". Nah untuk merubahnya yang anda perlukan adalah gambar yang anda inginkan untuk dijadikan logo, tapi syarat gambarnya harus sudah terupload di Internet. Jangan khawatir banyak penyedia upload foto di Internet, contohnya saja PhotoBucket dan Picasa.
Setelah anda memiliki foto atau logo yang sudah diupload dengan disertai url foto tersebut anda sudah bisa melanjutkan Tips Belajar Blogger kali ini. Berikut cara-cara Tips Blogger tentang Cara Mengganti Logo Blogger Dengan Gambar Sendiri.
  1. Login dulu ke Blogger anda.
  2. Klik Rancangan pada Dashboard
  3. Klik Edit Html.
  4. Tekan Ctrl + F untuk mencari kode berikut ini :          <title><data:blog.pageTitle/></title>
             <b:skin><![CDATA[
  5. Copy kode ini di antara kode di atas : <link href='url foto yang telah anda upload' rel='shortcut icon'/>
  6. Contohnya seperti ini :
    <title><data:blog.pageTitle/></title>                                                                                <link href='alamat url foto yang telah anda upload' rel='shortcut icon'/>
    <b:skin><![CDATA[        
  7. Setelah itu Simpan Template dan anda sudah bisa melihat hasilnya. Demikian Tips Blogger tentang Cara Mengganti Logo Blogger Dengan Gambar Sendiri, semoga dapat bermanfaat untuk anda terutama bagi yang baru Belajar Blogger.

Menampilkan Pengunjung Online Dan Total Pengunjung Pada Blog


Banyak cara yang bisa digunakan untuk menampilkan jumlah pengunjung yang sedang online dan total pengunjung pada blog. Kemarin sewaktu memodifikasi blog saya, Danny adik saya menemukan situs bagus untuk menampilkan jumlah pengunjung yang sedang online dan total pengunjung pada blog dengan menggunakan widgeo.net. Widgeo merupakan situs yang menyediakan berbagai tampilan counter, country, page rank, dan total visitor untuk website atau blog.

Kelibihan widgeo yaitu bisa menampilkan jumlah pengunjung, pengunjung yang online, dan negara pengunjung menjadi satu tampilan counter. Dan tampilan counter ini di lengkapi dengan flash efect sehingga membuat tampilan blog menjadi lebih elegan.

Untuk membuat tampilan widgeo pada blog kita caranya cukup mudah.

- Klik di sini atau kunjungi situs widgeo.net

- Setelah tampil halaman awal widgeo kita bisa langsung memilih model counter yang diinginkan.











- Kemudian isi data informasi optional untuk mendapatkan kode html

Untuk GMT timezone pilih +7



- Kemudian pilih OK, maka akan tampil kotak berisi tampil kode html, copy dan masukkan pada html/java script pada pilihan add widget pada blog.








- Kemudian simpan dan lihat hasilnya.

Memasukkan File PDF ke dalam Posting


Memasukkan file PDF ke dalam posting - itulah judul postng zona-klik kali ini, dimana zona klik ingin share kepada anda cara memasukkan file PDF ke dalam posting. Mungkin anda pernah terpikir untuk share dokumen dalam format pdf ke dalam blog, tetapi kesulitan bagaimana caranya. Dengan adanya artikel yang zona klik publish ini mudah-mudahan bisa bermanfaat dan bisa memecahkan permasalahan anda dan sekarang anda bebas untuk share dokumen apapun kedalam blog seberapa banyak yang anda inginkan.

Dalam hal ini kita harus meminta bantuan orang ketiga yaitu layanan yang menyediakan fasilitas untuk menampilkan file pdf dalam format flash yang nantinya akan di masukkan kedalam blog. Caranya yaitu pertama anda haruslah melakukan registrasi (pendaftaran) di http://www.scribd.com (free) dan ikuti langkah selanjutnya hingga proses registrasi selesai. Setelah proes registrasi selesai, silahkan login ke acount scribd anda. Klik upload untuk mengambil file di hardisk komputer anda untuk di share ke dalam blog - tunggulah proses upload file selesai. 


Setelah proses upload dokumen di scribd selesai, selanjutnya klik judul file yang telah di upload  maka anda akan di bawa ke halaman / page file yang telah di upload sebelumnya. Klik menu Share/Embed untuk mengambil kode yang akan dimasukkan ke dalam posting blog. Masukkan kode tersebut ke halaman posting anda dan lihat hasilnya, maka file yang telah anda upload pada scribd sebelumnya telah tampil di posting blog.



Cara Membuat Alert Jumlah Pengunjung

Oke, ketemu lagi dengan Idris Dehidrasi. Kali ini saya akan membahas tentang cara membuat alert jumlah kunjungan untuk pengunjung situs kita di blogger. Mengapa saya memposting tentang trik dan tips ini?


Pada dasarnya sebagai seorang admin blog misalnya, jumlah pengunjung adalah sebuah hal informasi yang sangat penting karena dengan informasi jumlah pengunjung, kita akan tahu seberapa kualitaskah situs kita. Ingat, kualitas sebuah situs bukan karena tampilannya yang bagus, akan tetapi kualitas sebuah situs adalah seberapa banyak orang berpetualang di situs kita.


Nah, berikut akan saya sampaikan cara membuat alert jumlah pengunjung di blog kita.

1. Silahkan masuk ke akun blogger anda terlebih dahulu.
2. Pilih Rancangan > Elemen Laman
3. Pilih Add Gadget > HTML/JavaScript
4. Copas saja script si bawah ini
<font color="lime"><script language="JavaScript" src="http://vhenom.wen.ru/script/online2.js"></script></font><br/>
5. Simpan

Mengganti Komentar di Blogger dengan Komentar Facebook

Mungkin minggu ini bisa dikatakan hari 'liburan terpanjang' bagi gue pribadi,secara gitu gan,gue libur hampir satu minggu penuh.

Kesempatan ini gue manfaatin buat nambah bahan posting di blog sederhana milik gue ini.
Yup! disini kita akan coba mengulas bagaimana membuat komentar di blogger seperti komentar facebook,kendati komentar facebook yang akan kita bahas ini bukanlah 'pengganti' dari komentar blogger aslinya.

Dengan kata lain,sobat masih bisa menggunakan komentar bogger yang lama jika diperlukan bahkan dari keduanya antara komentar facebook maupun kotak komentar yang disediakan oleh blogger.com sendiri dapat digunakan secara bersamaan.

Tapi gue kira hanya orang-orang tertentu yang menggunakan dari kedua widget ini secara bersamaan,mubazir bang get,hehehe

Oke,kotak komentar facebook ini bukannlah pengganti kotak komentar blogger yang asli,ini hanya merupakan widget yang sengaja facebook ciptakan dalam pengembangan dan promosi mereka.

Kelemahannya widget ini adalah,isi komentar akan sama pada setiap posting.menyebalkan.Tapi setelah posting ini nanti,akan dipublikasikan Cara II untuk membuat komentar facebook di blog dalam setiap posting.

Ingin menerapkan / memasang widget komentar facebook di blog kamu sekarang? yuk ikuti langkah yang Pelajaran Blog akan ulas berikut ini ya gan!

Langkah dan Cara Memasang Komentar Facebook di Blog


1.Sobat kunjungi:
developers.facebook.com/docs/plugins/

2.Selanjutnya pilih 'Comments' pada pilihan widget,lihat gambar:



3.Nanti akan keluar konfirmasi seperti ini,tentukan pilihan sobat sendiri dan klik 'Get Code':



4.Akan tampil dua kode script yang facebook berikan,seperti gambar dibawah ini (tanda 1 untuk kode pertama,tanda 2 untuk kode yang kedua):



5.Tugas sobat,sekarang copy kode yang pertama,seperti gambar ini:



6.Setelah itu,masuk ke akun blogger sobat lalu pilih Dashboard (gb.1),lalu Tata Letak (gb.2) kemudian contreng tulisan Expands Widget Templates (gb.3)


Setelah itu cari kode <body> gunakan Ctrl+F pada keyboard untuk mempermudah pencarian,setelah sobat menemukan kode <body> paste-kan atau letakkan persis diBAWAHnya kode pertama yang berhasil kita copy dari facebook tadi,seperti ini:



7.Jika kita sudah menerapkan kode pertama,sekarang kita copy kode kedua,lihat gambar ini:



8.Setelah sobat berhasil copy kode kedua ini,pilih Tata Letak / Rancangan,dan klik tulisan Add New Widget atau Tambah Gadget,




Selanjutnya pilih HTML/Javascript kemudian letakkan kode kedua yang tersebut diatas tadi.

10.Setelah sobat melakukan atau memberikan komentar di widget facebook comments for blogger ini akan tampil di profil facebook sobat seperti ini:

Cara Mudah Membuat Menu Drop Down di Blog

screenshot menu dropdown
Oia, cara ini aku dapat dari wartaberata.com. Dan cara ini menurutku cara yang paling mudah dari beberapa artikel lain yang pernah saya lihat. Saya sungguh berterimakasih akhirnya bisa memasang menu dropdown ini berkat tutorial dari kang wartabeta. Ok begini caranya..
Sebelumnya backup template duyu..
1. Login ke blogger (yang diperbarui bahasa Indonesia)
2. Masuk ke template - edit html -  centang pada expand template widget
3. Cari kode ini ]]></b:skin> (gunakan ctrl+F untuk search) lalu tepat diatasnya letakkan kode ini
#NavbarMenu {background: #555 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv6g24ANup73tyrp9OQ27v6Bf3PNrGuHWRmlffjNcSFp_xyFeq5ZvECPncFCiPTXYpoUd9trrIttqSFm3zdt2_X1mRKBQgXMqebqHHyh9FTSw_ypIGtZRAfJ6A4tkktaMZBs5NsGxqc74/s400/navbar11.png);width: 960px;height: 35px;font-size: 12px;font-family: arial, Verdana;color: #FFF;font-weight: bold;margin: 0;padding: 0;}#NavbarMenuleft {width: 710px;float: left;margin: 0;padding: 0;}#nav {margin: 0;padding: 0;}#nav ul {float: left;list-style: none;margin: 0;padding: 0;}#nav li {list-style: none;margin: 0;padding: 0;}#nav li a, #nav li a:link, #nav li a:visited {color: #FFF;display: block;font-size: 14px;font-weight:bold;font-family: sans-serif, Verdana;font-weight: bold;text-transform: none;margin: 0;padding: 9px 15px 8px;}#nav li a:hover, #nav li a:active {background: #555;color: #FFF;margin: 0;padding: 9px 15px 8px;text-decoration: none;-webkit-transition: all .2s ease-in-out;-moz-transition: all .2s ease-in-out;-ms-transition: all .2s ease-in-out;-o-transition: all .2s ease-in-out;transition: all .2s ease-in-out;}#nav li li a, #nav li li a:link, #nav li li a:visited {background: #555;width: 200px;color: #FFF;font-size: 14px;font-family: "ms sans serif", Verdana;font-weight: normal;text-transform: none;float: none;margin: 0;padding: 7px 10px;border-bottom: 1px dotted #7F7F7F;border-left: 1px solid #7F7F7F;border-right: 1px solid #7F7F7F;-webkit-transition: all .2s ease-in-out;-moz-transition: all .2s ease-in-out;-ms-transition: all .2s ease-in-out;-o-transition: all .2s ease-in-out;transition: all .2s ease-in-out;}#nav li li a:hover, #nav li li a:active {background: #777;color: #FFF;padding: 7px 10px;}#nav li {float: left;padding: 0;}#nav li ul {z-index: 9999;position: absolute;left: -999em;height: auto;width: 170px;margin: 0;padding: 0;}#nav li ul a {width: 140px;}#nav li ul ul {margin: -32px 0 0 171px;}#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {left: -999em;}#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {left: auto;}#nav li:hover, #nav li.sfhover {position: static;}

4. Selanjutnya cari kode ini  <div id='header-wrapper'> lalu tepat dibawahnya pastekan kode ini

contoh menu drop down untuk kode dibawah
<div id='NavbarMenu'>
<div id='NavbarMenuleft'>
<ul id='nav'>
<li><a href='http//zamedaku.blogspot.com'>Home</a></li>
<li><a href='http//zamedaku.blogspot.com'>profil</a></li>
<li><a href='http//zamedaku.blogspot.com'>Blogging</a></li>
<li><a href='http//zamedaku.blogspot.com'>Menu turun &#187;</a>
<ul>
<li><a href='http//zamedaku.blogspot.com'>Menu turun 1</a></li>
<li><a href='http//zamedaku.blogspot.com'>Menu turun 2</a></li>
<li><a href='http//zamedaku.blogspot.com'>Menu turun 3</a></li>
<li><a href='http//zamedaku.blogspot.com'>Menu turun 4</a></li>
<li><a href='http//zamedaku.blogspot.com'>Menu turun 5</a></li>
</ul></li>
<li><a href='http//zamedaku.blogspot.com'>Contact us</a></li>
</ul>
</div>
</div>

Untuk link warna merah rubahlah dengan link anda, untuk warna oranye rubahlah untuk nama menu-menunya.

5. Simpan. Dan lihat hasilnya....

Cara Mengganti Icon Pada Address Bar

 Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :
Bagi kamu yang tidak puas dengan icon/gambar tersebut, kamu bisa menggantinya dengan gambar sesuai dengan keinginanmu. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x42 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat). Setelah itu .....
masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode </head>

<link href='http://kendhin.890m.com/sonictrik.gif' rel='SHORTCUT ICON'/>

ganti huruf yang dicetak tebal dengan lokasi gambar dimana kamu menyimpannya. Kamu bisa menyimpan gambarmu di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo kamu tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

http://img87.imageshack.us/img87/5862/image1an1.gif
http://img110.imageshack.us/img110/6218/image2ie0.gif
http://img98.imageshack.us/img98/9617/image3cr0.gif
http://img134.imageshack.us/img134/633/image4hx4.gif
http://img139.imageshack.us/img139/83/image5oa7.gif
http://img509.imageshack.us/img509/6449/image6fu0.gif
http://img527.imageshack.us/img527/6543/image7go9.gif
http://img507.imageshack.us/img507/5774/image8wn8.gif
http://img150.imageshack.us/img150/5784/image9qo1.gif
http://img404.imageshack.us/img404/1214/image10vr1.gif
http://img412.imageshack.us/img412/3808/image11pc0.gif
http://img100.imageshack.us/img100/4658/image12du2.gif
http://img132.imageshack.us/img132/4733/image13lj1.gif
http://img145.imageshack.us/img145/7793/image14zg9.gif
http://img412.imageshack.us/img412/4403/image15jc7.gif
http://img264.imageshack.us/img264/7575/image16kn8.gif

Cara membuat Background animasi di blog


Anda mungkin pernah melihat blog yang background/latar belakang nya itu menggunakan gambar animasi ? anda mau mencobanya maka dari itu itu pada postingan kali ini saya akan menjelaskan cara membuat background animasi di blog oke langsung aja kita simak bersama!!!!

  • Login » Blogger.
  • Rancangan » Edit HTML.
  • Apabila anda belum menggunakan kode JQuery silakan anda pasang kode JQuery dibawah ini tepat di atas Kode </Head>.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2' type='text/javascript'></script>

  •  Copy-Paste kode di bawah ini tepat di atas Kode </Head>.
<script type='text/javascript'>
//<![CDATA[
$(function(){
// ***
// Scrolling background
// ***
// height of background image in pixels
var backgroundheight = 4000;

// get the current minute/hour of the day

var now = new Date();
var hour = now.getHours();
var minute = now.getMinutes();

// work out how far through the day we are as a percentage - e.g. 6pm = 75%

var hourpercent = hour / 24 * 100;
var minutepercent = minute / 30 / 24 * 100;
var percentofday = Math.round(hourpercent + minutepercent);

// calculate which pixel row to start graphic from based on how far through the day we are

var offset = backgroundheight / 100 * percentofday;

// graphic starts at approx 6am, so adjust offset by 1/4

var offset = offset - (backgroundheight / 1);

function scrollbackground() {

// decrease the offset by 1, or if its less than 1 increase it by the background height minus 1
offset = (offset < 1) ? offset + (backgroundheight - 1) : offset - 1;
// apply the background position
$('body').css("background-position", "50% " + offset + "px");
// call self to continue animation
setTimeout(function() {
scrollbackground();
}, 70
);
}
// Start the animation
scrollbackground();
});

//]]>

</script>
  • Copy-Paste Kode CSS di bawah ini tepat di atas Kode </Head> untuk memasang gambar background. Anda dapat mengganti gambar background sesuai dengan yang anda inginkan dengan merubah alamat hosting gambar pada Kode CSS di bawah dengan alamat hosting gambar yang anda pilih.

<style>
body {
background: black url(
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzqYkNDDu3ueY9uf65eGRbxGOPD_YMn01Wt3WRHv2I6koPGOYKt6rvdQ6eFUFvQDYnnzQgTS4592ZCW_X3H7miudp-yyGBFqcHgH-QMZldB2-uOrfSVfT36PbY8Qr2r6fsx9FjgZYU78DI/s800/animated%2520stars.gif) repeat center; background-attachment: fixed;
}
</style>



 
Keterangan : - repeat // Pengulangan gambar arah x dan y.
  • repeat-x // Pengulangan gambar hanya arah horizontal.
  • repeat-y // Pengulangan gambar hanya arah vertikal.
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzqYkNDDu3ueY9uf65eGRbxGOPD_YMn01Wt3WRHv2I6koPGOYKt6rvdQ6eFUFvQDYnnzQgTS4592ZCW_X3H7miudp-yyGBFqcHgH-QMZldB2-uOrfSVfT36PbY8Qr2r6fsx9FjgZYU78DI/s800/animated%2520stars.gif // URL Link gambar.
- center // Lokasi gambar berada di tengah layar.
  • Left // Lokasi gambar berada di kiri gambar.
  • Right // Lokasi gambar berada di kanan gambar.

Dan ini ada beberapa background Animasi yang bisa kamu pasang di dalam blog kamu

RED MATRIX
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/matrix_red_inner.gif

PLURP
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/1-purp1.gif
LIGHTNING
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/32-riem.gif
YELLOW MATRIX
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/matrix-yellow.gif
GREEN MATRIX
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/bercarablogspotcomt.gif

STAR
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/animated_background_a2.gif

BLUE MATRIX 1
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/blue-matrix-animate-layout.gif
BLUE MATRIX 2
Code: http://i1113.photobucket.com/albums/k514/S4NDMOTION/anime-in-blue-matrix.gif

Cara Membuat Email Baru di Gmail, Yahoo, dan Hotmail

A. Cara Membuat Email Gratis di Gmail (Google Mail)

Ini adalah layanan email gratis favorit saya. Selain bisa membuat email dengan gratis, kita juga bisa membuat akun Google plus dengan mudah bila sudah memiliki akun Gmail.
1. Langkah pertama, kunjungi situs Google mail
2. Klik tombol “Buat Akun” yang ada di sebelah kanan atas halaman Google mail.
gmail1 Cara Membuat Email Baru di Gmail, Yahoo, dan Hotmail
3. Isi kolom-kolom yang ada pada halaman pengisian dengan data Anda:
  • Nama: isi dengan nama lengkap Anda, nama depan dan nama belakang
  • Pilih nama pengguna Anda: isi dengan alamat email yang Anda inginkan
  • Buat sandi: isi dengan sandi yang tidak mudah ditebak, tapi mudah Anda ingat
  • Konfirmasi sandi Anda: ulangi memasukkan sandi Anda sebelumnya
  • Tanggal lahir: isi dengan tanggal, bulan, dan tahun kelahiran Anda
  • Gender: pilih yang sesuai dengan jenis kelamin Anda
  • Ponsel: isi dengan nomor HP Anda untuk keamanan
  • Buktikan bahwa Anda bukan robot: isi dengan kode (2 kata dengan spasi) yang ada di halaman tersebut
  • Lokasi: isi sesuai dengan negara tempat Anda tinggal
  • Centang kolom menyetujui persyaratan dan kebijakan dari Google
  • Klik tombol “Langkah berikutnya”

4. Langkah selanjutnya adalah menyiapkan profil Anda dengan menambahkan foto profile Anda. Untuk menambahkan foto, silahkan klik tombol “Tambahkan Foto Profil”. Anda bisa memasukkan foto dari komputer. Setelah selesai mengatur foto profil, klik tombol “Langkah berikutnya”.

5. Voila, akun email di Google sudah selesai dibuat. Silahkan klik tombol “Lanjutkan ke Gmail” untuk masuk ke halaman email Anda.

B. Cara Membuat Email di Yahoo Mail

Layanan email gratis dari Yahoo sangat banyak digunakan orang. Selain email gratis, kita juga otomatis akan bisa mendaftar ke layanan Yahoo Messenger untuk chating.
1. Langkah pertama, kunjungi situs Yahoo mail
2. Klik tombol “Buat Account Baru” di bagian atas kanan halaman Yahoo mail.
yahoomail1 Cara Membuat Email Baru di Gmail, Yahoo, dan Hotmail
3. Isi kolom-kolom yang disediakan dengan memasukkan data Anda:
  • Nama:  isi dengan nama lengkap Anda, nama depan dan nama belakang
  • Pilih ID Yahoo!: pilih alamat email yang Anda inginkan di Yahoo
  • Pilih kata sandi: isi dengan sandi yang Anda inginkan dan mudah diingat
  • Ketik ulang kata sandi: masukkan lagi sandi Anda
  • Saya lahir pada:  isi dengan tanggal, bulan, dan tahun kelahiran Anda
  • Saya tinggal di: pilih negara dimana Anda tinggal
  • Ponsel: isi dengan nomor HP Anda, untuk keamanan
  • Email Alternatif: isi bila Anda punya email lain, kosongkan bila memang tidak ada
  • Klik tombol “Buat akun saya”

3. Langkah selanjutnya adalah mengisi pertanyaan rahasia, ini dibutuhkan untuk menjaga keamanan akun email Yahoo Anda. Di sini Anda harus memilih pertanyaan dari pertanyaan 1 dan 2, serta tentukan jawaban Anda. Pilihlah pertanyaan yang jawabannya mudah Anda ingat. Dan jangan lupa mengisi nomor ponsel Anda pada kolom yang sudah disediakan. Pada halaman ini Anda juga perlu untuk memasukkan kode anti spam. Setelah selesai mengisi kolom-kolom yang disediakan, klik tombol “Selesai”.
4. Voila, email Anda di Yahoo sudah selesai dibuat. Langkah selanjutnya Anda bisa klik tombol “Persiapan Awal” untuk masuk ke halaman email Anda.

C. Cara Membuat Email di Hotmail

Layanan email gratis Hotmail ini disediakan oleh Microsoft.com. Memang tidak sepopuler Gmail dan Yahoo mail, tapi layanan ini sangat banyak digunakan orang.
1. Langkah pertama, buka situs Hotmail
2. Klik tombol “Sign up now” pada bagian kanan bawah halaman Hotmail.
hotmail1 Cara Membuat Email Baru di Gmail, Yahoo, dan Hotmail
3. Isi kolom-kolom yang disediakan dengan memasukkan data Anda:
  • Name: isi dengan nama depan dan nama belakang Anda
  • Birth date: isi dengan tanggal, bulan, dan tahun kelahiran Anda
  • Gender: pilih jenis kelamin
  • Microsoft account name: isi dengan alamat email yang Anda inginkan di akun Microsoft Anda
  • Create password: isi dengan sandi yang Anda inginkan
  • Reenter password: masukkan kembali sandi Anda
  • Phone number: isi dengan nomor HP Anda, untuk keamanan akun email
  • Alternate email address: isi dengan alamat email Anda yang lain, kosongkan bila tidak ada. Bila Anda tidak mengisi email alternatif maka Anda harus mengisi pertanyaan dan jawaban rahasia untuk menjaga keamanan akun email Anda.
  • Country region: pilih negara tempat tinggal Anda
  • Postal code: isi dengan kode pos Anda
  • Enter the characters you see: isi dengan karakter yang Anda lihat, ini untuk mencegah spam
  • Lalu klik tombol “I Accept”
4. Tadaaaa, akun email Anda di Hotmail sudah jadi. Langkah selanjutnya Anda bisa klik tombol “Continue to inbox” untuk melihat halaman email Anda.
Demikianlah informasi singkat cara membuat email baru di Gmail, Yahoo mail, dan Hotmail. Mudah-mudahan artikel ini bisa membantu Anda dalam membuat akun email baru dengan mudah dan cepat. 

Cara Membuat Animasi Cursor Di blog

Bosen dengan tampilan cursor biasa di website atau di blogger ini disini saya berbagi cara membuat memasang animasi cursor keren buat percantik blogger atau website anda ada banyak macam-macam animasi cursor untuk diblog saya tinggal anda pilih sesuai selera anda atau anda sukai langsung saja caranya  :

Cara untuk tampilan blogger lama :
1.Login ke blogger anda
2. Pilih Rancangan
3.klik Tambah Gadget Html/JavaScript
4.Copy & paste kan kode html mouse yang diinginkan di bawah ini
5.Terakhir Simpan 

Cara untuk tampilan blogger baru :
1.Login ke blogger anda
2. Pilih Laman
3.Pilih Tata Letak
4.klik Tambah Gadget Html/JavaScript
5.Copy & paste kan kode html mouse yang diinginkan di bawah ini
6.Terakhir Simpan 

Spongebob
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-12/too1107.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="SpongeBob SquarePants"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="SpongeBob SquarePants" style="position:absolute; top: 0px; right: 0px;" /></a> 



Mr.Crab
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-12/too1104.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="SpongeBob SquarePants Mr. Krabs"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="SpongeBob SquarePants Mr. Krabs" style="position:absolute; top: 0px; right: 0px;" /></a>


Bird
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/people/peo-9/peo1020.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Catching Fire"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Catching Fire" style="position:absolute; top: 0px; right: 0px;" /></a>



Mouse Pelangi
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-1/cur18.ani), url(http://cur.cursors-4u.net/cursors/cur-1/cur18.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Wavy Tail"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Wavy Tail" style="position:absolute; top: 0px; right: 0px;" /></a> 



Cartoon
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/games/gam-15/gam1440.ani), url(http://cur.cursors-4u.net/games/gam-15/gam1440.gif), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Toad Jumping Up and Down"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Toad Jumping Up and Down" style="position:absolute; top: 0px; right: 0px;" /></a>


Fire Guitar
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/games/gam-15/gam1440.ani), url(http://cur.cursors-4u.net/games/gam-15/gam1440.gif), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Toad Jumping Up and Down"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Toad Jumping Up and Down" style="position:absolute; top: 0px; right: 0px;" /></a>


Love
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/holidays/hol-6/hol512.ani), url(http://cur.cursors-4u.net/holidays/hol-6/hol512.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Valentine's Day Pumping Heart"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Valentine's Day Pumping Heart" style="position:absolute; top: 0px; right: 0px;" /></a>


Peace
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/symbols/sym-8/sym714.ani), url(http://cur.cursors-4u.net/symbols/sym-8/sym714.gif), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Different Types Of Peace Symbol"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Different Types Of Peace Symbol" style="position:absolute; top: 0px; right: 0px;" /></a>



Angel

<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-9/too917.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Cute Tinkerbell"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Cute Tinkerbell" style="position:absolute; top: 0px; right: 0px;" /></a>




Icon Moon
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-10/cur945.ani), url(http://cur.cursors-4u.net/cursors/cur-10/cur945.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Batman Begins - Diagonal Resize 2"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Batman Begins - Diagonal Resize 2" style="position:absolute; top: 0px; right: 0px;" /></a>



vegeta dragon ball
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/anime/ani-7/ani634.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Vegeta - Dragonball Z 2"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Vegeta - Dragonball Z 2" style="position:absolute; top: 0px; right: 0px;" /></a> 





superman
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-8/too702.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Superman"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Superman" style="position:absolute; top: 0px; right: 0px;" /></a> 





samurai x
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/special/spe-1/cloud_strife.ani), url(http://cur.cursors-4u.net/special/spe-1/cloud_strife.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Final Fantasy 7 Cloud Strife"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Final Fantasy 7 Cloud Strife" style="position:absolute; top: 0px; right: 0px;" /></a>




monkey
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/nature/nat-2/nat192.ani), url(http://cur.cursors-4u.net/nature/nat-2/nat192.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Cute Rocking Baby Monkey"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Cute Rocking Baby Monkey" style="position:absolute; top: 0px; right: 0px;" /></a>



I love her
 <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/special/spe-5/spe445.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="I Love Her"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="I Love Her" style="position:absolute; top: 0px; right: 0px;" /></a> 




I love him
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/special/spe-5/spe444.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="I Love Him"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="I Love Him" style="position:absolute; top: 0px; right: 0px;" /></a>