Sabtu, 28 Mei 2011

Membuat Energy Saving Mode Pada Blog

Langsung aja deh, males saya pake pembukaan2 segala. Gini caranya..

1. Login akun blogger anda.
2. Klik layout
3. Klik "Edit HTML"
4. Klik "Download Full Template" untuk back-up.
5. Klik "Expand Template Widget"
6. Cari kode <head> (pakai ctrl+f untuk memudahkan)
7. Paste kode berikut ini di atas kode <head>

<!-- save your energy -->
<script language='javascript' src='http://www.onlineleaf.com/savetheenvironment.js' type='text/javascript'></script>
<!-- save your energy end -->


8. Selesai ...

Promosi Blog ke Berbagai Search Engine dan Directory di Internet

Ada beberapa Search Engine yang saya rekomendasikan dan harus Anda fokuskan untuk promosi Blog Anda yaitu :

a. Google di http://www.google.com/addurl/
b. Yahoo di http://siteexplorer.serach.yahoo.com/submit/
c. MSN di http://search.msn.com/docs/submit.aspx?FORM=WSDD2
d. Auto web submit di http://www.submitexpress.com
e. Freewebsubmission di http://freewebsubmission.com/
f. Mypagerank di http://Mypagerank.com


Layanan lain yang paling banyak digunakan dalam pencarian blog diantaranya adalah GoogleBlogSearch dan BlogDigger.

*Lakukan submit ke OP DMOZ merupakan directory search engine terbesar saat ini. Anda bisa berkunjung ke http://www.dmoz.com/ atau di http://dir.yahoo.com atau http://turnpike.net atau http://littlewebdirectory.com.

*Lakukan promosi ke Blog direktori seperti http://www.technorati.com/, http://www.blogdigger.com/, http://www.digg.com/, http://www.del.icio.us/

*Promosi dengan RSS Feed di http://www.feedburner.com/fb/a/home, anda juga bisa menggunakan RSS submit di http://www.allscoop.com/tools/rss-submit/

*Saling Tukeran Link Feed mampu meningkatkan pembaca feed reader, Anda dapat menggunakan Feed dengan FriendFeed. Gabung aja di http://friendfeed.com/.

*Lakukan ping setiap kali update blog di http://mypagerank.net/service_pingservice_index, http://www.pingomatic.com/

*Sebarkan di Situs Iklan Otomatis di http://www.growurl.com/, http://spyonad.com/ atau di Situs Iklan Mini http://www.iklanbaris.co.id/, http://www.bekas.com/, http://www.iklanmini.com/, http://www.iklanmini.co.id/

*Tukeran link dengan blog PageRank tinggi, ini juga bisa menaikkan PageRank anda.

*Sosial Bookmark seperti Addthis yang banyak pilihan sosial bookmark-nya, atau situs lokal dapat kunjungi lintasberita, infogue atau kafeinfo

Semoga Berhasil ....

Membuat Exchange Link

Exchange Link berguna untuk meningkatkan pagerank blog. Anda bisa memasang kotak exchange link di blog anda (seperti punya saya). Oke, berikut cara untuk membuat kotak exchange link

1. Buat dahulu gambar yg akan menjadi banner anda, setelah anda sudah membuatnya, kemudian anda bisa upload ke www.photobucket.com.

2. Copy direct link gambar yang sudah anda upload.

3. Copy kode html dibawah ini

<center>
<a href="ALAMAT BLOG ANDA"><img border="0" alt="ALAMAT BLOG ANDA" src="URL GAMBAR ANDA/1519394.gif" /></a><br />
<textarea rows="2" cols="15" name="code"><a href="ALAMAT BLOG ANDA"> <img border="0" alt="ALAMAT BLOG ANDA" src="URL GAMBAR ANDA/1519394.gif" /></a>
</textarea><br />
Bertukar link dan Banner. <br />Silahkan copy kode di atas.<br />Saya akan segera link balik.<br />
</center>

4. Jangan lupa masukan url blog anda & url gambar anda pada kode diatas.

5. Klik layout pada halaman dasbor anda, Klik "tambah gadget". Pilih HTML JAVASCRIPT.

6. Masukan kode diatas pada HTML JAVASCRIPT, simpan & selesai ..

Layout Blog dengan Photoshop

Pada artikel ini akan diuraikan langkah-langkah membuat layout blog dengan Photoshop 7.0. Maka pastikan software tersebut sudah terinstal di komputer yang akan digunakan untuk tutorial kali ini. Dan kemudian mengenal lembar kerjanya, yang secara sederhana dapat dilihat disini.

Setiap layer diberi nama dengan maksud memudahkan penunjukan objek dalam editing. Dan pastikan layer yang akan diubah dalam keadaan aktif (diklik atau dipilih).

Berikut langkah-langkah lengkapnya
1 - New Layout
Jalankan program Photoshop dan buat layout.
Klik menu File -> pilih New atau langsung Ctrl+N.

2 - Setting Layout
Pada jendela New yang tampil, setting/ubah bagian Preset Size dengan Custom,
Width 730 pixel, Height 500 pixel, Resolution 72 pixel/inchi, Mode RGB Color
dan Contents White.

3 - Aktifkan Perangkat
Setelah Editing Area baru muncul, pastikan Toolbox, Layers Pallet, Options dan
Rulers aktif. Jika tidak, aktifkan dengan cara klik Menu Windows lalu pilih
Tools, Options dan Layers. Untuk Rules tekan Ctrl+R.

4 - Ganti Warna
Ubah warna Contens yang semula putih menjadi warna biru dengan kode warna #2B4C8D. Caranya klik Set Foreground Color di Toolbox sehingga muncul jendela Color Picker. Disini bisa dipilih warna sesuai selera, namun pada turorial kali ini langsung masukkan kode warna tadi (2B4C8D tanpa ‘#’) pada bagian box bawah yang di depannya bertanda ‘#’ lalu enter atau klik OK.

5 - Warna Background
Aktifkan icon Paint Bucket Tool (gambar ember cat) di Toolbox. Jika tidak terlihat, klik tahan icon Gradient Tool di Toolbox hingga muncul icon dimaksud lalu pilih. Setelah kursor berganti icon Paint Bucket Tool, arahkan ke Editing Area yang masih berwarna putih kemudian klik sekali sampai warna biru menggantikannya. Klik dua kali pada nama layer background untuk mengubah nama layer menjadi ‘back’.

6 - Layer Baru
Buat layer baru berwarna putih dengan cara klik icon Create a New Layer di bagian bawah Layers Pallet. Ubah nama ‘Layer 1′ menjadi ‘main back’ dengan klik dua kali pada Layer 1 dan ketik nama penggantinya.

Kemudian pilih Menu Edit lalu klik Fill untuk memberi warna putih pada ‘main back’. Di bagian contens jendela Fill yang muncul, pilih ‘white’ lalu enter atau OK.

7 - Mengubah Ukuran Objek
Main back akan diperkecil pada bagian kanan dan kirinya sedikit untuk membedakan background atau area body yakni warna biru dan background atau area main yang berwarna putih. Pastikan layer ‘main back’ aktif (klik layer dimaksud untuk mengaktifkannya), lalu tekan Ctrl+T. Tarik sedikit ke bagian dalam kotak kecil resize untuk bagian kanan dan kiri, hingga back biru terlihat. Setelah dirasa cukup, tekan enter untuk mengakhiri resize.

8 - Style Outer Glow
Layer ‘main back’ masih aktif, pilih Menu Layer lalu Layer Style dan klik Outer
Glows. Style ini akan memberikan kesan berkilau pada kanan dan kiri background putih (main back). Jendela Layer Style terbuka, klik kotak kuning di bagian Structure dan pilihlah warna putih lalu OK. Masih di bagian Structure, Opacity 100% dan Noise 0%. Pada bagian Elements, Technique Softer, Spread 2% dan Size 9%.

Berexplorasilah pada setiap bagian untuk mencoba mendapatkan hasil atau tampilan yang berbeda. Setelah yakin dengan hasil akhir tekan enter atau OK.

9 - Retangle Tool
Klik icon Retangle Tool pada Toolbox lalu klik box color di bagian Options untuk menset warna biru muda (D8E3FA). Kemudian buat kotak persegi panjang untuk header dengan cara tempatkan pointer yang berbentuk plus (+) di sudut awal persegi panjang yang akan dibuat, lalu klik tahan dan drag ke ujung sudut persegi panjang. Ukuran lebar bisa sesuai selera. Terlihat di Layers Pallet terbentuk layer baru bernama ‘Shape 1′. Ubah nama layer menjadi ‘h-top’ untuk menandakan kotak header bagian atas.

