Cara Membuat Blog Gratis dan Mudah Di Wordpress

HAHIHUHEHO IS BACK - Halo semua, apa kabar? Lama juga blog ini gak update yah hehe. Authornya sibuk mulu wkwk. Oh iya, kali ini saya akan berbagi ilmu tentang Cara Membuat Blog Gratis Di Wordpress.

Apa itu Wordpress? WordPress adalah sebuah aplikasi sumber terbuka (open source) yang sangat populer digunakan sebagai mesin blog (blog engine). 
(Sumber : Wikipedia)

Langsung saja kita menuju ke topik pembicaraan. Buat yang belum tau apa itu blog, akan saya jelaskan pengertian dari blog tersebut.

Blog merupakan singkatan dari web log adalah bentuk aplikasi web yang menyerupai tulisan-tulisan (yang dimuat sebagai posting) pada sebuah halaman web umum. Tulisan-tulisan ini seringkali dimuat dalam urut terbalik (isi terbaru dahulu baru kemudian diikuti isi yang lebih lama), meskipun tidak selamanya demikian. Situs web seperti ini biasanya dapat diakses oleh semua pengguna Internet sesuai dengan topik dan tujuan dari si pengguna blog tersebut.
(Sumber : Wikipedia)

Nah, buat yang belum tau cara buat blog, maka akan saya urai cara termudah membuat sebuah blog dan tentunya GRATIS.

Kira-kira seperti inilah tampilan sebuah blog yang masih baru.

Blog tersebut adalah blog baru saya, ya untuk sekedar nulis-nulis aja sih. Kalian bisa melihatnya di http://hamamkautsari.wordpress.com

Ayo mulai buat blognya!

Oh iya sebelum membuat Blog Gratis Di Wordpress ini, sebenarnya ada juga cara membuat blog yang tak kalah mudah dengan Wordpress, yaitu di Blogger.com 

Kali aja ada yang minat membuat blog di Blogger.com, saya juga punya cara-caranya. Bisa dilihat disini >> Cara Membuat Blog Dengan Sangat Muda Di Blogger

Contoh dari Blog yang dibuat di blogger.com adalah blog saya ini, bagus engga? hehe

Langsung ah, gausah basa-basi lagi. Ini dia Cara Buat Blog Di Wordpress. 

1. Masuk ke alamat Wordpress.com, kira-kira tampilannya seperti ini.

2. Klik Create Website dan kita akan masuk ke suatu halaman. Kira-kira seperti ini halamannya.

3. Nah, masukkan deh nama alamat blog yang kalian inginkan. Contoh :

4. Oh iya, jika ada tulisan seperti gambar di bawah ini, artinya nama tersebut sudah ada yang memakai, ganti dengan nama yang lain sampai "Create Your Site and Continue"-nya bisa di klik seperti gambar di atas. 

5. Klik "Create Your Site and Continue"

6. Kalian akan masuk ke suatu halaman, yang kira-kira seperti gambar di bawah ini.

Keterangan : 

- Semua kolom wajib diisi.

- Pada kolom yang saya tandai dengan angka 1, itu adalah alamat blog yang anda buat sebelumnya.

- Pada kolom yang saya tandai dengan angka 2, itu adalah kolom e-mail. Isi dengan e-mail yang belum pernah didaftarkan di Wordpress. 

- Pada kolom yang saya tandai dengan angka 3, itu adalam kolom username. Isi username dengan nama sesuka hati anda. Inget! Tanpa Spasi!

- Pada kolom yang saya tandai dengan angka 4, itu adalah kolom password. Isi sesuka hati kalian.

- Pada tombol yang saya tandai dengan angka 5, itu adalah tombol untuk melanjutkan ke langkah selanjutnya. Tapi perlu diingat! Setiap kolom harus ada tanda ceklis (seperti yang saya lingkari) untuk bisa lanjut ke langkah berikutnya.

7. Masih pada halaman tadi, klik Next Step.

8. Nanti kalian akan masuk ke suatu halaman, kira-kira seperti gambar di bawah ini.

9. Paham dengan gambar di atas? semoga tidak, agar aku bisa menjelaskannya hehe. Inti dari kata GRATIS itu ada pada gambar di atas. Anda bisa saja membayar pada Wordpress itu sendiri agar nama alamat blog anda tidak ada embel-embel .wordpress tetapi langsung .com

Misal, kalo anda membayar pada wordpress, maka nama blog anda adalah muhammadhamamkautsari.com tetapi jika gratis maka akan menjadi muhammadhamamkautsari.wordpress.com, tahu perbedaannya kan? Semoga paham hehe.

