Cara membuat blog di blogger / blogspot

Cara membuat blog - Blog merupakan salah satu jenis portal internet yang dinamis dan konten atau isinya yang terus menerus diperbaharui berdasarkan urutan waktu. Pada dasarnya fungsi blog hanya digunakan sebagai jurnal atau catatan pribadi yang di publikasikan secara online. Namun seiring berjalannya waktu fungsi blog banyak berubah ke arah yang lebih jauh seperti situs berita, portal tutorial, dll.

Jika anda ingin memulai belajar cara membuat blog, anda bisa menggunakan platform blog gratisan di blogger. Berikut ini adalah step by step cara membuat blog di blogger/blogspot.

CARA MEMBUAT BLOG DI BLOGGER 

Sebelum memulai, anda diharuskan untuk membuat akun GMAIL. Silahkan lihat Cara membuat email di gmail terlebuh dahulu. 

Setelah email jadi, ikuti langkah langkah dibawah ini : 

1. Silahkan kunjungi situs http://www.blogger.com
2. Setelah halaman pendaftaran terbuka, alihkan perhatian ke sebelah kanan bawah, ubah bahasa ke Indonesia agar lebih mudah difahami.
   
3. Silahkan langsung masuk/login dengan menggunakan username/nama pengguna sertapassword/sandi gmail anda ( akun email anda bisa untuk login ke blogger).
   
   
4. Isilah formulir yang ada :
   1. Nama tampilan : isi dengan nama yang ingin tampil pada profile blog anda.
   2. Jenis Kelamin : pilih sesuai dengan jenis kelamin anda, misal : pria.
   3. Penerimaan Persyaratan : Beri tada ceklis sebagai tanda anda setuju dengan peraturan yangtelah di tetapkan oleh pihak blogger. Saran: sebaiknya anda membaca terlebih dahulu persyaratan yang ada agar anda tahu dan mengerti apa yang boleh dan tidak diperbolehkan ketika menggunakan layanan blogger.
   4. Klik tanda panah bertuliskan “Lanjutkan”.
      
      
5. Klik tombol “Blog Baru”.
   
   
6. Isilah formulir :
   1. Judul : Isi dengan judul blog yang di inginkan, misal : Coretan sang penghayal
   2. Alamat : isi dengan alamat blog yang di inginkan. Ingat! Alamat ini tidak dapat di edit kembali setelah dibuat, apabila anda ingin serius, maka pilihlah nama yang benar-benar anda inginkan.
   3. Template : pilih template (tampilan blog) yang disukai (ini dapat ganti kembali).
   4. Lanjutkan dengan klik tombol “Buat blog!”.
      
      
   5. Sampai disini blog anda telah berhasil di buat.
7. Untuk menghindari spam filter, sebaiknya anda langsung posting sembarang saja. Klik tulisan “Mulai mengeposkan”.
   
   
8. Isi judul serta artikel. Akhiri dengan klik tombol “Publikasikan”.
   
   
9. Silahkan lihat blog anda dengan klik tombol “Lihat Blog”
10. Selesai.

Disini blog blogger anda sudah jadi, dan anda sudah bisa mempromosikan blog anda ke teman dan orang yang anda kenal, untuk membangun komunitas online.
semoga bermanfaat!

sumber : http://www.coolstuff.me

Kode-kode Warna

Di dalam dunia web/blog, warna itu sangat penting dan sangat berpengaruh terhadap penampilan web/blog. Warna-warna biasanya digunakan untuk background, text, links, table dll. Kalo kombinasi warna pada web/blog kita tidak sesuai, atau tidak enak dipandang mata mata, maka hal itu akan membuat pengungjung web/blog kita menjadi kurang nyaman, dan kemungkinan akan malas untuk mengunjungi blog kita lagi. Tapi karena untuk untuk membuat warna-warna ini harus menggunakan kode-kode warna, maka bagi yang tidak begitu mahir tentang html akan kesulitan untuk mendapatkan kode-kode warna ini.