10 - Duplikasi Layer
Dengan ukuran panjang dan warna yang sama, akan dibuat retangle tool di bagian bawah untuk footer. Bisa saja dilakukan cara yang sama seperti langkah ke-9, namun dengan cara lain yang lebih cepat bisa dilalukan duplikasi layer. Aktifkan layer ‘h-top’ lalu klik tahan dan drag/tarik ke arah icon Create a New Layer di bagian bawah Layers Pallet.

Layer baru bernama ‘Shape h-top copy’ ubah namanya menjadi ‘h-bot’. Pastikan
layer ‘h-bot’ aktif dan pointer ganti bentuk icon Move Tool di Toolbox, lalu
tarik atau pindahkan shape ‘h-bot’ ke bagian bawah pada posisi footer. Perkecil
ukuran tingginya dengan cara Ctrl+T dan resize atas atau bawah secukupnya lalu
akhiri enter atau OK.

11 - Custom Shape Tool
Photoshop menyediakan berbagai bentuk simbol atau ornamen yang bisa digunakan untuk mempercantik layout atau keperluan visual lainnya. Tepatnya menyediakan 12 katagori Custom Shape seperti animal, nature, ornaments dan sebagainya. Koleksi bentuk-bentuk tadi bisa didapat melalui fasilitas icon Custom Shape Tool pada Toolbox.

Klik tahan icon Retangle Tool dan klik icon Custom Shape yang bergambar bintang. Atau cara lain, klik langsung icon Custom Shape ini pada Options dengan catatan icon Retangle Tool aktif.

Pada Options terdapat pilihan ‘Shape’, klik panah dropdown untuk melihat koleksi bentuk Costum Shape. Bentuk tapak kaki pada contoh tutorial ini tidak ditemukan?. Ok, setting standar memang hanya terdapat empat baris dan enam kolom bentuk dari Custom Shape. Untuk menampilkan semua atau 12 katagori Custom Shape caranya klik menu dropdown pada bagian Shape di Options, lalu klik panah kanan kecil yang terdapat pada pilihan bentuk. Kemudian pilih ‘All’ untuk sekaligus menampilkan Custom Shape. Pada pertanyaan yang muncul, jawab OK. Cari dan pilihlah bentuk tapak kaki kanan.

12 - Pengulangan
Sebelum membuat tapak kaki kanan pada editing area, ganti warna pada Color di bagian Options dengan warna biru tua senada background (2B4C8D). Setelah itu drag bentuk tapak kaki kanan pada posisi header area atau di atas ‘h-top’. Ukuran bisa diubah dengan cara Ctrl+T dan resize sesuai keinginan.

Ganti nama ‘Layer 1′ untuk bentuk tapak kaki kanan yang baru saja dibuat dengan nama ‘foot-a’. Lalu duplikasi layer ‘foot-a’ dan ganti nama layer ‘foot-a copy’ menjadi ‘foot-b’. Masih aktifkan layer ‘foot-b’, tarik/pindahkan ke arah kanan bawah pada bagian footer (lihat gambar). Perkecil ukurannya yang disesuaikan tinggi ‘h-bot’.

13 - Text
Membuat text ‘MY BLOG’ sebagai background penghias header. Klik icon Horizontal Type Tool (gambar letter ‘T’) pada Toolbox lalu klik pada Editing Area hingga kursor berganti garis panjang berkedip. Tuliskan MY BLOG lalu akhiri dengan klik icon Move Tool pada Toolbox.

Untuk memformat jenis font, ukuran, warna dan sebagainya, klik lagi gambar
letter ‘T’ pada Toolbox. Lihat bar Options, ubahlah jenis font dan ukuran sesuai
selera dan warna text sama dengan back (2B4C8D) lalu lihat perubahannya (Tutorial menggunakan Verdana uk.166pt).

Pindahkan text ‘MY BLOG’ ke bagian header area dengan mengaktifkan icon Move Tool terlebih dahulu. Kemudian sesuaikan ukurannya atau resize lebar dan tinggi) dengan ukuran ‘h-top’. Setelahnya, buat warna text menjadi sangat tipis (sedikit saja berbeda dari warna h-top) dengan cara klik box Opacity di Layers Pallet yang semula tertera 100%. Ganti angkanya menjadi 3%. Semakin kecil setting angkanya semakin transparant warna objek.

Ulangi langkah di atas untuk membuat judul blog pada header. Tutorial ini menggunakan judul ‘JEJAK LANGKAH’ dengan font Impact uk.30pt, warna #2B4C8D, Opacity 80%.

14 - Simpan File
Sebenarnya menyimpan file untuk layout ini jangan benar-benar dilakukan pada langkah akhir, tapi setiap saat perubahan layout. Kecewa sekali jika susah payah layout dibuat tapi sebelum disimpan terjadi mati listrik atau komputer bermasalah seperti hang misalnya. Simpanlah file dengan format PSD atau standar file Photoshop agar dilain waktu bisa dilakukan perubahan.

Tutorial selanjutnya adalah memotong-motong (slice-cut) layout yang sudah dibuat berdasarkan bagian-bagian blog seperti main, header dan footer.

Memasang ShoutMix

ShoutMix / biasa disebut ShoutBox adalah semacam kotak chatting yang berguna untuk berinteraksi antara pengunjung blog. ShoutMix dapat anda pasang di blog anda, dengan cara sbb:

1. Klik disini

2. Klik Create ShoutBox

3. Lalu isi

User Name: nama user

Choose password: kata sandi

Retype password: ulangi kata sandi di atas

Name: nama anda

Email: alamat email

3. Kemudian Tandai kotak kecil di sampimg kiri I have read and agree

4. Klik Continue

5. Atur style dan warna shoutmix anda di Display



6. Jika sudah, ambil script shoutmix anda di Get Code, dibawah Quick Start





Ukuran shoutmix anda, bisa diubah sesuai keinginan.

7. Setelah meng-copy kode scriptnya, login akun blogger anda, lalu klik '"Tata Letak'

8. Klik 'Tambah Gadget'

9. Pilih gadget 'HTML/Javascript'

10. Masukan script (kode) shoutmix anda dalam konten HTML/Javascript tersebut. (Jangan lupa beri judul)




11. Simpan, selesai ..

Memasang Wibiya Toolbar

Dibagian paling bawah blog ini, ada toolbar seperti gambar berikut:




Itu adalah wibiya toolbar, setelah saya belajar di mas-rahmat blog, akhirnya saya bisa menguasainya. Jika anda ingin memasang toolbar seperti itu, silahkan ikuti langkah-langkah berikut:


Step 1:


1. Klik disini
2. Pada halaman depan, klik Get It now
3. Di halaman Create An Account, isi dengan data yang diminta. Setelah itu, ketik kode captcha yang tampil. Selanjutnya klik tombol Next pada sebelah kiri halaman.
pasangtoolbarwibiya1

Step 2:

Pilih salah satu tema yang anda sukai. Kemudian klik tombol Next.

pasangtoolbarwibiya2

Step 3:
Di halaman Select Your Apps, wibiyatelah menyediakan fitur-fitur lengkap buat anda. Namun jika anda tidak berkenan dengan salah satu aplikasi yang disediakan, anda boleh menghapus aplikasi tersebut. Jika sudah, Klik tombol Next untuk melanjutkan.

pasangtoolbarwibiya3

Selanjutnya anda diharuskan untuk mengisi form berikut. Isi data sesuai yang diminta. Jika sudah, klik tombol Done.
pasangtoolbarwibiya4

Step 4:

Di halaman Add It, pilih icon blogger jika anda mau memasang toolbar wibiya pada blog anda di blogger. Ikuti saja langkah-langkah berikutnya, maka secara otomatis toolbar wibiya akan terpasang melintang Horizontal pada bagian bawah blog anda.

Jika toolbar wibiya tidak terpasang pada bagian bawah blog anda, silahkan copy script toolbar wibiya tersebut, kemudian letakkan sebelum pada halaman Edit Html.

Sempan, selesai ..

Pasang Hit Counter

Hit Counter adalah alat penghitung pengunjung suatu blog, blog anda akan lebih bagus jika dipasang hit couter, kayaak saya gitu. Oke, kebanyakan situs2 penyedia hit counter memerlukan sign up/register utk dapat memasang hit counter tersebut. Tapi kali ini saya akan memberitahu cara memasang hit counter, tanpa register/sign up. Artikel ini saya persembahkan bagi pemula2 blogger^^

