Memasang Musik di Blog

9:32 AM |
Untuk memasang musik di blog kita bisa menggunakan SoundCloud.Com yang merupakan hosting gratisan untuk musik dengan berbagai format baik WAVE, OGG, MP2, MP3, AAC, AMR, WMA maupun yang lainnya.



Kita bisa mamasang lagu yang kita upload sendiri ataupun punya orang lain yang di upload di SoundCloud.



Cara memasangnya adalah sbb :



1. Buka http://soundcloud.com/

2. Cari atau upload lagu yang akan kita pasang.



Free Blog Tutorial


3. Jika sudah ketemu lagu yang akan kita gunakan, klik Share.



Free Blog Tutorial


4. Copy Embed Code, Script yang akan kita gunakan di blog.



Free Blog Tutorial


5. Login ke Blogger.com, buka Dasbor - Rancangan - Tambah Gadget - HTML/JavaScript

6. Pastekan kode dari SoundCloud tadi didalamnya dan Save dan lihat hasilnya.



Free Blog Tutorial


Hasilnya seperti dibawah ini :







Semoga bermanfaat.
Read more…

Membuat Efek Bintang Jatuh

2:42 PM |
Setelah sebelumnya telah dibahas Cara Membuat Efek Daun Berjatuhan dan Cara Membuat Efek Pelang pada Link, sekarang kita akan membuat efek bintang yang berjatuhan dari pointer kursor.



Seperti biasa cara membuatnya :



1. Login Blogger.com.



2. Buka Dashboard - Design - Add a Gadget - HTML/JavaScript.







3. Copy script dibawah ini dan pastekan di kotak yang tersedia.



<script src='http://blogefek.googlecode.com/files/bintang.js' type='text/javascript'/>

</script>


4. Simpan template dan lihat hasilnya.



Semoga bermanfaat.





Read more…

Membuat Efek Pelangi Pada Link

1:10 AM |
Postingan tentang efek blog sebelumnya adalah Membuat Efek Daun Berjatuhan, dan sekarang adalah cara membuat efek pelangi pada link. Efek pelangi ini cukup menarik dimana jika pointer mouse berada diatas sebuah link, maka link tersebut akan berubah-ubah warnanya seperti warna pelangi.



Cara membuat efek pelangi adalah sbb :



1. Login di Blogger.com.



2. Buka Dashboard - Design - Add a Gadget - HTML/JavaScript.






Klik untuk memperbesar


3. Copy script dibawah ini dan pastekan di kotak yang tersedia.



<script src='http://blogefek.googlecode.com/files/pelangi.js' type='text/javascript'/>

</script>


4. Save dan lihat hasilnya.



Semoga bermanfaat.





Read more…

Membuat Efek Daun Berjatuhan

10:37 AM |
Penambahan efek-efek untuk mempercantik blog sebenarnya akan menambah berat loading blog. Tetapi ada juga sebagian blogger suka menggunakannya agar blognya tampil lebih indah walaupun loading halaman blognya sedikit berat.



Untuk membuat efek daun yang berjatuhan caranya adalah :



1. Login ke Blogger.com.

2. Buka Dashboard - Design - Edit HTML - Download Full Template (untuk jaga-jaga jika ada masalah).

3. Cari kode </head>, copy script dibawah ini dan letakkan diatas kode </head> dan Save Template.



<script src='http://blogefek.googlecode.com/files/daun.js' type='text/javascript'/>


Hasilnya seperti dibawah ini. Semoga bermanfaat.



Read more…

Membuat Judul Blog Rata Tengah

8:01 PM |
Cara membuat judul blog rata tengah caranya adalah tinggal kita menambahkan tag <center></center> pada judul dan juga bisa kita pakai di description blog.



Misalnya :



Title : <center>Blog Tutorial™</center>

Description : <center>Blogspot Tutorial</center>



Free Blog Tutorial


Maka hasilnya akan seperti dibawah ini.



Free Blog Tutorial


Semoga bermanfaat.
Read more…

Cara Membuat Kotak Komentar Facebook di Blogspot (Update)

10:48 AM |
Semakin populernya situs jejaring sosial seperti facebook, maka banyak juga temen-temen blogger yang memasang form komentar facebook di blogspotnya untuk memudahkan interaksi dengan pengunjung blog selain kotak komentar standarnya blogspot.





Untuk memasang form komentar facebook di blogspot caranya :



1. Buat aplikasi facebook caranya baca disini.



2. Buka Dashboard - Design - Edit HTML - Download Full Template (buat jaga-jaga jika ada masalah) - Centang Expand Widget Templates.