Nha oleh karena itulah dibawah ini telah aku buat Chart HTML Kode Warna bagi yang tidak tahu atau bagi yg pingin tahu kode-kode warna. Cara penggunaannya cukup mudah, km tinggal klik warna yang kamu pilih, maka kode warnanya akan tampil di kotak "kode warna:". Ok silahkan dicoba.

Kode warna yang terpilih :

Dasar Dasar HTML

Sebuah Web atau Blog tidak bisa lepas dari yang namanya HTML (Hyper Text Mark up Language) karena HTML inilah yang mendasari sebuah web/blog. Walaupun sekarang kita bisa membuat web/blog hanya dengan klak-klik mouse tapi setidaknya kita harus sedikit mengerti tentang dasar-dasar HTML, ya tho?. Dalam tutorial kali ini kita tidak akan membahas tentang semua dasar-dasar HTML tapi kita akan mempelajari tag-tag atau kode-kode penting yang sering digunakan dalam membangun sebuah web/blog misalnya cara membuat link, menampilkan gambar, mengganti warna font, membuat barus baru dll. Ok marikita mulai pelajaranya :

* CARA MEMASUKKAN GAMBAR
kode :
<img src="http://kendhin.890m.com/banner-trik.gif" border="0" height="17" width="90">
keterangan :
yang warna biru adalah lokasi gambar kamu.
height="17" width="90" adalah ukuran lebar dan tinggi gambar
hasil :


* CARA MEMBUAT LINK
Kode :
<a href="http://trik-tips.blogspot.com" >trik blog </a>
Keterangan :
Text warna biru adalah link yang dituju.
Tulisan "trik blog" adalah tulisan yang ditampilkan.
Jika pingin yang dikasih link bukan tulisan melainkan gambar maka ganti tulisan tersebut dengan kode gambar seperti diatas, sehinga kodenya akan seperti ini :
<a href="http://trik-tips.blogspot.com" target="_blank"><img src="http://kendhin.890m.com/banner-trik.gif" border="0" height="17" width="90"> </a>
Jika pingin link yang dituju dibuka dalam window baru maka tambahkan kode target="_blank" setelah kode "http://trik-tips.blogspot.com"
Hasil :
trik blog (dibuka pada window yg sama)
(dibuka pada window baru)

* CARA MENGETENGAHKAN TEXT/GAMBAR
Kode :
<center>text</center>
Keterangan :
Ganti tulisan "text" dengan tulisan yana kamu inginkan, tau bisa juga diganti dengan gambar

* CARA MEMBUAT BARIS BARU
Kode :
<br>
Keterangan :
Tambahkan kode tersebut sebelum objek (text/gambar) yang dinginkan

* MEMBUAT HURUF TEBAL, MIRING DAN BERGARIS BAWAH
Kode :
<b>text</b>
<i>text</i>
<u>text</u>
Hasil :
Tebal
Miring
Garis Bawah

* MEMBERI WARNA TEXT
<font color="#FF0000"> text </font>
<font color="red"> text </font>
Keterangan :
Ganti text yang dicetak tebal dengan warna atau kode warna kesukaanmu.
Hasil :
Merah
biru

* KODE-KODE WARNA

Warna	Kode
	#000000
	#999999
	#FFFFFF
	#FF0000
	#00FF00
	#0000FF
	#FFFF00
	#00FFFF
	#FF00FF
	#9900FF
	#FF6600

Kode2 warna selengkapnya bisa dilihat DISINI

* PENULISAN KARAKTER-KARAKTER KHUSUS
Ada beberapa karakter yang tidak bisa ditulis secara langsung, jika ditulis maka akan hilang atau berubah, jadi untuk menuliskanya harus menggunakan kode-kode tertentu, berikut ini contoh karakter-karakter tersebut :

Karakter	Kode
>	>
<	&lt;
&	&amp;
"	&quot;
(spasi)	&nbsp;

Highlight Author Comment

Highlight Author Comment fungsinya adalah supaya komentar author (pemilik blog) berbeda dengan komentar orang lain . Contohnya bisa dilihat di blog ini. Untuk komentar pemilik blog akan ada bordernya dan ada efek lainnya. Nha berikut ini akan aku beberkan cara untuk membuat Highlight Author Comment ini. Dah siap semuanya ? OK lets dance togather :D