Oke, pertama klik disini
2. Pilih model2 hit counter sesuai dengan keinginan anda
3. Lalu isi kotak yg bertulisan Number of digit (max 9) Isi 9 aja
4. Lalu ketik alamat website anda di kotak yang bertulisan Site Url5. Setelah itu ketik email anda di kotak yang bertulisan Email6. Centang tulisan Terms and Conditions.7. Klik Generate Code.8. Lalu akan muncul kode,
9. Nah, copy kode tersebut, lalu pergi ke Tata Letak di blog anda
10. Klik Tambah Gadget11. Pilih HTML / Javascript12. Paste kode hit counter tadi ke tempat pengetikan HTML/Javascript13. Jangan lupa kasih judul
14. Simpan/Save
15. Selesai ..

Mengubah Tulisan Older Post & Newer Post / Posting Lama & Posting Baru


Dibagian paling bawah blog, pasti terdapat tulisan Older Post / Newer Post" atau "Posting Lama / Posting Baru. Tulisan tersebut bisa anda ganti menjadi sesuai keinginanya, misalnya Postingan Lamaku/Postinganku yang terbaru, dll. Setelah belajar di Trik Tips Blogging, saya akhirnya bisa mengubah2 tulisan tersebut. Sekarang saya ingin membagikan pengetahuan tersebut kepada anda.
Caranya begini ..


1. Login, Layout => EDIT HTML
2. BackUp dulu template lama anda
3. Cari kode berikut (Tekan F3 utk memudahkan pencarian)

<data:newerPageTitle/>

4. Ganti kode tersebut dengan tulisan yg anda inginkan
5. Kode diatas untuk mngubah Posting Baru / Newer Post
6. Untuk yang Poting Lama / Older Post, cari kode berikut

<data:olderPageTitle/>

7. Ganti kode tersebut dengan tulisan yg anda inginkan
8. Selesai ..

Membuat Label /Kategori Blog

Artikel-artikel akan terlihat lebih rapi dan bagus kalau diberi label/kategori. Makanya, sebagai blogger yang baik hati, saya akan memberikan penjelasan tentang bagaimana membuat label pada blog. Caranya gampang kok, g perlu pke kode2. Artikel ini saya peruntukan bagi para pemula blogger tentunya. Oh ya, ilmu ini saya pelajarin di Trik Tips Blogging.
Begini caranya..


1. Login akun blogger anda
2. Klik Posting => Edit Post

A. Membuat Label
Pilih atau beri tanda centang pada artikel yang ingin diberi label/dikategorikan. Lalu pada Combo box (yang ada tulisannya "label action") pilih "New Label" lalu beri nama label tersebut.










B. Menghapus Label
Beri tanda centang pada postingan yang ingin dihapus labelnya, trus klik combo box trus klik label dibawah tulisan Remove label

C. Mengganti Label
Hapus dulu label yang ada, kemudian kasih label baru.


Trus bagaimana cara memasang/menampilkannya di blog?
Gini nih caranya:
1. Klik Template => Page Elements
2. Tambahkan page elements kemudian pilih Label. Tinggal anda atur sendiri deh.
3. Selesai ..

Menambahkan Animasi/Gambar Bergerak di Pojok Blog

Gambar-gambar animasi bergerak dipojok blog kita pasti akan mempercantik & memperindah blog kita. Karena itu, kali ini saya akan memberi penjelasan tentang bagaimana cara menambahkan gambar animasi di pojok blog. Ilmu ini diperuntukan bagi para pemula blogger tentunya.
Langsung saja deh, gini caranya:

1. Anda harus membuat gambar animasi, kalau gak mau pusing buat gambar, anda bisa mencari gambar disini.
2. Copy alamat URL dari gambar tersebut, klik kanan pada gambar => Copy image Location
3. Login ke akun blog anda.
4. Layout => Edit HTML
5. Klik Expand Template Widget, lalu copy kode HTML lama anda ke notepad/catatan lain untuk memback up.
6. Letakan kode berikut ini tepat dibawah kode ]]></b:skin>

#trik_pojok {
position:fixed;_position:absolute;bottom:0px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight);
_left:expression(document.documentElement.scrollLeft+
document.documentElement.clientWidth - offsetWidth);

7. kode yang berwarna hijauh menandakan posisi dari gambar, bisa diganti sesuai keinginan anda.
8. Letakan kode berikut ini tepat diatas kode </body>

<div id='trik_pojok'>
<a href='http://blogrone.blogspot.com/' target='_blank' title='Mari NgeBlog!'>
<img border='0' height='175' src='http://www.nonstopgifs.com/animated-gifs/games/games-animated-gif-002.gif' width='150'/></a>
</div>

9. Gantilah http://blogrone.com/ dengan nama blogmu
10. Ganti Mari NeBlog! sesuai keinginan anda. Kata ini muncul pada saat hendak diklik oleh mouse.
11. Ganti 175 dengan tinggi gambar yang sesuai
12. Ganti http://www.nonstopgifs.com/animated-gifs/games/games-animated-gif-002.gif dengan alamat URL sumber gambar
13. Ganti 150 dengan lebar gambar yang sesuai
14. Selesai ..

Mengganti Cursor di Blog

Bosan dengan kursor standar? Disini saya akan jelaskan caranya ganti kursor pada blog sesuai dengan keinginan anda masing-masing.

Langsung saja, begini caranya:

1. Pilih tab “Tata Letak”.
2. Klik “tambah gadget” baik itu berada di bawah, atas atau samping.
3. Pilih “HTML/JavaScript”
4. Copy kode di bawah ini pada tempat pengetikan:

<style type="text/css">body {cursor:url("Alamat Cursor"),default}</style>


5. Ganti kalimat "Alamat Cursor" diatas dengan alamat cursor yang anda tuju.

Rekomendasi alamat free kursor dari saya, klik disini
6. Jika sudah dapat cursornya, klik kanan pada gambar lalu klik 'Copy Image Location'. Kemudian copy dan masukan pada kode diatas, lalu masukan kode tersebut ke konten / tempat penulisan di "HTML / JavaScript".
7. Simpan, selesai ..

Pasang Kotak Dialog

Menambahkan kotak dialog pada saat blog kita dibuka oleh pengunjung adalah salah satu cara untuk membuat blog menjadi lebih menarik. Untuk itu saya akan menjelaskan cara untuk menambahkan kotak dialog di blog. Dan cara ini saya berikan bagi para pemula blogger tentunya.
Oke, begini caranya:

  • Login ke akun blogger anda.
  • Masuk Layout => Edit HTML
  • Back up template lama anda, klik Expand Widget Template dan simpan kode HTML lama anda di notepad / catatan2 lain.
  • Cari kode </head> untuk memudahkan pencarian, tekan F3 lalu paste-kan kode yang akan anda cari.
  • Masukan kode berikut diatas kode </head> :

    <script type="text/javascript">
    var answer = prompt ("Welcome To Blog Knowledge, Bolehkah saya mengetahui namamu?","Regen");
    alert ("Terima kasih ya " + answer + " atas kunjungannya, Jangan Lupa Tinggalkan komentar .. ")</script>
  • Ubah kode yang berwarna hijau sesuai dengan keinginanmu.
  • Selesai ..

Cara Membuat Title Bar Pada Blog Menjadi Bergerak

Langkah - langkahnya hampir sama pada umumnya dengan mengedit template yang ada, yaitu hanya menambahkan kode - kode tertentu untuk dimasukkan dalam template kamu.

Ikuti petunjuk dibawah ini untuk merubahnya :

1. Login ke blog kamu
2. Masuk ke menu "Layout" > "Edit HTML"
3. Centang "Expand Widget Template"
4. Backup Template kamu kedalam notepad
5. Sekarang kamu bisa cari kode <title><data:blog.pageTitle/></title>
6. Rubahlah kode tersebut dengan kode dibawah ini :

<script language='JavaScript'>
var txt="<data:blog.pageTitle/>";
var kecepatan=200;var segarkan=null;function bergerak() { document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
</script>


nb: untuk angka 200 (yang berwarna merah), menunjukkan kecepatan bergeraknya dari judul blog kamu, angka tersebut bisa diganti sesuai yang kamu mau

7. Selesai ..

Cara Membuat Kotak Komentar Berada Dibawah Posting Blog

Langsung aja lah, bingung mau buat pembukanya ..

1. Login ke blogger
2. Pilih Layout, lalu Edit HTML
3. Trus cari kode berikut ini (ctrl+F utk memudahkan pencarian) :

<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</p>
</b:if>

4. Trus ganti kode tersebut dengan kode dibawah ini:

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/> <b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</b:if> </b:if> </p> </b:if>

5. Done. ^_^

Cara memasukan kode HTML kedalam postingan blog

Bagi anda2 yang ingin membuat blog khusus utk membagikan ilmu2 kepada para blogwalking lainya, anda pasti akan menghadapi kesulitan dalam memasuka kode HTML dalam postingan blog. Pada awalnya, saya juga bingung dan kesel banget saat menghadapi hal tersebut. Tapi sekarang anda tidak perlu bingung2 lagi, karena sudah ada tool utk mengatasi hal tersebut.

1. Buka disini.
2. Masukan kode HTML yang akan anda masukan dalam postingan anda.
3. Klik encode.
4. Copy kode yang terdapat dalam kolom (sudah berubah).
5. Paste kode tersebut dalam postingan anda.
6. Selesai, mudah kan?

Cara Membuat Menu Vertikal

Langsung aja deh, begini caranya ..

1. Login ke blogger trus pilih "Layout-->Edit HTML"
2. Cari kode ]]></b:skin> (tekan ctrl+F utk mmudahkan pncarian)
3. Masukan kode berikut sebelum kode ]]></b:skin>