3. Cari kode <b:includable id='status-message'> dengan Ctrl-F, nanti akan ketemu seperti dibawah ini.



</b:includable>

<b:includable id='status-message'>



4. Copy script dibawah ini dan letakkan diatas kode </b:includable>.



<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='fb-root'/>

<script src=' http://connect.facebook.net/en_US/all.js#appId=ID-APLIKASI&amp;xfbml=1'/>

<fb:comments expr:href='data:post.url' num_posts='5' width='400'/>

</b:if>


5. Ganti ID-APLIKASI dengan id-aplikasi yang telah dibuat, angka 5 adalah jumlah komentar yang mau ditampilkan dan angka 400 merupakan lebar dari kotak komentar facebook.



6. SAVE TEMLPATE dan lihat hasilnya.



Semoga bermanfaat.
Read more…

Backlink Gratis Dari Bravenet

2:07 PM |
Bravenet.com merupakan salah satu penyedia layanan hosting dan web Apps gratis yang sudah kawakan yang sudah sangat lama dan masih eksis sampai sekarang. Bayak Aplikasi untuk blog yang disediakannya, seperti buku tamu, forum, blog dan lainnya yang kesemuannya cepat terindex di yahoo, bing dan google.



Untuk mendapatkan backlink gratisannya kita isi buku tamu atau forum-forum yang dipakai oleh bloggger untuk aplikasi di blognya. Cara mencarinya cukup search di google atau bing dengan keyword "guestbook bravenet" akan banyak sekali tersedia buku tamu dari bravenet di sana dan kita cukup meninggalkan komentar dengan menyertakan alamat blog kita untuk mendapatkan backlinknya.



Untuk buku tamu blog ini silakan kunjungi http://pub20.bravenet.com/guestbook/1711561596/ dan tinggalkan komentar disana. Selamat berburu backlink, semoga bermanfaat.
Read more…

Cara Mengetahui Posisi Blog di Mesin Pencarian Google

11:17 PM |
Untuk mengetahui posisi blog di google search, kita dapat menggunakan tool-tool yang bayak disediakan oleh situs-situs tentang SEO (Search Engine Optimization). Salah satu yang sering saya gunakan adalah http://www.seoserp.com. Cara menggunakannya adalah sbb :



1. Kunjungi alamat http://www.seoserp.com/web_tools/google_top_1000_serps_checker.asp.