10. Nah karena di sini saya fokusnya pada yang gratis, maka klik No Thanks (lihat gambar di atas dan tulisan yang dilingkari) jika anda mau yang berbayar ya monggoh, tapi ikuti sendiri langkah-langkah berikutnya karena saya fokus pada yang GRATIS.

11. Kemudia pilih Tema blog kalian, klik salah satu dari beberapa yang disediakan Wordpress. Lihat gambar di bawah.

12. Nah, nanti kalian akan masuk ke halaman seperti gambar di bawah ini. Klik "Select Free" seperti yang sudah saya kasih tanda panah. Kenapa pilih yang Free? Ya karena kita fokusnya sama yang gratisan hehe

13. Tinggal Finishing nih, klik pada Re-send your activation email atau Klik Change the email address on your account untuk mengubah alamat email anda.

14. Nah, sekarang cek inbox e-mail anda untuk verifikasi akun Wordpress kalian. Dapet inbox dari Wordpress kan? Nah buka aja, terus klik link verifikasinya. Semoga kalian ngerti maksud saya.

15. Nah, sekarang blog sudah jadi. Kalo mau buka tinggal buka aja. Misal, ketik hamamkautsari.wordpress.com 

16. Terakhir nih, kalo mau nulis artikel atau nulis apapun di Blog, bisa klik tombol pensil. Lihat gambar di bawah.

17. SELESAI!

Happy Blogging Friends

Semoga bermanfaat, Bye ;)

Read more

Cara Memasang Visitor Flag Counter Di Blog

Hahihuheho - Kali ini saya akan berbagi Tutorial desaign blog, udah lama nih udah gak ngasih Tutorial Blog.
Yang akan saya SHARE adalah Cara Memasang Visitor Flag Counter Di Blog.

Langsung saja ikuti caranya dibawah ini

CARA MEMASANG VISITOR FLAG COUNTER DI BLOG :

Klik alamat Situs Flag Counter http://flagcounter.com - akan tampil gambar berikut :

Isikan option-option untuk mengatur tampilan flag counter dan sesuaikan dengan kondisi blog Anda :

- Maximum flag to show : jumlah bendara yang akan ditampilkan
- Columns of flag : jumlah kolom
- Label on top of counter : nama dari Flag Counter
- Background color : warna latar dari Flag Counter
- Text color : warna tulisan
- Border color : warna garis tepi dari Flag Counter
- Show country flag : untuk menampilkan kode negara
- Show pageview : untuk menampilkan jumlah halaman yang dikunjungi
Setelah mengatur tampilan Flag Counter akan terlihat preview pada example flag counter with your choices, setelah tampilan sesuai dengan keinginan, Klik get your flag counter.

Klik Skip - untuk Memasang Flag Counter silahkan tinggal copy codenya lalu paste ke dashbor blog anda.
Cara Memasang Daftar Visitor Dengan Flag Counter
>> Ke tata letak atau layout
>> Klik Tambahkan Gadget
>> Klik Opsi HTML/JAVA SCRIPT
>> Lalu Pastekan kode Flag Counter anda pada halaman - (SAVE/Simpan Perubahan)
>> SAVE deh, Selesai.


Semoga bermanfaat!

Read more

Cara buat background pada postingan blog

Hahihuheho - Pada kesempatan kali ini saya akan berbagi tips blog. CARA BUAT BACKGROUND PADA POSTINGAN BLOG.

Langsung saja

Oke langsung saja ini tutorialnya :

1. Sign in dulu diblogger anda tentunya
2. Pilih postingan yang ingin dibuat backgroundnya/mungkin buat postingan baru
3. Setelah dibuat berikan kode ini

<div style="background:url(Link gambar disini) no-repeat;">
isi postingan anda
</div>

Keterangan :

1.  Tulisan yang berwarna biru Link gambar disini ganti dengan url gambar yang anda inginkan
2.  Jika anda menggunakan gambar berukuran kecil,tidak usah memakai no-repeat
3.  Tulisan isi postingan anda adalah isi postingan anda

Read more

Cara Upload Video Di Blog

Hahihuheho - Kali ini saya akan berbagi tips blog. Yaitu Cara Upload Video Di Blog.


Langsung saja.

Langkah :

1. Masuk ke akun blog sobat, lalu klik New Post.
2. Lalu klik ICON VIDEO seperti di bawah.

       3. Selanjutnya, browse video yang akan di upload.
       4.  Untuk sebuah video, waktu yang  diperlukan cukup lama untuk memproses video tersebut sampai dapat dipublishkan. tergantung kepada size video.

Read more

Cara Membuat Efek Loading Di Blog

Hahihuheho - Kali ini saya akan berbagi tips, yaitu CARA MEMBUAT EFEK LOADING
 