.glossymenu, .glossymenu li ul{
list-style-type: none;
margin: 0;
padding: 0;
width: 185px; /*WIDTH OF MAIN MENU ITEMS*/
border: 1px solid black;
}
.glossymenu li{
position: relative;
}
.glossymenu li a{
background: white url('http://kendhin.890m.com/blog/vertical/blue1.gif') repeat-x bottom left;
font: bold 12px Verdana, Helvetica, sans-serif;
color: white;
display: block;
width: auto;
padding: 5px 0;
padding-left: 10px;
text-decoration: none;
}
.glossymenu li ul{
position: absolute;
width: 190px;
left: 0;
top: 0;
display: none;
}
.glossymenu li ul li{
float: left;
}
.glossymenu li ul a{
width: 180px;
}
.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}
.glossymenu li a:hover{
background-image: url('http://kendhin.890m.com/blog/vertical/blue2.gif');
}

* html .glossymenu li { float: left; height: 1%; }
* html .glossymenu li a { height: 1%; }

3. Kemudian di save.
4. Lalu pergi ke menu "Page Elements"
5. Pilih "Add a Gadget -->HTML/JavaScript" kemudian masukkan kode berikut kedalamnya:

<ul id="verticalmenu" class="glossymenu">
<li><a href="/">Home</a></li>
<li><a href="http://trik-tips.blogspot.com">Trik Blog</a></li>
<li><a href="http://x-template.blogspot.com" >Free Template</a></li>
<li><a href="http://getebook.co.cc">Free Ebook</a></li>
</li>
</ul>

6. Selesai ..

Selasa, 17 Mei 2011

Cara Ganti Icon Blog Pada Address Bar

Berikut ini adalah cara mengganti icon blog pada address bar, sehingga blog kita akan terlihat lebih profesional dan lebih keren.
Bagi anda yang lebih kreatif, anda bisa mendesain icon anda sendiri melalui program-program seperti adobe photoshop atau icon creator, dan lain-lainnya. Namun bagi anda yang tidak sempat membuat icon sendiri, anda bisa mencarinya di google(gambar), imageshack, tinypic, imageshack, photobucket, dll.
Nah, cara untuk memasang icon tersebut cukup mudah sekali, berikut tahap-tahapnya :

Untuk memasang di Blogger :
  • Login ke Blogger
  • Langsung menuju Design/Rancangan => Edit HTML
  • cari kode </head> (tekan ctrl+F utk mencari)
  • Letakkan kode dibawah ini sebelum kode diatas tadi
  • <link href=’http://domain.com/file-gambar-anda.gif‘ rel=’SHORTCUT ICON’/>
  • Ganti tulisan berwarna biru dengan link gambar anda.
  • Save template
Untuk memasang di WordPress :
  • Caranya hampir sama dengan Blogger.
  • Masuk ke Dashboard anda => Appearance => Editor => Header.php
  • Jika Theme anda sudah support Option untuk meletakkan file HTML di header,  langsung saja menuju Theme Option
  • Letakkan kode dibawah ini sebelum </head>
  • <link href=”http://domain.com/file-gambar-anda.gif” rel=”SHORTCUT ICON”/>
  • Ganti tulisan berwarna biru dengan link gambar anda
  • Jika sudah, silakan di save
Semoga blog anda lebih keren dengan memiliki icon sendiri

Membuat Tepi Gambar Bershadow Dengan CSS 3

CSS 3 adalah generasi CSS (Cascading Style Sheet) yang ke 3, banyak keunggulan CSS 3 dibandingkan generasi yang sebelumnya, dan sudah mulai digunakan browser-browser, yaitu diantaranya adalah Mozilla Firefox v 3.6 dan Safari V 3, semoga saja browser-browser lainya menyusul untuk mendukung CSS 3.

Nah sebenarnya topik kita kali ini adalah "Membuat image post blogger berbayang/shadow" dengan menggunakan CSS 3, terlihat seperti gambar di samping kiri. Nah bagaimana caranya? silahkan ikuti langkah-langkah dibawah ini dan buktikan kecanggihan CSS 3.

Setelah Log In ke blogger pada dashboard masuk pada bagian "Design" lalu ke "Edit HTML"

lalu cari code CSS dibawah ini

.post img {
- - -
- - -
}