2. Pilih server google yang akan digunakan, misalnya server Indonesia adalah www.google.co.id, isi keyword yang akan digunakan (misalnya free blog tutorial) dan isikan alamat blog kita (misalnya http://www.klub-abg.com/.



Free Blog Tutorial


3. Hasilnya seperti dibawah ini.



Free Blog Tutorial


Semoga bermanfaat.
Read more…

JPG atau PNG

10:56 PM |
JPG maupun PNG sama-sama format file gambar yang bisa digunakan di blog. Tapi kadang kita suka bingung untuk menentukan sebaiknya format apa yang lebih cocok untuk kita gunakan di postingan blog.



Tips dari saya, untuk upload file gambar yang tidak terlalu banyak warna misalnya screen shot tulisan sebaiknya menggunakan format PNG, karena selain lebih jelas juga ukuran filenya lebih kecil.






File JPG (19 kb)





File PNG (6 kb)


Untuk upload file gambar yang true color seperti foto yang beresolusi tinggi sebaiknya menggunakan file JPG.






File JPG (30 kb)





File PNG (164 kb)


Semoga bermanfaat.
Read more…

Membuat Form Tukeran Link

2:02 PM |
Link Exchange atau yang lebih dikenal dengan tukeran link banyak digunakan oleh temen-temen blogger dengan tujuan untuk meningkatkan jumlah link in yang pada akhirnya bisa meningkatkan Google Pagerank.



Link Exchange juga banyak digunakan untuk saling mempererat persahabatan didunia maya antara sesama blogger. Untuk membuat form link exchange caranya adalah sbb :



1. Buat banner blog anda (baca disini) dan upload ke blogger.com atau album picasa.

2. Login ke blogger.com, buka Dashboard, Layout, Add a Gadget, pilih HTML/JavaScript.

3. Copy dan pastekan script dibawah ini pada form yang tersedia, ganti yang berwarna merah dengan alamat URL blog anda dan URL banner blog anda.



Copy Paste kode dibawah ke blog anda. Link akan tampak seperti: <br />

<a href="http://www.klub-abg.com" title="Blog Tutorial">

<img border="0" src="http://2.bp.blogspot.com/_bL0lqaUaUYg/SejKrLU_ydI/AAAAAAAAAT0/T-RQtAOc_YQ/s320/blogbanner.JPG" /></a>

<br /><br />

<textarea rows="5" cols="20" readonly="readonly" onclick="this.select()"><a href="http://www.klub-abg.com" title="Blog Tutorial">

<img border="0" src="http://2.bp.blogspot.com/_bL0lqaUaUYg/SejKrLU_ydI/AAAAAAAAAT0/T-RQtAOc_YQ/s320/blogbanner.JPG" /></a>

</textarea>




4. Save dan lihat hasilnya seperti gambar dibawah.





Semoga Bermanfaat.
Read more…

User Online dari RadarURL

11:59 PM |
User Online widget banyak digunakan di blog ataupun website untuk mengetahui berapa jumlah user yang sedang membuka halaman suatu blog pada saat itu.



Banyak sekali situs yang menyediakan tool ini, temen-temen bisa googling dengan keyword "user online" pasti akan banyak sekali situs yang menyediakannya. Salah satunya yang menjadi favorit temen-temen blogger adalah RadarURL. Untuk memasangnya di blog caranya :



1. Kunjungi http://radarurl.com/. Pilih lokasi banner yang diinginkan.





2. Copy script yang sudah jadi.





3. Login ke blogger.com, buka Dashboard, Layout, Add a Gadget, pilih HTML/JavaScript.

4. Pastekan script dan Save.





5. Hasilnya seperti gambar dibawah ini.





Semoga bermanfaat.
Read more…

Membuat Banner (Pixel Badge) Secara Online

10:54 AM |
Banyak aplikasi seperti Photoshop, Corel Drow atau Paint bawaannya Windows yang bisa digunakan untuk membuat banner. Tetapi yang sering dipakai oleh sobat blogger adalah banner pixel badge untuk saling bertukar link.



Selain ukurannya yang kecil banner pixel badge tentu saja tidak membuat blog menjadi berat dibandingkan banner-banner yang lebih besar apalagi yang bentuknya animasi.



Kita bisa membuat banner pixel badge secara online, dan banyak situs yang menyediakan tool tersebut. Salah satu yang menjadi faforitku untuk membuat banner link exchange adalah Lucazappa.com.



Untuk membuatnya kunjungi situs http://www.lucazappa.com/brilliantMaker/buttonImage.php, ketikkan kata yang diinginkan dan pilih warna-warna yang disukai. Klik Create, banner sudah jadi dan tinggal di save.





Semoga bermanfaat.
Read more…

Kode Warna HTML

4:23 PM |
Saat kita posting ataupun ingin merubah template, sering kita membutuhkan kode warna HTML untuk warna-warna yang diinginkan. Tabel dibawah ini bisa membantu jika temen-temen blogger memerlukannya.



Klik pada warna yang diinginkan untuk mendapatkan kode warna HTML nya.




Read more…

Kode ASCII

4:16 PM |
Kode ASCII sering kita gunakan untuk membuat kharakter khusus yang tidak tersedia di keyboard. Daftar kode ASCII diantaranya :



































































HTML Code
View
HTML Code
View


HTML Code
View
HTML Code
View
&#33; ! &#95; _ &#157;  &#219; Û
&#34; " &#96; ` &#158; ž &#220; Ü
&#35; # &#97; a &#159; Ÿ &#221; Ý
&#36; $ &#98; b &#160; &#222; Þ
&#37; % &#99; c &#161; ¡ &#223; ß
&#38; & &#100; d &#162; ¢ &#224; à
&#39; ' &#101; e &#163; £ &#225; á
&#40; ( &#102; f &#164; ¤ &#226; â
&#41; ) &#103; g &#165; ¥ &#227; ã
&#42; * &#104; h &#166; ¦ &#228; ä
&#43; + &#105; i &#167; § &#229; å
&#44; , &#106; j &#168; ¨ &#230; æ
&#45; - &#107; k &#169; © &#231; ç
&#46; . &#108; l &#170; ª &#232; è
&#47; / &#109; m &#171; « &#233; é
&#48; 0 &#110; n &#172; ¬ &#234; ê
&#49; 1 &#111; o &#173; ­ &#235; ë
&#50; 2 &#112; p &#174; ® &#236; ì
&#51; 3 &#113; q &#175; ¯ &#237; í
&#52; 4 &#114; r &#176; ° &#238; î
&#53; 5 &#115; s &#177; ± &#239; ï
&#54; 6 &#116; t &#178; ² &#240; ð
&#55; 7 &#117; u &#179; ³ &#241; ñ
&#56; 8 &#118; v &#180; ´ &#242; ò
&#57; 9 &#119; w &#181; µ &#243; ó
&#58; : &#120; x &#182; &#244; ô
&#59; ; &#121; y &#183; · &#245; õ
&#60; < &#122; z &#184; ¸ &#246; ö
&#61; = &#123; { &#185; ¹ &#247; ÷
&#62; > &#124; | &#186; º &#248; ø
&#63; ? &#125; } &#187; » &#249; ù
&#64; @ &#126; ~ &#188; ¼ &#250; ú
&#65; A &#127; ? &#189; ½ &#251; û
&#66; B &#128; &#190; ¾ &#252 ü
&#67; C &#129;  &#191; ¿ &#253; ý
&#68; D &#130; &#192; À &#254; þ
&#69; E &#131; ƒ &#193; Á &#255; ÿ
&#70; F &#132; &#194; Â
&#71; G &#133; &#195; Ã
&#72; H &#134; &#196; Ä
&#73; I &#135; &#197; Å
&#74; J &#136; ˆ &#198; Æ
&#75; K &#137; &#199; Ç
&#76; L &#138; Š &#200; È
&#77; M &#139; &#201; É
&#78; N &#140; Œ &#202; ?
&#79; O &#141;  &#203; Ë
&#80; P &#142; Ž &#204; Ì
&#81; Q &#143;  &#205; Í
&#82; R &#144;  &#206; Î
&#83; S &#145; &#207; Ï
&#84; T &#146; &#208; Ð
&#85; U &#147; &#209; Ñ
&#86; V &#148; &#210; Ò
&#87; W &#149; &#211; Ó
&#88; X &#150; &#212; Ô
&#89; Y &#151; &#213; Õ
&#90; Z &#152; ˜ &#214; Ö
&#91; [ &#153; &#215; ×
&#92; \ &#154; š &#216; Ø
&#93; ] &#155; &#217; Ù
&#94; ^ &#156; œ &#218; Ú




Kode Standar Amerika untuk Pertukaran Informasi atau ASCII (American Standard Code for Information Interchange) merupakan suatu standar internasional dalam kode huruf dan simbol seperti Hex dan Unicode tetapi ASCII lebih bersifat universal, contohnya 124 adalah untuk karakter "|". Ia selalu digunakan oleh komputer dan alat komunikasi lain untuk menunjukkan teks. Kode ASCII sebenarnya memiliki komposisi bilangan biner sebanyak 8 bit. Dimulai dari 0000 0000 hingga 1111 1111. Total kombinasi yang dihasilkan sebanyak 256, dimulai dari kode 0 hingga 255 dalam sistem bilangan Desimal. (Sumber Wikipedia)
Read more…

Memasang Google Maps Dalam Postingan

12:19 PM |
Sering kali kita butuh menyisipkan peta untuk melengkapi suatu postingan yang merujuk pada suatu wilayah. Google maps menyediakan fasilitas peta untuk kita letakkan di halaman blog ataupun didalam postingan.



Caranya adalah sbb :



1. Buka Google Maps.

2. Masukkan keyword kota yang akan kita cari petanya.





3. Klik icon link

4. Copy script HTML dan letakkan didalam postingan.





Contoh scriptnya untuk pete kota Depok, Jawa Barat, ganti yang berwarna merah dengan ukuran yang disesuaikan dengan luas postingan.



<iframe width="300" height="200" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.id/maps?f=q&amp;source=s_q&amp;hl=id&amp;geocode=&amp;q=Depok,+Jawa+Barat&amp;aq=0&amp;oq=depok&amp;sll=-2.550221,118.015568&amp;sspn=51.71349,56.513672&amp;ie=UTF8&amp;hq=&amp;hnear=Depok,+Jawa+Barat&amp;t=m&amp;z=12&amp;ll=-6.39,106.83&amp;output=embed"></iframe><br /><small><a href="http://maps.google.co.id/maps?f=q&amp;source=embed&amp;hl=id&amp;geocode=&amp;q=Depok,+Jawa+Barat&amp;aq=0&amp;oq=depok&amp;sll=-2.550221,118.015568&amp;sspn=51.71349,56.513672&amp;ie=UTF8&amp;hq=&amp;hnear=Depok,+Jawa+Barat&amp;t=m&amp;z=12&amp;ll=-6.39,106.83" style="color:#0000FF;text-align:left">Lihat Peta Lebih Besar</a></small>


Hasilnya seperti dibawah ini.




Lihat Peta Lebih Besar

Read more…

Memasang Video Youtube di Postingan Blog

5:24 PM |
Youtube.com paling banyak digunakan untuk menyimpan video yang langsung bisa dinikmati oleh pengguna internet, walaupun kapasitas uploadnya dibatasi tetapi tetap saja youtube sangat populer karena dimiliki oleh raksasa internet google.com.



Untuk memasang video yang kita upload di youtube atau video apasaja yang ada di youtube caranya mudah cukup klik kanan pada video dan pilih Copy embed html. Paste script di dalam postingan.





Misalnya scriptnya seperti dibawah ini, yang warna merah bisa diubah sesuai ukuran yang diinginkan.



<object style="height: 200px; width: 300px"><param name="movie" value="http://www.youtube.com/v/TdMzxowuHtI?version=3&feature=player_detailpage"><param name="allowFullScreen" value="true"><param name="allowScriptAccess" value="always"><embed src="http://www.youtube.com/v/TdMzxowuHtI?version=3&feature=player_detailpage" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="300" height="200"></object>


Hasilnya seperti dibawah ini :




Read more…

Cara Membuat Sitemap Update

10:01 AM |
Cara membuat sitemap dengan sitemap generator dan diletakkan di menu horisontal caranya adalah sbb :



1. Login ke blogger dan buka dashboard.

2. Klik Pages - New Page - Blank Page.





3. Isi Judul, Copy script dibawah ini, ganti yang berwarna merah dengan alamat blog anda dan letakkan di dalam kotak postingan, klik Publish.



<script style='' src='http://myfreepixell.googlecode.com/files/map2.js'></script><script src='http://www.klub-abg.com/atom.xml?max-results=500&alt=json-in-script&callback=loadtoc'></script>




4. Pada Show Page As pilih Top Tabs, klik Save.





5. Lihat hasilnya, Sitemap sudah muncul di menu horisontal.





Semoga bermanfaat.
Read more…

Membuat Objek Melayang (Floating Object)

5:38 PM |
Membuat objek (Gambar atau tulisan) yang melayang didalam blog yang tidak terpengaruh oleh scorll mouse. Contohnya seperti widget user online di pojok kiri bawah blog ini.





Untuk membuatnya adalah sbb :



1. Login ke Blogger dan buka Edit HTML.

2. Cari kode ]]></b:skin>, copy scrip dibawah ini dan letakkan di atas kode ]]></b:skin>. Kode yang berwarna merah bisa di rubah top (atas) dan right (kanan)