1. Login ke blogger trus ke menu "Layout --> Edit HTML"
2. Beri tanda centang pada kotak "Expand Widget Templates"
3. Copy script berikut ini sebelum kode ]]></b:skin> atau copy ke dalam kode CSS.

.comment-body-author {
background: #E6E6E6; /* Warna Background */
border-top: 1px dotted #223344;border-bottom: 1px dotted #223344;border-left: 1px dotted #223344;border-right: 1px dotted #223344;
margin:0;
padding:0 0 0 20px;
}

4. Kemudian cari kode2 seperti berikut. Mungkin kode yg ada di HTML kamu akan beda, tp walaupun beda usahakan semirip mungkin dengan kode berikut ini :

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
said...
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>
<p><data:comment.body/></p>
</dd>
<b:else/>

<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>

</b:if>

<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

5. Kode yang berwarna merah adalah kode yang harus kamu tambahkan di HTML kamu. Posisinya harus benar, ingat itu.
6. Kalo sudah terus disave template kamu.

Comment author ini berdasarkan profil dari pemilik blog tsb. Jadi supaya efeknya muncul sebelum memberi komentar kamu harus login dulu di blogger. OK.
Oh ya ini bukan untuk komentar dari haloscan lho. Tapi hanya untuk kotak komentar yg dari blogger murni

Membuat Artikel yg Berhubungan (Related Post)

Keuntungan menampilkan "Artikel yang berhubungan" atau "Related Post", "Related Article" adalah para pembaca blog bisa dengan mudah menemukan informasi lain yang masih ada hubungannya dengan artikel yg sedang mereka baca. Contohnya seperti yang ada dibagian akhir dari artikel ini, disitu ada link-link dari artikel yang berhubungan yang berdasarkan pada kategori ato label yang sama. Nha mau tahu cara membuatnya?

Caranya cukup mudah, ikuti langkah2 berikut ini:
1. Login ke blogger Blogger
2. Pilih menu "Layout-->Edit HTML"
3. Beri tanda centang pada kotak "Expand Widgets Template".
4. Kemudian download "SCRIPT INI"
5. Buka file tersebut kemudian copy semua script yang ada didalamnya.
6. Setelah itu cari kode ini <data:post.body/> dan letakkan script tadi dibawahnya. Untuk blog yang ada "readmore"nya biasanya akan terdapat 2 kode. Nha km taruhnya dabawah kode yang pertama.
7. Kalo sudah simpan template km dan lihat hasilnya.

Tambahan:
Setelah jadi, jika kamu ingin merubah tulisan "Related Posts by Categories" maka cari kode tersebut di HTML, trus ganti dengan text/tulisan yg kamu suka.

Mengganti "Older Posts" Dengan Angka

Secara umum, navigasi untuk pindah halaman di blogspot biasanya menggunakan link dengan teks "Older Posts (posting lama)" dan "Newer Posts (posting baru)". Beda dengan wordpress yang navigasinya bisa berbentuk angka sehingga bisa memudahkan untuk loncat beberapa halaman ke postingan yg lama maupun baru.
Nha trik kali ini akan menjelaskan bagaimana cara mengganti link "Older Posts (posting lama)" dan "Newer Posts (posting baru)" menjadi angka seperti gambar di bawah ini


1. Langkah awal tentu saja harus menuju ke desain template anda kemudian ke "Edit HTML"
2. setelah itu cari kode ini ]]></b:skin> kalo sudah ketemu taruh script dibawah ini sebelum kode tersebut

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

3. setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut.

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->

Kalau sudah silahkan dilihat hasilnya.

Cara Membuat Halaman Berbeda Ms word 2010