Note :
  1. Perhatikan saja code yang berwarna merah diatas, karena garis ( - - - ) yang berwarna hijau adalah definisi CSS yang berbeda-beda setiap template
  2. Dan kadang code yang berwarna merah ada tambahanya sehingga seperti ini : .post img, table.tr-caption-container {
Nah kalau sudah ganti code CSS tadi dengan definisi seperti dibawah ini

.post img {
background:#FFFFFF;
border:1px solid $bordercolor;
padding: 7px;
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-goog-ms-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
}

Nah yang diganti adalah code CSS yang berwarna hijau saja.

kalau sudah lalu SAVE deh, dan lihat hasilnya di browser Mozilla v 3.6, Safari V 3 dan Google Chrome.

Sekian semoga bermanfaat.

Mengatasi Judul Widget / Gadget Yang Tidak Boleh Kosong

Pada zaman dahulu kala blogger mengijinkan widget dengan tanpa judul (title) namun sekarang kebebasan itu dikekang oleh blogger, jadi setiap widget/gadget harus ada title atau judulnya. Namun sering kali kita tidak menginginkan gadget/widget tanpa judul, dan jika dipaksa akan muncul pesan perintah error "Required field must not be blank" atau intinya judulnya harus ada dan tidak bisa dilanjutkan bila tanpa judul.

Nah bagaimana mengatasinya?

Caranya cukup mudah kita tinggal mengisi title atau judul gadget dengan code

<!--->

lihat contoh dibawah ini

Dan hanya cukup code diatas tidak perlu tambahan apa-apa lagi.

Sekian deh cukup semoga bermanfaat bagi Anda

Mengganti Background Blog Dengan CSS

Background atau latar belakang pada blog adalah bagian yang paling dasar pada blog, banyak template blog yang sama yang banyak dipakai, maka untuk memberi ciri khas pada blog Anda hal yang paling dasar dan yang paling mudah adalah mengganti warna background pada blog Anda atau dengan tambahan gambar pada background blog Anda.
Kali ini Saya akan menulis tutorial singkat blogspot tentang mengganti background dengan CSS, Mau tau caranya?
perhatikan dibawah ini.

Langkah pertama adalah masuk menu Layout (tata letak) kemudian masuk menu Edit HTML

Lalu cari CSS dari body seperti dibawah ini

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

Kalau mau mencari CSS diatas perhatikan code yang berwarna hijau saja.

perhatikan Code CSS background diatas
$bgcolor adalah variabel definisi, jika Anda ingin menggantinya bisa dengan code warna misalnya ganti dengan warna putih code warnanya adalah : #FFFFFF atau warna hitam #000000. Atau warna yang lain bisa dilihat disini.


Mengganti background blog dengan gambar :

untuk membuat background gambar kita perlu sebuah gambar yang sudah diupload di hosting. Atau Anda bisa mencari di google image search dan copy URL gambarnya.
Kalu sudah tersedia gambar yang mau dijadikan background perhatikan dibawah ini.

background:#FFFFFF url(URL_GAMBAR) ;

URL_GAMBAR ini bisa Anda ganti dengan URL gambar yang Anda pilih misalnya gambar :

back

URLnya :
http://i725.photobucket.com/albums/ww258/anasceria/plays.jpg

Mengantur Background Gambar

background:#FFFFFF url(URL_GAMBAR) no-repeat top left;

no-repeat : berarti gambar didak akan mengulang, Bisa Anda ganti dengan

repeat : Mengulang-ulang gambar
repeat-x : mengulang secara horizontal
repeat-y : Mengulang secara vertikal

top left : Adalah posisi background bisa anda ganti misalnya bottom right

sedikit tambahan jika Anda mau mencari koleksi background

http://www.patterncooler.com/
http://www.bgpatterns.com/
http://patterns.ava7.com/

Nah sekian tutorial mengganti background blog, sedikit semoga membantu Anda.

Cara Pasang Iklan Di Blog (KumpulBlogger)

Anda sudah merasa lama didunia perbloggeran?, Anda merasa tidak mendapatkan apa-apa dari blog selain kepuasan hati?. Jangan salah blogger juga bisa dijadikan sumber penghasilan lho, Antara lain dengan cara memasang iklan di blog Anda dengan jasa periklanan Indonesia kumpulblogger.com, Anda tidak perlu bersusah-susah mencari iklan sendiri tinggal daftar terus pasang scriptnya di blog Anda karena kumpulblogger.com sudah mencarikan iklan untuk Anda jadi Anda tinggal terima beresnya saja.
Apalagi kalau blog Anda pengunjungnya sudah banyak pasti uang akan mengalir dengan sendirinya. Kumpulblogger.com menghitung setiap text link atau banner yang disediakan dengan cara PPC (pay per clik) atau setiap ada pengunjung yang mengklik zona iklan Anda.

Gimana enak gak? mau? ikuti caranya dibawah ini

Langkah pertama yang harus Anda lakukan adalah mendaftar kumpulblogger.com disini dengan cara mengklik link "register now" pada pojok kanan atas di situs kumpulblogger.com

Lalu masukkan alamat email Anda lalu klik tombol "Register" otomatis password untuk Log In sudah ada di email Anda. Anda bisa mengubah passwordnya setelah Anda Log In

Lalu setelah Anda Log In sebelum pasang scriptnya klik link "Tambah Blog" Pada menu Blogger

Isi form sesuai perintahnya lalu klik tombol "Submit"

Kalau sudah klik link "Script Text Advertising untuk Blog anda" dan pilih style iklan yang Anda sukai lalu copy scriptnya dan tempatkan di blog Anda dengan cara masuk menu Layout (tata letak) pada dashboard blogger lalu pada menu Page element (elemen halaman) pilih tempat yang Anda sukai dan klik "add a gadget" lalu pilih "HTML/JavaScript" dan Paste Script tadi yang Anda copy di kumpulblogger.com

Nah selesai

Selamat datang didunia Blogger dan selamat datang didunia periklanan.

Cara Mudah Posting Code HTML

Pasti Anda bingung pada waktu posting Code HTML di blog Anda, pasti yang muncul bukan codenya melainkan hasil dari code HTML-nya, nah untuk yang ingin menulis tentang tutorial blog pasti code HTML banyak diposting, Nah untuk para penulis yang belum tau caranya posting code HTML nih saya kasih caranya.

Caranya cukup mudah, Encode saja code HTML di situs dibawah ini

Nah caranya cukup mudah tinggal taruh code HTML yang ingin di posting lalu klik tombol "Encode", Nah hasil dari Encode itu yang Anda posting di Blog Anda.

Sekian Artikel yang cukup pendek ini semoga dapat membantu Anda!

Berapa Page Rank Blog Kamu

PageRank adalah sebuah algoritma yang telah dipatenkan yang berfungsi menentukan situs web mana yang lebih penting/populer. PageRank merupakan salah satu fitur utama mesin pencari Google dan diciptakan oleh pendirinya, Larry Page dan Sergey Brin yang merupakan mahasiswa Ph.D. Universitas Stanford.
Trus bagaimana cara kerja Page Rank?

Sebuah situs akan semakin populer jika semakin banyak situs lain yang meletakan link yang mengarah ke situsnya, dengan asumsi isi/content situs tersebut lebih berguna dari isi/content situs lain. PageRank dihitung dengan skala 1-10.
Contoh: Sebuah situs yang mempunyai Pagerank 9 akan di urutkan lebih dahulu dalam list pencarian Google daripada situs yang mempunyai Pagerank 8 dan kemudian seterusnya yang lebih kecil.

Banyak cara digunakan search engine dalam menentukan kualitas/rangking sebuah halaman web, mulai dari penggunan META Tags, isi dokumen, penekanan pada content dan masih banyak teknik lain atau gabungan teknik yang mungkin digunakan. Link popularity, sebuah teknologi yang dikembangkan untuk memperbaiki kekurangan dari teknologi lain (Meta Keywords, Meta Description) yang bisa dicurangi dengan halaman yang khusus di desain untuk search engine atau biasa disebut doorway pages. Dengan algoritma ‘PageRank’ ini, dalam setiap halaman akan diperhitungkan inbound link (link masuk) dan outbound link (link keuar) dari setiap halaman web.

PageRank, memiliki konsep dasar yang sama dengan link popularity, tetapi tidak hanya memperhitungkan “jumlah” inbound dan outbound link. Pendekatan yang digunakan adalah sebuah halaman akan diangap penting jika halaman lain memiliki link ke halaman tersebut. Sebuah halaman juga akan menjadi semakin penting jika halaman lain yang memiliki rangking (pagerank) tinggi mengacu ke halaman tersebut.

Dengan pendekatan yang digunakan PageRank, proses terjadi secara rekursif dimana sebuah rangking akan ditentukan oleh rangking dari halaman web yang rangkingnya ditentukan oleh rangking halaman web lain yang memiliki link ke halaman tersebut. Proses ini berarti suatu proses yang berulang (rekursif). Di dunia maya, ada jutaan bahkan milyaran halaman web. Oleh karena itu sebuah rangking halaman web ditentukan dari struktur link dari keseluruhan halaman web yang ada di dunia maya. Sebuah proses yang sangat besar dan komplek.

Mau tahu algoritma page rank?
Dari pendekatan yang sudah dijelaskan pada artikel konsep pagerank, Lawrence Page and Sergey Brin membuat algoritma pagerank seperti di bawah :

Algoritma awal PR(A) = (1-d) + d ( ( PR(T1) / C(T1) ) + … + ( PR(Tn) / C(Tn) ) )

Salah satu alogtima lain yang dipublikasikan PR(A) = (1-d) / N + d ( ( PR(T1) / C(T1) ) + … + ( PR(Tn) / C(Tn) ) )

* PR(A) adalah Pagerank halaman A
* PR(T1) adalah Pagerank halaman T1 yang mengacu ke halaman A
* C(T1) adalah jumlah link keluar (outbound link) pada halaman T1
* d adalah damping factor yang bisa diberi antara 0 dan 1.
* N adalah jumlah keseluruhan halaman web (yang terindex oleh google)

Random surfer model merupakan pendekatan yang menggambarkan bagaimana sesungguhnya yang dilakukan seorang pengunjung di depan sebuah halaman web. Ini berarti peluang atau probabilitas seorang user mengklik sebuah link sebanding dengan jumlah link yang ada pada halaman tersebut. Pendekatan ini yang digunakan pagerank sehingga pagerank dari link masuk (inbound link) tidak langsung didistribusikan ke halaman yang dituju, melainkan dibagi dengan jumlah link keluar (outbound link) yang ada pada halaman tersebut. Rasanya semua juga menganggap ini adil. Karena bisa anda bayangkan apa jadinya jika sebuah halaman dengan rangking tinggi mengacu ke banyak halaman, mungkin teknologi pagerank tidak akan relevan digunakan.

Metode ini juga memiliki pendekatan bahwa seorang user tidak akan mengklik semua link yang ada pada sebuah halaman web. Oleh karena itu pagerank menggunakan damping factor untuk mereduksi nilai pagerank yang didistribusikan sebuah halaman ke halaman lain. Probabilitas seorang user terus mengkilk semua link yang ada pada sebuah halaman ditentukan oleh nilai damping factor (d) yang bernilai antara 0 sampai 1. Nilai damping factor yang tinggi berarti seorang user akan lebih banyak mengklik sebuah halaman sampai dia berpindah ke halaman lain. Setelah user berpindah halaman maka probabilitas diimplemntasikan ke dalam algoritma pagerank sebagai konstanta (1-d) . Dengan mengeluarkan variable inbound link (link masuk), maka kemungkinan seorang user untuk berpindah ke halaman lain adalah (1-d), hal ini akan membuat pagerank selalu berada pada nilai minimum.

Dalam algoritma pagerank yang lain, terdapat nilai N yang merupkan jumlah keseluruhan halaman web, jadi seorang user memiliki probabilitas mengunjungi sebuah halaman dibagi dengan total jumlah halaman yang ada. Sebaagai contoh, jika sebuah halaman memiliki pagerank 2 dan total halaman web 100 maka dalam seratus kali kunjungan dia mengunjungi halaman itu sebanyak 2 kali (catatan, ini adalah probabilitas).

Wahhh Panjang amattt diatass aku juga lum sempet baca semuanya aku copas aja dari om wikipedia.org heheheeee yawdah deh tapi sebelum kamu dapet pagerank kamu harus baca cara daftar di searach engine... kalau sudah mari silahkan cek page rank kamu dibawah



Check Page Rank of any web site pages instantly:




This free page rank checking tool is powered by Page Rank Checker service


Wahh tools diatas juga saya ambil dari prchecker.info jadi selengkapnya kamu bisa kunjungi website tersebut okey...

Read More Versi Kedua

Kali ini Saya mau menulis tentang cara memasang read more versi kedua, opppsss pada perjumpaan kemaren Saya udah nulis yang versi pertema (read more vers pertama).
Saya akan jelaskan perbedaan antara versi pertama dan versi kedua gini yaa kalau versi yang pertama jika kamu klik link read more akan mengarahkan ke halaman baru, nah jika yang versi kedua ini yaitu jika anda klik link read more sisa postingan akan muncul dibawahnya atau dihalaman yang sama tanpa membuka halaman baru.
Nah sekarang anas akan memberikan sedikit ilmu tentang cara membuat read more versi kedua ini ni ikuti yaa

  1. pastikan udah log in ke blogger
  2. Lalu selanjutnya ke menu Layout terus Edit HTML
  3. Jangan lupa Backup Template dan juga Centang "Expand Widget Templates"
  4. Pasang Code dibawah tepat diatas Code </head>
    <script src='http://anas.ku93.googlepages.com/readmore-2.js'
    type='text/javascript'/>
  5. Kemudian kamu Cari code kaya dibawah

    <div class='post-header-line-1'/>
    <div class='post-body entry-content'>
  6. Ganti code diatas hingga menjadi dibawah

    <div class='post-header-line-1'/>
    <div class='post-body entry-content' expr:id='"post-" + data:post.id'>
    <b:if cond='data:blog.pageType == "item"'>
  7. Kemudian setelah anda ganti, dibawah Code diatas ada Code
    <p><data:post.body/></p>
  8. Kemudian dibawah Code diatas tambah Code seperti ini

    <b:else/>
    <style>#fullpost {display:none;}</style>
    <p><data:post.body/></p>
    <span id='showlink'>
    <p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
    </span>
    <span id='hidelink' style='display:none'>
    <p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
    </span>
    <script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
    </b:if>
  9. Kurang lebih Semuanya menjadi seperti dibawah


    <div class='post-header-line-1'/>
    <div class='post-body entry-content' expr:id='"post-" + data:post.id'>
    <b:if cond='data:blog.pageType == "item"'>
    <p><data:post.body/></p>

    <b:else/>
    <style>#fullpost {display:none;}</style>
    <p><data:post.body/></p>
    <span id='showlink'>
    <p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
    </span>
    <span id='hidelink' style='display:none'>
    <p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
    </span>
    <script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
    </b:if>

    Catatan : Tulisan yang tercetak tebal diatas bisa kamu ganti sesuai selera kamu, itu adalah link Read more
  10. Langkah Pertama selesai kemudian Save Templates
  11. Kemudian Ke langkah selanjutnya yaitu ke menu Setting --> Formatting
  12. pada Kotak "Post Tempaltes" isikan Code dibawah ini
    <span id="fullpost">


    </span>
  13. Kemudian Simpan dan langkah Terakhir adalah ..... Hore... Hore.....

Tips:
Ini adalah postingan yang di tempatkan dihalaman muka sebelum Code <span id="fullpost">
Dan disini adalah sisa postingan yang akan muncul jika anda klik link read more
</span>

Sekian yah semoga bermanfaat

Buat Read More Versi Pertama

Yupz apa jadinya jika postingan yang amat banyak menutupi halaman utama kita... waduh-waduh kan jadi kurang menarik tuh apalagi jika ada Iklan di bawah postingan kita yang amat banyak pasti akan menambah ketidak nyamanan mata, weleh lihat deh website besar pasti ada "read more" nya.... hah apa kau gak iri tuh melihat yang kaya gitu..... yawdah deh biar anda tidak penasaran dan pengen buatnya ayo ikuti langkah saya disini key..... perhatikan dibawah


  1. Beranjak ke menu Layout --> Edit HTML
  2. Centang cexbox"Expand Widget tempalte"
  3. Lalu carilah code dibawah (untuk mempermudah tekan ctrl+F untuk kotak pencarian browser)
    <div class='post-header-line-1'/>
  4. Nah dibawah Code diatas ada code yang mirip kaya dibawah, ingat code dibawah berbeda-beda di setiap template blogger


    <div class='post-body entry-content'>

    <p><data:post.body/></p>
  5. Lalu ganti kode diatas dengan kode dibawah ini

    <div class='post-body entry-content'>

    <b:if cond='data:blog.pageType == "item"'>
    <style>.fullpost{display:inline;}</style>
    <p><data:post.body/></p>
    <b:else/>
    <style>.fullpost{display:none;}</style>

    <p><data:post.body/></p>

    <a expr:href='data:post.url'>Selengkapnya....</a>
    </b:if>

    Nah kamu perhatikan saja Code yang berwarna biru karena code yang berwarna merah berbeda-beda di setiap template blogger

    Perhatikan Code diatas Tulisan Selengkapnya.... adalah link untuk menuju ke postingan keseluruhan yang bisa kamu ganti dengan sesuka hati misalnya Read More.... atau Baca Selengkapnya...
  6. Lalu simpan Template
Nah langkah pertama sudah selesai... lalu kita melangkah ke langkah selanjutnya

  1. Lalu Ke menu Setting Lalu pilih menu Formatting
  2. Lalu Cari Kotak Post Template Isikan kode dibawah

    <span class="fullpost">


    </span>
  3. Kemudian Di save
Tips Posting:
Disini tulisan sebelum link Read more....<span class="fullpost">
Disini adalah postingan sisa dari diatas
</span>

Buat Komentar Dibawah Postingan

Seperti yang sudah saya jelaskan dulu disini, itu adalah membuat layanan Kotak komentar dibawah postingan lewat haloscan, tapi kali ini saya akan kasih tau tentang caranya buat kotak komentar dari fitur blogger terbaru yaitu blogger in draft (sini).
Katanya sih kaya begini jika kita belum membuat kotak komentar di haloscan sih bisa... tapi kalau kita sudah buat di haloscan kita harus membuangnya dulu (cara membuang komentar dari haloscan menyusul) yawdah aku akan kasih tau caranya tentang buat komentar ini buat yang belum daftar di haloscan... ayo ikuti petualngan gw di bawah ini.....


  1. Masuk draft.blogger.com ingan draft.blogger.com bukan blogger.com
  2. Terus ke menu Setting ---> Comments kemudian ganti "Comment Form Placement" menjadi "Embedded below post"
  3. Kemudian tekan Save Setting
  4. Lalu ke menu Layout ---> Edit HTML kemudian
  5. Lalu centang "expand widget templates" lalu cari Code dibawah ini

    <p class='comment-footer'>
    <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
    <data:postCommentMsg/></a>
    </p>

  6. Kemudian ganti dengan Code dibawah ini

    <p class='comment-footer'>

    <b:if cond='data:post.embedCommentForm'>

    <b:include data='post' name='comment-form'/>

    <b:else/>

    <b:if cond='data:post.allowComments'>

    <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>

    </b:if>

    </b:if>

    </p>
  7. Lalu Simpan.... dan lihat hasilnya..

Coba kamu cek ada sebuah comments gak di bawah artikel yang kamu posting...

Membuat Kotak Komentar Dibawah Postingan (Haloscan)

Kotak komentar adalah kotak untuk pengunjung penulis komentar terhadap postingan yang anda tulis, bisa kritikan, masukan bahkan pertanyaan-pertanyaan pembaca.
Nah jika di wordpress kotak layanan ini langsung ada dibawah postingan tanpa kita membuat dengan sendirinya, tapi jika di blogger kita harus mengklik link yang menunjukkan kita supaya dapat menuliskan komentar kita dan itu akan membuka satu jendela lagi untuk Comments Box di blogger, Masalahnya adalah pengunjung akan malas memberikan komentar-komentarnya terhadap postingan kita soalnya terlalu ribet.
Jangan khawatir bagi pengguna Blogger ni ada solusinya.
Nah ada suatu Situs yang menawarkan jasa Komentar gratis dan bisa dipasang di bawah postingan kita yaitu Haloscan
Tapi ingat jika kita menggunakan haloscan ini maka komentar kita yang terdahulu sebelum kita mendaftar haloscan akan hilang jadi anda harus merelakan jika mau menngunakan trik ini.
Langkah yang paling penting adalah membackup template anda dulu biar nanti jika ada kesalahan anda bisa mengembalikan template anda seperti semula okey.
langsung saja gw akan kasih tau caranya:





  • Buka website www.haloscan.com

  • Daftarkan diri anda kemudian Log In ke sana

  • Setelah login berhasil maka akan muncul beberapa menu. Pertama-tama pilih menu setting. Didalam menu Setting ada beberapa pengaturan yang harus disi silahkan atur sesuai dengan keinginanmu. Supaya kotak komentarnya muncul dibawah postingan, ganti status "open in popup window" menjadi "off". kamudian simpan.

  • Kemudian ke Menu Template, pilih template Comments Box yang kamu sukai, tapi sekedar tips supaya menarik dan serasi dengan blog kamu maka kamu pilih template yang sesuai dengan warna blog kamu

  • Kemudian beranjak kelangkah selanjutnya yaitu ke menu Instal

  • Kemudian Pilih Blogger Or Blogspot kemudian tekan tombol Next

  • Silahkan kamu Log In ke blogger dan kalau sudah kamu Backup Template kamu, Setelah sudah kamu backup kemudian duplicate template yang sudah kamu download, Yang satu buat jaga-jaga bila gagal, Buat yang belum tau caranya Backup template baca

  • Kemudian kamu Browse template yang kamu backup tadi kemudian klik tombol Upload Blogger Tempalte

  • Jika sudah berhasil klik Download New Template kemudian simpan

  • Jika sudah kembali lagi ke blogger dan pilih menu "Layout-->Edit HTML" kemudian Upload Template yang telah kamu Download dari Haloscan tadi
Jreng... jrengg.... jika sudah berhasil kamu save dan lihat apakah kamu berhasil atau nggak, kalau berhasil Comments Box berada dibawah posting kamu jika belum berhasil kamu usaha aja okey...

Nah Jika pengen menampilkan komentar terakhir di sidebar atau footer gini caranya:
pastikan kamu sudah Log in di haloscan kemudian ke menu Dashboard nha disitu kan ada recent comments trus dibawahnya ada link tulisannya gini "put this widget on your site" nha kamu klik link tersebut, setelah itu dibawahnya akan muncul kotak yang berisi kode. Copy kode tersebut dan pasang di blog kamu

Membuat Multi Blog Blogger

Apakah itu Multi blog di blogger?
Multi blog di blogger adalah anda bisa membuat lebih dari satu blog dengan hanya menggunakan satu acount saja.Tapi jika ada salah satu blog anda yang melanggar TOS blogger atau peraturan yang ditetapkan oleh blogger maka semua blog anda akan ke Banned dan tidak bisa dibuka.
tapi jika anda Ngeblognya aman-aman saja gw kira gak papa n gak bakal ke banned.
oke langsung saja buat anda yang udah tau resikonya gw kasih tau tapi sebenarnya gampang kox tapi hasrat gw untuk menulis yang ini kuat banget jadi gw tulis aja :D

  1. Langkah pertama adalah tentunya Log In ke blogger
  2. setelah sudah Log ini Ke bagian Dashboard
  3. kemudian Create a Blog di bagian atas

  4. Langkah selanjutnya seperti membuat Blog baru okey

Sekian Moga aja Bermanfaat dan sampai jumpa

Dasar Text HTML

Pada perjumpaan dengan saya yang ganteng ini :D wehh kita akan membahas tentang pemakaian dasar Teks HTML yang sering anda gunakan dalam berbagai hal dan berbagai kalangan dimanapun anda berada :D Diantaranya untuk menulis comments di Friendster , memanagement blog dan masih banyak yang lain langsung saja saya akan menerangkan satu per satu tentunya:


Jenis Font :
<font face="times new roman">Jenis FONT</font> =Jenis FONT
<font face="verdana">Tulisan Anda</font> =Tulisan Anda
<font face="Tahoma">Tulisan Anda</font> =Tulisan Anda
<font face="Arial">Tulisan Anda</font> =Tulisan Anda
catatan:
>> Text "Tulisan Anda" adalah teksnya gantilah dengan teks yang anda inginkan
>> Tulisan yang berwarna merah adalah jenis font, gantilah sesuai dengan keinginan anda
>> Jika font yang anda pakai tidak terdapat pada sistem pengunjung WFO anda. Jenis font akan menjadi font standar

Ukuran Huruf:
<font size="-2">Teks </font> =Teks
<font size="-1">Teks </font> =Teks
<font size="+1">Teks</font> =Teks
<font size="+2">Teks</font> =Teks
<font size="+3">Teks</font> =Teks

Warna Huruf:
<font color="#FF0000">Warna MERAH </font>
=Warna MERAH

Jika anda Mau Cari Code warna Html ni http://www.colorschemer.com/online.html

Catatan:
Text yang berwarna merah adalah Code warna yang dapat kamu ganti dengan kode warna sesuai pilihan kamu

Header:
<H1>CONTOH</H1> =

CONTOH


<H2>CONTOH</H2> =

CONTOH


<H3>CONTOH</H3> =

CONTOH


<H4>CONTOH</H4> =

CONTOH


<H5>CONTOH</H5> =
CONTOH

<H6>CONTOH</H6> =
CONTOH


Variasi Teks:
Teks miring : <i>Teks Miring</i> =Teks Miring
Teks Tebal : <b>Teks Tebal</b> =Teks Tebal
Teks bergaris bawah : <u>Teks Bergaris Bawah</u> =Teks Bergaris Bawah
Text Bergaris : <strike>Teks Salah</strike> =Teks Salah

Efek Pada Teks :
Teks berkedip : <blink>Teks Berkedip</blink> =Teks Berkedip
Teks bergerak dari kanan ke kiri : <marquee>Teks Bergerak</marquee> =Teks Bergerak
Teks bergerak dari atas ke bawah : <marquee direction="down" width="300px" height="50px">Teks Bergerak <br> dari atas ke bawah</marquee> =Teks Bergerak
dari atas ke bawah

catatan :
  1. Tanpa value "XXXpx" untuk nilai tinggi dan lebar, sering menyebabkan script tidak berfungsi pada browser Firefox dan Netscape
  2. Ganti "down" dengan "up" untuk arah dari bawah keatas.
  3. Ganti "down" dengan "right" untuk arah dari kiri ke kanan.
  4. Tambahkan scrolldelay="XX" untuk mengatur kecepatan teks
  5. pembatasan area teks bergerak dengan menggunakan width tidak berpengaruh pada browser Firefox dan Netscape
Teks Dengan Link :
Link untuk e-mail : <a href=mailto:mailku@mail.com> e-mailku </a>
Link untuk URL : <a href="URL_adress">situsku.com</a>
Tambahkan "target="_blank" jika anda ingin link tersebut terbuka dengan jendela sendiri.
contoh: <a href="http://tutorial-jitu.blogspot.com"target="_blank">tutorial blog</a>
Posisi Teks :

Teks di kiri: <p align=left>Posisi</p> =
Teks di tengah: <p align=center>Posisi</> =
Teks di kanan: <p align=right>Posisi</p> =

Cara Mengganti Template Blog Blogspot – Merubah – Mengedit

Apa kamu sudah bosan dengan tampilan template blogspot kamu seperti ini, dulu template pada blogspot tidak banyak pilihan, memang sih bisa diganti secara manual dengan mengupload file template yang sudah banyak tersedia di internet, tapi terkadang banyak juga kendala ketika sudah mengupload file template, misalnya saja file template tampil tidak sempurna, bagi yang mahir dengan disain blogspot mungkin tidak masalah, tapi bagi yang masih pemula tentunya itu juga suatu masalah.
Baru baru ini blogspot telah memberikan tambahan menu-menu baru pada pengaturan template di blogspotnya. Berbeda dengan pengaturan template blog blogspot yang lama, pada pengaturan template baru ini sangat memudahkan kamu yang belum begitu lihai mengedit code code html menjadi lebih mudah, tanpa mengutak atik kode kode html pun sudah bisa mendapatkan template blogspot yang bagus. Pada menu pengaturan template baru ini terdapat empat pengaturan menu utama, yaitu : template, background, layout, dan advance. nanti akan saya jelaskan fungsi masing masing menu tersebut.
agar lebih jelas cara mengganti template blog di blogspot ini, ikuti panduan di bawah ini ya,
Silahkan login pada blogspot kamu, dengan mengunjungi www.blogger.com, lalu masukan email dan password kamu
Setelah masuk pada dasboard blogspot, klik pada tombol Rancangan, kemudian klik pada tombol Perancang Template,
cara mengganti template blog blogspot
Sesaat kamudian akan tampil jendela Blogger Template Designer,
Menu template (pada menu ini disediakan template-templat baru yang lebih bagus dari pada template yang lama, dan template ini bisa diedit sesuai dengan keinginan kamu, dan cara mengeditnya pun tidak repot, tinggal klik dan klik)
Coba pilih salah satu template blogspot yang kamu suka,
cara mengganti template blog blogspot
setelah kamu pilih salah satu, dibagian bawah akan muncul jendela preview template yang baru kamu pilih tadi. Pada setiap pilihan template terdapat beberapa sub menu template, misalnya seperti template yang saya pilih ini ada 3 buah sub menu template, kamu bisa memilih salah satu untuk menghasilan template yang sedikit berbeda.
cara mengganti template blog blogspot
Menu Background (pada menu ini digunakan untuk mengganti warna atau gambar latar template anda), pada menu Background Images, klik pada tombol Panah yang berada di samping kanan maka nanti akan muncul beberapa pilihan, begitu juga pada menu Main color theme, kamu juga bisa mengganti sesuai dengan seleramu pada tombol panah itu.
cara mengganti template blog blogspot
Menu Layout (pada menu ini digunakan untuk menganti layout template blog anda, telah disediakan beberapa pilihan template layout yang lebih baru dan lebih bagus)
ada tiga menu pada Layout ini yaitu  Body Layout, Footer layout, Adjust widt.
pada body layout digunakan untuk mengganti layout body utama pada blogspot kamu, silahkan pilih salah satu.
cara mengganti template blog blogspot
pada Footer layout digunakan untuk mengganti model footer layout blogspot kamu, ada 3 macam di sini yaitu footer dengan 1 kolom, footer dengan 2 kolom dan footer dengan 3 kolom.
cara mengganti template blog blogspot
pada Adjust Width digunakan untuk mengatur lebar disain template blogspot kamu, ada dua pengaturan di sini, yaitu pengaturan lebar isi blog, dan pengaturan lebar sidebar blog, silahkan diatur sesukamu, tapi kalau tidak diatur lagi juga tidak apa apa.
cara mengganti template blog blogspot
4. Advance (pada menu digunakan untuk pengaturan template yang lebih detail, misalnya mengganti jenis tulisan / font pada judul, atau pada artikel, dll, menganti warna latar, dan lain), silahkan diotak atik sendiri ya….
cara mengganti template blog blogspot
jika semua sudah disetting pengaturan template nya, yang terakhir adalah klik pada Tombol APPLY TO BLOG  yang berada pada pojok kanan atas.
cara mengganti template blog blogspot
Lalu lihat hasil pengaturan templat yang telah kamu  lakukan tadi dengan mengunjungi blog kamu,
cara mengganti template blog blogspot
bagaimana kawan ? sudah paham dengan penjelasan di atas, Silahkan diotak atik sendiri ya templatenya, diatur warnya background, layout nya, font nya dan lain-lain biar menjadi lebih cantik.
selamat mencoba.

Cara mengisi artikel pada blog

Untuk mengisi artikel atau posting blog di blogspot ikuti langkah-langkah di bawah ini
A. Yang pertama tentu saja login ke bloger dulu ya…… masuk ke alamat situ www.blogger.com

cara membuat blog
tunggu beberapa saat sampai tampil halaman seperti gambar seperti di bawah ini,
cara membuat blog
lalu kamu klik tombol Menu  entri baru, maka akan muncul seperti tampak gambar seperti ini
gambar
C. Supaya lebih jelas lagi saya beri tahu fungsi masing-masing tool bar pada jendela posting ini ya…
0 kolom Judul
1. Model huruf
2. Ukuran huruf
3. format huruf tebal
4. format huruf miring
5. coret huruf (kata)
6. warna huruf
7. memberi warna dibawah huruf
8. menyisipkan link
9. memberikan gambar / upload gambar
10. memotong paragrap (agar pada halaman utama hanya tampil sebagian),
11. format perataan teks, (rata kanan, rata kiri, rata kanan kiri, rata tengah)
12. penomoran
13. bulet
14. blockquote
15. menghapus format
16. penyecek tata bahasa (berlaku untuk bahasa inggris)
17. Untuk memposting dan menyimpan artikel yang telah selesai di ketik
18. untuk menyimpan tanpa memposting artikel dulu
19. melihat tampilan artikel
20. memberikan nama ketegori posting
21. pilihan posting (seperti pilihan mengizinkan pengunjung untuk berkomentar, dan pilihan tidak mengizinkan pengunjung untuk berkomentar)
22. tempat menulis artikel
detail
D. Cara Mengiri Mengisi artikel (posting artikel blog)
Tulis judul artikel pada seperti nomor 1, kemudian tulis artikelmu pada nomor 22, saya sarankan untuk menyelesaikan menulis artikel terlebih dahulu. kalau sudah selesai tinggal memformat artike kamu. Jika ingin mewarna, menebalkan, atau mengatur posisis pertaaan teks, awalilah dengan mengblok kalimat atau  kata yang akan di format.
E.Menyisipkan gambar pada artikel (upload gambar atau foto)

Untuk menyisipkan gambar, klik icon nomor 9 (lihat keterangan gambar  poin C di atas), kemudian nanti akan tampil jendela  Add an Images, pada jendela itu terdapat dua pilihan yaitu polihan Uploaded images dan Web Adress (url). Uploaded images berati menyisipkan gambar dengan cara mengUpload dulu file gambarnya. sedangkan Web Addres berarti menyisipkan gambar dengan cara menuliskan alamat web file gambar (misalnya seperti ini http://ariesaksono.files.wordpress.com/2008/05/masjid-kubah-emas-05.jpg )
pada contoh ini kita gunakan opsi yang pertama, yaitu opsi uploaded images, klik pada tombol Browse.
menyisipkan gambar
setelah kamu klik pada tombol Brows, maka akan tampil jendela File Upload, pilih salah satu gambar yang akan diupload, pada contoh ini yang saya pilih adalah gambar handphone, setelah dipilih klik pada tombol OK
mengambil gambar
setelah kamu klik pada tombol OK, akan tampil proses upload ke server, tunggulah beberapa saat sampai proses uploading selesai.
penempatan gambar
Proses upload gambar telah selesai ditandai dengan munculnya jendela seperti gambar di bawah ini, lanjutkan dengan tombol OK
upload file gambar
setelah kamu klik tombol OK, gambar akan tampil pada kolom posting artikel, hasilnya seperti gambar di bawah ini. Pada bagian bawah gambar terdapat tombo tombol pembantu format gambar, seperti Smal, medium, large, x large itu untuk mengatur besar kecil gambar , sedangkan Left, center, right itu berfungsi untuk mengatur posisi gambar mau diletakkan di kanan, kiri, atau tengah,  dan tombol Remove untuk menghapus gambar
upload file gambar
Jjika gambar ditampilkan terlebih dahulu sebelum mengetik artikel terkadang anda akan keculitan meletakkan posisi kursor pada kolom penulisan artikel. maka untuk mengatasi hal itu klik pada tombol Edit HTML , maka akan tampil jendela formating artikel dalam bentuk dasar HTML,  pada format HTML gambar yang tadinya terlihat akan digantikan dengan bentuk kode (perhatikan gambar di bawah), tulislah artikel di bawah kode gambar  atau di atas kode gambar sesuai dengan kebutuhan kamu.
upload file gambar gagal
Setelah selesai mengetik, klik pada Tombol Compose maka hasilnya akan tampil seperti gambar di bawah ini
upload file gambar berhasil
Jika sudah selesai mengetik artikel dan memberikan gambar  jangan lupa berikan judul artikel, dan juga label artikel. pada contoh di bawah ini judul artikel saya tulis Sony ericson, sedangkan labelnya adalah handphone. jiks sudah diisi klik pada tombol terbitkan Entri
Selesai
Setelah kamu klik tombol terbitkan entri, maka akan muncul tampil seperti gambar di bawah ini, yang menunjukkan bahwa artikel berhasil di posting. untuk melihat hasilnya klik pada tombol  lihat entri.
merubah ukuran
maka hasilnya akan tampak seperti gambar di bawah ini.
kategori posting
Gimana ???? udah jelas apa belum???? Kalau belum silahkan tanya aja…. pada kolom komentar di bawah… nanti akan saya jawab semampu saya… karena saya juga masih dalam taraf belajar heheheh.. :D.

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Grocery Coupons