#flying {

position:fixed;_position:absolute;bottom:0px; left:0px;

clip:inherit;

_top:expression(document.documentElement.scrollTop+

document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }


3. Cari kode </body> dan letakkan script di bawah ini diatas kode </body>. Kode yang berwarna merah gantilah dengan alamat gambar yang ingin ditampilkan.



<div id='flying'>

<img src="http://2.bp.blogspot.com/_bL0lqaUaUYg/SejKrLU_ydI/AAAAAAAAAT0/T-RQtAOc_YQ/s320/blogbanner.JPG" /></a>

</div>


Semoga bermanfaat.
Read more…

Memasang Revolver Maps di Blog

11:46 AM |
Revolver Maps banyak digunakan di blog selain untuk mempercantik blog, Revolver Maps juga berfungsi untuk tracer lokasi proxy server yang kita gunakan. Bentuknya macam-macam tetapi yang paling banyak digunakan oleh sobat blogger adalah animasi globe.



Untuk memasangnya kunjungi http://www.revolvermaps.com/?target=setup dan pilih opsi-opsi yang diinginkan. Setelah selesai copy script yang sudah jadi dan letakkan di lokasi blog yang diinginkan.



Intuk informasi lengkapnya kunjungi situsnya di http://www.revolvermaps.com/ dan hasilnya seperti diawah ini.



Read more…

Mendaftarkan Blog ke Banyak Search Engine Dengan Mudah

4:22 PM |
Blogspot secara automatis sudah terdartar di google. Untuk mendaftarkan ke search engine lain seperti bing, Amfibi, Anoox, Exactseek, searchsight dll kita bisa memanfaatkan fasilitas gratis dari Free Web Submission yang akan mendaftarkan blog kita ke beberapa search engine dengan cepat dan tidak ribet. Free Web Submission cuma minta kita memasang bannernya untuk dipasang di blog kita.



Untuk mendaftarkan blog silakan kunjungi http://www.freewebsubmission.com/.





Isi URL blog, Nama, Email dan centang agreement, kilk Submit Your Site dan beres.





Terakhir kita harus pasang bannernya agar blog kita tervalidasi.




Read more…