Bermula dari kesulitan yang saya temui saat belajar membuat ebook untuk menomori halaman berbeda-beda pada sebuah dokumen. Awalnya saya browsing kesana kemari, tanya ke temen online juga tapi belum mengerti karena panduannya kurang bisa dipahami dan aplikasi yang dipakai kebanyakan

 masih ms.office 2007. Memang sih, nggak akan beda jauh kalau yang terbiasa berkutat dengan ms.word. Tapi buat saya hal ini cukup merepotkan. Mengingat saat membuat laporan akhir kuliah dulu, saya membuat satu dokumen dengan file terpisah, misalnya halaman Kata pengantar, daftar isi, daftar istilah dsb menggunakan halaman i,ii, iii, iv dst. menjadi satu file. Kemudian membuat file lagi untuk bagian isi dan menomorinya dengan halaman 1, 2, 3 dst… Belum lagi letaknya tidak selalu di bawah halaman, ada juga yang di atas kanan halaman. Repot pokoknya. Nah, sekarang saya akan membagi sedikit pengetahuan yang saya pelajari selama dua hari terakhir (lama banget  )

Buat yang lagi bikin buku, naskah atau pun laporan dan skripsi semoga posting ini bisa membantu. Langsung aja,ya…

Pertama saya jelaskan dulu di sini bahwa saya membuat contoh 5 halaman, yaitu

1. Pendahuluan,
2. Latar belakang,
3. Permasalahan,
4. Pembahasan dan
5. Kesimpulan.

Kemudian saya ingin membuat no.halaman menggunakan i, ii pada halaman pendahuluan dan latar belakang serta membuat no.halaman 1,2 dst pada halaman permasalahan, pembahasan dankesimpulan.

Letakkan kursor pada akhir halaman latar belakang. Kemudian klik tabpage layout–break–next break seperti berikut

Kalau sudah, periksa apakah section break (next page) sudah berada pada posisinya. Caranya tekan ctrl-shift-* secara bersamaan pada keyboard. Pemberian break akan mengakibatkan spasi enter, jadi atur posisinya seperti semula

Tuh, keliatan kan halaman berikutnya jadi kosong, karena halaman kedua atau halaman permasalahan pindah ke halaman berikutnya lagi. Oleh karena itu cek dengan ctrl+shift+* supaya break(next break) berada pada posisi yang diinginkan. Kalau sudah benar, posisi munculnya kira-kira seperti ini, tergantung panjang paragraf juga.

Kalau sudah seperti di atas, lanjutkan dengan memformat nomor halaman, tab insert–page number–format number. Atur

1. Number format  dengan 1,2,3…
2. Page numbering  pilih continue from previous section,
3. Tekan ok

kemudian lanjutkan dengan pemberian nomor halaman, tab insert–page number–bottom page dan hasilnya nomor halaman akan menjadi urut dari halaman awal hingga akhir. Nah, untuk membuatnya  berbeda antara 2 halaman pertama dan berikutnya. Blok no.halaman tiga (halamanpermasalahan) lalu non aktifkan link to previous, seperti gambar di bawah

Apabila sudah dinonaktifkan, kembali lagi ke insert–page number–format number (halaman no.3 teteap diblok ) ganti page numbering dengan start at dan pilih 1 untuk  memulai halaman pertama.

Langkah selanjutnya tab insert–page number–bottom page,kemudian lihat apakah hasilnya 2 halaman pertama urut kemudian halaman ketiga dimulai dari angka 1 lagi? jika iya, berarti berhasil. Halaman permasalahan yang saya buat menjadi halaman 1.

Sekarang waktunya mengganti nomor halaman di dua halaman pertama yaitu, halaman pendahuluan dan latar belakang diganti dengan angka romawi i dan ii. Caranya, blok nomor halaman 1 di halaman pertama (pendahuluan) dengan mengkliknya saja kemudian ke tabinsert–page number–format number,

1. Ganti number format dengan i,ii,iii…
2. Biarkan page numbering  berada di continue from previous section
3. Tekan ok

Bagaimana hasilnya…. sesuai harapan?  hasil halaman saya sendiri berubah di dua halaman pertama menjadi i dan ii. Halaman berikutnya yaitu permasalahan hingga kesimpulan tetap pada nomor halaman 1-3

Itu hanya contoh saja, intinya pisahkan halaman dengan break dan atur number format serta link previous… Semoga bisa membantu dan bermanfaat, ya.

sumber: http://yahuuu.wordpress.com