Langsung saja kagak pake lama...


Langkah Membuat Efek Loading...

1.  Masuk TEMPLATE --> EDIT HTML
2. Cari kode ]]></b:skin>
3. Masukkan kode dibawah ini tepat diatas Kode ]]></b:skin> 

   
   

   #page-loader {
position:fixed !important;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
z-index:999999;
background: #303030 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzJdvijz3cYlfWf3_5qq7US2kJkXJpHoVOyejdeSLhyqRmjACTFP46qxx230oJPPVBWqax1EEH3Jpvxx-D1JRJtszZ52hmx4zdsm-4lRP25lrtv-5yQB8ez7iruVPm6aqn-XLn79XV39BW/s320/load+labeltutorial.gif") no-repeat 50% 50%;
padding:1em 1.2em;
display:none
} 

   Keterangan : Kode warna merah bisa diganti dengan URL gambar milik sobat sendiri.
   
   
   4. Masukkan kode dibawah ini tepat diatas kode </body>
   

   <script type='text/javascript'>
//<![CDATA[
// Menyisipkan markup tabir animasi
$(document.body).append('<div id="page-loader"></div>');
// Saat halaman aktif terpicu untuk berpindah/keluar menuju halaman lain...
$(window).on("beforeunload", function() {
    // ... tampilkan tabir animasi dengan efek `.fadeIn()`
    $('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>

   5. Save & lihat hasilnya
   

    

Read more

Cara Ganti Template Blog

Hahihuheho - Pada kesempatan kali ini saya akan berbagi cara dasar dalam blo.
Yaitu Cara Ganti Template Blog..!



Langsung saja!

1. Buka Blog sobat!
2. Pilih Template --> Klik Cadangkan/Pulihkan ( Di bagian pojok kanan atas )
3. Klik Unduh Template jika sobat masih ingin menyimpan template lama blog sobat!
4. Klik Browse untuk mencari File Template Blog yang akan sobat pasang!
5. Kemudian klik Unggah!
6. Tunggu sampai proses selesai
7. Jika sudah, klik Lihat Blog untuk melihat perubahan template blog sobat!

Jika sobat kurang mudeng/mengerti bisa memberi komentar

Maaf jika ada salah kata!

Read more

Cara Buat Tombol Demo dan Download Di Blog

Hahihuheho - Setelah lama ngga posting, kali ini saya datang lagi.
Kali ini saya akan berbagi tips blog lagi, yaitu CARA BUAT TOMBOL DEMO dan DOWNLOAD DI BLOG.

Kira kira seperti ini contohnya..








Langsung saja

1. Buka blog sobat
2. Pilih Template --> Edit HTML
3. Copy kode dibawah tepat diatas kode ]]></b:skin>

/* -- Kang Ismet Button --*/
.button{float:left;list-style:none;text-align:center;width: 100%;margin:5px 0;padding:0;font-size:14px;clear:both;}
.button ul {margin:0;padding:0}
.button li{display:inline;margin:0;padding:0}
.demo {border: none; -moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding: 8px 80px !important; background: #E55E48; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -webkit-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -moz-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -ms-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); transition: background-color 1s ease-out 0s; -moz-transition:background-color 1s ease-out 0s; -webkit-transition:background-color 1s ease-out 0s; -o-transition:background-color 1s ease-out 0s;letter-spacing:1px; }
.download {border: none; -moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;padding: 8px 80px !important; background: #5FAAE3; color: #fff !important;text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -webkit-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -moz-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); -ms-text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); transition: background-color 1s ease-out 0s; -moz-transition:background-color 1s ease-out 0s; -webkit-transition:background-color 1s ease-out 0s; -o-transition:background-color 1s ease-out 0s; letter-spacing:1px;}
.demo:hover { background: #454242; text-shadow: 0 0 1px #222; -moz-text-shadow: 0 0 1px #222; -webkit-text-shadow: 0 0 1px #222; -ms-text-shadow: 0 0 1px #222 }
.download:hover { background: #454242; text-shadow: 0 0 1px #222; -moz-text-shadow: 0 0 1px #222; -webkit-text-shadow: 0 0 1px #222; -ms-text-shadow: 0 0 1px #222 }

     4. Simpan!
     5. Untuk penggunaannya gunakan kode dibawah ini saat memposting ( Gunakan Mode HTML bukan Compose)

<div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="Link Demo" target="_blank">Demo</a></li>
<li><a class="download" href="Link Download" target="_blank">Download</a></li>
</ul>
</div>
<div class="clear"></div>

     6. Publikasikan!

Ket : Ganti Link Demo dan Link Download dengan Link Demo dan Link Download sobat

Read more