Membuat Efek Hover Transparan pada Gambar

Anda bisa membuat berbagai macam efek hover pada objek yang anda inginkan di blog. Salah satunya yaitu membuat efek hover transparan pada gambar. Efek hover ini akan nampak apabila anda mengarahkan cursor mouse pada object. Jika cursor mouse berada tepat diatas gambar maka gambar tersebut akan menjadi normal, namun jika anda tidak mengarahkan cursor pada gambar maka gambar tersebut menjadi transparan. Jika sobat ingin tau cara membuat efek tersebut ikuti langkahnya dibawah ini :

1. Login ke Blogger
2. Masuk ke Rancangan --> Edit HTML
3. Carilah kode ]]></b:skin>
4. Lalu tambahkan kode Css berikut ini diatas kode ]]></b:skin>

    a.thumbopacity img {
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    -khtml-opacity: 0.5;
    }
    a.thumbopacity:hover img {
    filter:alpha(opacity=100);
    -moz-opacity: 1.0;
    opacity: 1.0;
    -khtml-opacity: 1.0;
    }

5. Simpan template anda.

Untuk menerapkan efek tersebut pada gambar yang ingin ditayangkan maka masukan kode seperti dibawah ini

    <a href="http://www.ilmu-modern.blogspot.com" class="thumbopacity" >
    <img border="0" src="................................jpg" /></a>

Keterangan:
- Kode berwarna merah andalah adalah url blog
- Kode berwarna hijau adalah url gambar

Continue reading...

3 Widget Animated Bird Twitter Follow untuk Blogger, Keren!

Kali ini Zona Artikel mau share Widget-widget Follow Me on Twitter Blogspot, yang ternyata tidak cuma dalam bentuk gambar diam aja loh. Curi perhatian pengunjung blogmu dengan "Flash Animated Follow Me Twitter Bird' yang bisa gerak-gerak mengundang perhatian pengunjung.

Ada tiga jenis widget animated twitter bird yang bisa dipake, pilih salah satu, salah tiga juga boleh lah. 
Nih contohnya :

Scriptnya :

<object data="http://www.buzzbuttons.com/BUTTON6/twitbutton.swf" height="80" type="application/x-shockwave-flash" width="180"><param name="movie"

value="http://www.buzzbuttons.com/BUTTON6/twitbutton.swf" />

<param name="allowscriptaccess" value="always"/><param name="menu" value="false"/><param name="wmode" value="transparent"/>

<param name="flashvars" value="username=nomore___"/><a href="http://www.gamblinginsider.ca" title="gambling">gambling</a><embed src="http://www.buzzbuttons.com/BUTTON6/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="180" height="80" menu="false" wmode="transparent" flashvars="username=nomore___"></embed></object>

Scriptnya :

<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" width="100" height="100"><param name="movie" value="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=nomore___"></param><a href="http://www.gamblinginsider.ca" title="online gambling insider.ca">online gambling insider.ca</a><embed src="http://www.buzzbuttons.com/BUTTON3/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="100" height="100" menu="false" wmode="transparent" flashvars="username= nomore___"></embed></object>

Scriptnya :

<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf" width="200" height="200"><param name="movie" value="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf"></param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=nomore___"></param><a href="http://www.dreambingo.co.uk/" title="http://www.dreambingo.co.uk/">http://www.dreambingo.co.uk/</a><embed src="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="200" height="200" menu="false" wmode="transparent" flashvars="username=nomore___"></embed></object>

Cara memasang Widget Flash Animated Follow Me Twitter Bird:

1. Masuk ke dashboard > Design/Rancangan > Add/tambah gadget > Pilih HTML/Javascript.
2. Copy salah satu script di atas. Ganti nomore___ dengan nama account twitter-mu.
3. Paste ke dalam kotak HTML/Javascript dan save. Posisikan (drag and drop) gadget ke posisi yang diinginkan lalu save lagi.
4. Done!

Have fun! Widget Animated Flash Twitter Follow Me Bird sudah nongkrong di blogmu.

Continue reading...

Cara Meng-Upload Gambar Jumlah Banyak Pada Postingan Blogger

Image Blogger Upload Wizard memungkinkan Anda untuk meng-upload hingga 5 gambar per satu dan sebagian besar waktu ini sudah cukup, tetapi jika Anda biasanya meng-upload jumlah besar proses dapat menjadi sangat frustasi. Untuk mengganti batas ini ada alternatif dalam Firefox dan DragDropUpload add-on, yang membuatnya sesederhana ini:

1. Download DragDropUpload dan menambahkannya ke Mozilla Firefox, kemudian restart browser.

2. Buka Image Upload wizard di Blogger dan dari kotak dialog drag semua gambar yang Anda inginkan. Dengan melakukan ini mungkin terlihat seperti itu hanya 5 gambar diseret, tapi sisanya berada di field tersembunyi tambahan browser menciptakan.

3. Langkah terakhir tinggal Upload file.

Selesai ... Selamat Meng-Upload !!

Continue reading...

Trik Sederhana Cara Proteksi Gambar di Blog

Rasanya sangat mustahil menghindari seseorang menyalin dan menyimpan gambar yang ada dihalaman blog anda. Hanya dengan melakukan klik kanan dan "save as" siapapun dapat dengan mudah mengambil gambar anda hanya dengan hitungan detik.

Nah disini sebenarnya ada Trik Proteksi sederhana yang bisa anda lakukan untuk menghindari gambar anda di simpan dari tangan-tanagn jahil, dimana hasil dari gambar yang dicoba disimpan nantinya hanya berupa gambar kosong.

Untuk uji coba silahkan klik kanan dan "save as" gambar dibawah ini:


Kode standar dari gambar biasanya seperti ini:

<img width="500" height="375" src="http://ilmu-modern.blogspot.com/contohgambar.jpg"/>

Dengan menerapkan kode sederhana dibawah ini yaitu dengan hanya mengubah artibut src dan penggunaan css style langsung pada gambar maka cara Trik dibawah ini akan menciptakan gambar kosong pada hasil download.

<img style="background-image:url('http://ilmu-modern.blogspot.com/contohgambar.jpg');"
src="data:image/gif;base64,R0lGODlhAQABAIAAAP
///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" width="500" height="375"/>

Ingat! selalu pastikan ukuran size dari gambar harus sama dengan aslinya. Walaupun Trik ini menurut saya tidak 100% akurat paling tidak khan cara ini bisa sedikit mengurangi dari tangan pengguna yang non-teknis :)

Selamat Mencoba ?!!

Continue reading...

Cara Membuat Open New Tab Pada Setiap Link di Blog

Sesuai judul gan ane mau membahas sedikit tentang pengeditan HTML java script pada blog, disini saya akan menambahkan fitur new tab pada setiap link yang ada pada blog kita agar terlihat lebih bervariasi dengan adanya new tab tersebut, langkah pertama yang harus kita lakukan adalah buat blog’y dulu!! hehe kidink gan masa sudah sampai pengeditan HTML belum punya blog.

langsung aja yah gan 

1. buka blognya lalu klik Rancangan 
2. pilih Edit HTML 
3. cari kata kunci <head> 
4. masukan kode script berikut:  <base target=’_blank’ />

di bawahnya setelah kata kunci <head> lalu sebelum kita simpan template ada baik’y kita melihat dulu hasil dari pengeditan yg kita lakukan tadi dengan cara mengklik PRATINJAU setelah benar-benar berhasil klik SIMPAN TAMPLATE  taraaaaa…..apa yang terjadi ternyata berhasil. selamat mencoba yah gan.

Continue reading...

Cara Menghilangkan Link Posting Lama dan Postingan Baru di Blog

Sebagaiman anda ketahui bahwa saat sekarang ini blogger.com masih menggunakan template dengan dua versi, yaitu versi Template Klasik serta versi Template baru. Salah satu perbedaan antara keduanya adalah versi klasik tidak mempunyai fasilitas link “Posting Lama” atau “Older Posts”, dengan di tambahkannya fasilitas tersebut pada template versi baru maka akan lebih mempermudah para pembaca untuk menemukan artikel yang sudah tidak tampil di halaman depan. Ternyata memang “lain orang lain juga keinginan”. Di kala orang lain senang dengan kehadiran fasilitas tersebut, ternyata ada juga yang ingin menghilangkannya, apakah itu anda? pertanyaan selanjutnya apakah fasilitas tersebut bisa di hilangkan atau tidak? jawaban singkat “Bisa”, dan caranya pun terbilang sangat mudah.

Sebelumnya perlu di ketahui bahwa fasilitas link tersebut ada 3 yaitu “Posting baru” atau “Newer Posts”, “Home” atau “Halaman Muka”, serta “Posting Lama” atau “Older Posts”. Mana yang mau anda hilangkan, atau mau semuanya? tentu saja bisa. Untuk menghilangkannya anda hanya menambahkan sedikit kode pada CSS template anda.

Untuk menghilangkan “Posting baru” atau “Newer Posts” :

Cari kode yang mirip seperti ini pada template anda :

#blog-pager-newer-link {float: left;}

Ganti kodenya jadi seperti ini :

#blog-pager-newer-link {display:none;}

Jangan lupa untuk menyimpan template anda

Untuk menghilangkan “Posting Lama” atau “Newer Posts” :

Cari kode yang mirip seperti ini pada template anda :

#blog-pager-older-link {float:right;padding-right:5px;}

Ganti kodenya jadi seperti ini :

#blog-pager-older-link {display:none;}

Jangan lupa untuk menyimpan template anda

Untuk menghilangkan “Home” atau “Halaman Muka” :

Cari kode yang mirip seperti ini pada template anda :

#blog-pager {text-align: center;}

Ganti kodenya jadi seperti ini :

#blog-pager {display:none;}

Jangan lupa untuk menyimpan template anda

Mudah sekali bukan? atau anda masih merasa bingung? OK

Berikut langkah lengkapnya :

1. Login ke blogger dengan ID anda.

2. Klik Rancangan / Template.

3. Klik Edit HTML

4. Klik Download Template Lengkap untuk berjaga-jaga jika terjadi masalah pada template.

Cari kode yang mirip dengan kode di bawah :

#blog-pager-newer-link {float: left;}#blog-pager-older-link {float:right;padding-right:5px;}#blog-pager {text-align: center;}

Hapus kode di atas, lalu ganti dengan kode di bawah ini :

#blog-pager-newer-link {display:none;}#blog-pager-older-link {display:none;}#blog-pager {display:none;}

5. Terakhir SIMPAN TEMPLATE

Selamat Mencoba !!!

Continue reading...

Cara Agar Postingan Blog Tidak Bisa di Copy

Memang masalah copas telah mnejadi hal yang nungkin dianggap biasa oleh sebagian blogger namun itu juga tergantung dari blogger sendriringin blognya berisi content asli tulisan sobat atau copas, dari blog ini semua tergantung ke diri bloger sendirinamun bagi anda yang tidak ingin contentnya di copas berikut tips n trik nya:

1. silahkan login ke blogger dulu; 

2. Rancangan > pilih Edit HTML;

3. Centang Expand Template Widget;

4. cari code <head> setelah ketemu copy script dibawah dan taruh diatas code <head> 

<script type=”text/javascript”>

if (typeof document.oneselectstart!=”undefined”)

{document.oneselectstart=new funcion (“return false”);

}

elsedocument.onmousedown=new funcion (“return false”);

document.onmouseup=new funcion (“return true”);}

</script>

5. Terakhir SIMPAN

Continue reading...

Cara Membuat Efek Zoom Gambar saat Dilalui Kursor

Cara Membuat Efek Zoom Gambar saat Dilalui Cursor. Pernahkah sobat melihat gambar membesar sendiri ketika disentuh cursor ? Apa ? Gak Pernah ? Sama Donk !! hehehe ... Kali ini Zona Artikel akan membagikan informasi tentang Membuat Efek Zoom Gambar saat Dilalui Cursor.

Demo

Bagaimanakah cara membuatnya, langsung saja ke TKP !!
1. Login ke Blogger
2. Pilih Rancangan > Edit HTML > Centang Expand Template Widget.
3. Kemudian letakkan kode berikut diatas kode ]]></b:skin>
    (Gunakan CTRL+F untuk memudahkan pencarian)

.cayunhover img{
-webkit-transform:scale(0.3); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.3); /*Mozilla scale version*/
-o-transform:scale(0.3); /*Opera scale version*/
-webkit-transition-duration: 9.9s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}


.cayunhover img:hover{
-webkit-transform:scale(1.2); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.4); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px blue; /*Kode Css3 untuk efek shadow*/
-webkit-box-shadow:0px 0px 30px blue; /*Untuk safari*/
-moz-box-shadow:0px 0px 30px blue; /*Untuk Mozilla*/
opacity: 1;
}

4. Kemudian Save Template.


Apakah dah selesai ? Belum. Masih ada kode lagi nih yang ketinggalan.
Masukan kode berikut dengan cara Rancangan > Tambah Gadget > Pilih HTML/Java Script

<div class="cayunhover">

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimXx6qZKCIOF7qxifTYXE6w8JvtIqB4voqW9-WbbDlbh4NIyR98zPfTuSqeorNwdRAoKlfb4AeDdZnaHe7-GWhFwTZtrbOrrpsxg96vaFhNNeHrnOJN5Y_rmGrN52n7jvijfYR1sxP9cQ/s1600/blogger-logo%5B2%5D.png"/>

</div>

Ket.

*  https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimXx6qZKCIOF7qxifTYXE6w8JvtIqB4voqW9-WbbDlbh4NIyR98zPfTuSqeorNwdRAoKlfb4AeDdZnaHe7-GWhFwTZtrbOrrpsxg96vaFhNNeHrnOJN5Y_rmGrN52n7jvijfYR1sxP9cQ/s1600/blogger-logo%5B2%5D.png  bisa Anda ganti dengan gambar yang lain.

Ingat !! Jangan sampai lupa di SIMPAN ...
Selamat Mencoba ?!!

Continue reading...

Cara Membuat Efek Meteor Jatuh di Blog

Cara Membuat Efek Meteor Jatuh di Blog. Langsung saja ke TKP !!


1. login blogger
2. Rancangan > Tambah Gadget > pilih HTML/Java Script
3. Lalu copy kode di bawah ini

<script language="javascript">
nd_mode="meteor";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_top";
</script>
<script language="javascript" src="http://www.netdisaster.com/js/mynd.js"></script>

4. Terakhir SIMPAN


Selamat Mencoba ?!!

Continue reading...

Cara Membuat Cursor Diikuti Bintang di Blog

Cara Membuat Cursor Diikuti Bintang di Blog. Ehm.. Memang gak ada habisnya berbicara tentang HTML. Kali ini Zona Artikel akan membagikan informasi tentang Cara Membuat Cursor Diikuti Bintang di Blog, Langsung saja ke TKP !!


1. login blogger
2. Rancangan > Tambah Gadget > pilih HTML/Java Script
3. Lalu, copy kode di bawah ini

<script type="text/javascript" src="http://cayunkatel.googlecode.com/files/rainbows.js"></script>

4. Terakhir SIMPAN

Selamat Mencoba ?!!

Continue reading...

Cara Membuat Back To Top Dengan Double Click di Blog

Tombol Back To Top banyak diidentikkan dengan Tombol widget di pojok kanan bawah yang bervariasi bentuknya. Kali ini Zona Artikel akan membagi informasi tentang Cara Membuat Back To Top Dengan Double Click di Blog. Langsung saja ke TKP !!

1. login ke blogger

2. Rancangan > Tambah Gadget > pilih HTML/Java Script

3. Lalu copy script di bawah ini

<script language="JavaScript1.2">
function dblclick() {
window.scrollTo(0,0)
}
if (document.layers) {
document.captureEvents(Event.ONDBLCLICK);
}
document.ondblclick=dblclick;
</script>

4. Terakhir SIMPAN

Selamat Mencoba ?!!

Continue reading...

Cara Membuat Link dengan Efek Pelangi

Cara Membuat Link dengan Efek Pelangi. Kali ini Zona Artikel akan membagi informasi tentang Cara Membuat Link dengan Efek Pelangi. Bagaimana caranya, langsung sja ke TKP !!

1. login blog

2. Rancangan > Edit HMTL
3. lalu cari kode </body>
4. lalu masukkan kode script dibwah ini diatas kode </body>
    (Gunakan CTRL+F untuk memudahkan pencarian)

<script src='https://sites.google.com/site/vikrymadzblogspotcom/vikrymadz/rainbowlink.js'/>

5. Terakhir SIMPAN


Selamat Mencoba ?!!


Sumber : vikrymadz

Continue reading...

Cara Mudah Membuat Tampilan Blog/Web Maintenance

Cara Mudah Membuat Tampilan Blog/Web Maintenance. Kali ini Zona Artikel akan membagi informasi tentang mengenai Cara Mudah Membuat Tampilan Blog/Web Maintenance. Cara ini bisa sobat pakai bila sobat ingin membuat tampilan maintenance pada blog/web sobat.

Cara ini hanya menggunakan trik CSS dengan penambahan gambar saja kok. Tapi trik ini bisa membuat blog/web sobat seakan-akan seperti sedang maintenance.

Langsung saja pada langkah Cara Mudah Membuat Tampilan Blog/Web Maintenance :

1. login blog

2. Rancangan > Edit HTML

3. taruh kode dibawah ini diatas kode ]]></b:skin>
    (Gunakan CTRL+F untuk memudahkan pencarian)

html {
  height: 100%;
  background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUVBo6exlc2ITbXXXa4em6ZedcTvzVXZgIxQ7_HQ8eNa-hrIqwXzzaS_IbwCGDleyfglll20zSzVKewmUpSmGYQR10atcPeIPUBT02qmzJrTjv2-5XcLL-4gqifNKY17TKxfrLshWDk4Q/s1600/Site-Maintenance.png) no-repeat center 50%;
  margin: 0;
}
body {
  display: none;
}

Ket.

* https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUVBo6exlc2ITbXXXa4em6ZedcTvzVXZgIxQ7_HQ8eNa-hrIqwXzzaS_IbwCGDleyfglll20zSzVKewmUpSmGYQR10atcPeIPUBT02qmzJrTjv2-5XcLL-4gqifNKY17TKxfrLshWDk4Q/s1600/Site-Maintenance.png bisa sobat ganti dengan gambar yang lain.

4. Terakhir SIMPAN


Selamat Mencoba ?!!

Continue reading...

Cara Membuat Efek Link Mengeluarkan Bintang

Cara Membuat Efek Link Mengeluarkan Bintang... ok saya kali ini akan share mengenai efek" lagi. seperti pada judulnya yaitu Cara Membuat Efek Link Mengeluarkan Bintang.

pengen tahou caranya ??? ok deh langsung aja deh sbat simak langkah-langkahnya dan pastinya harus dicoba dong.. heheheheh

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHmM_gfRbD5_9DhRhRIjmZj8wYtIlDSba6fJYE017W9LxdyVrz0VQVkRVC_7iu_MRGp2guHutSkUmuWkDIhT8p03qrRKm2r8eBd-z7j4ElL5uyFZKC02RFpHDmQxepRArA_3V3KXSC_Og/s1600/stars.gif

Sobat Hanya Menambahkan atau menyisipkan kode Di atas ini tepat Disamping kode a:hover {

1. login blog

2. Rancangan > Edit HTML 

3. cari kode a:hover {  tapi  yg berdekatan dengan  a:link{  atau berdekatan dengan a:visited{

    (Gunakan CTRL+F untuk memudahkan pencarian)


4. Hapus kode tersebut, ganti dengan kode berikut

a:hover {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHmM_gfRbD5_9DhRhRIjmZj8wYtIlDSba6fJYE017W9LxdyVrz0VQVkRVC_7iu_MRGp2guHutSkUmuWkDIhT8p03qrRKm2r8eBd-z7j4ElL5uyFZKC02RFpHDmQxepRArA_3V3KXSC_Og/s1600/stars.gif);}

5. Terakhir SIMPAN

Selamat Mencoba ?!!

Continue reading...

Cara Membuat Refresh Otomatis Di Blog

Cara Membuat Refresh Otomatis Di Blog. Setelah beberapa kali saya mengenai tips-tips komputer mulu, kali ini Zona Artikel posting lagi nih, mengenai Tips Blogging.


Refresh pada Blog itu menurut saya penting, seperti pentingnya refresh pada komputer.
Langsung saja ya Cara Membuat Refresh Otomatis Di Blog.


1. login Blog
2. Rancangan > Edit HTML 
3. cari kode ]]></b:skin>
4. lalu taruh kode dibawah ini dibawah kode ]]></b:skin>
    (Gunakan CTRL+F untuk memudahkan pencarian)

<meta content='300' http-equiv='refresh'/>

Ket.
* meta content='300' > pada angka  300  menunjukkan bahwa setiap 300 detik blog/website akan di refresh otomatis oleh web browser yang Anda gunakan.

5. terakhir SIMPAN

Selamat Mencoba ?!!

Continue reading...

Cara Membuat Teks yang Di Block Menjadi Berwarna

Cara Membuat Teks yang Di Block Menjadi Berwarna. ei ei... tips blogging lagi tips blogging lagi... wah wah emang gak ada habisnya ya klo ngomongin soal blog.. hahahaha

Kali ini Zona Artikel akan berbagi informasi mengenai Cara Membuat Teks yang Di Block Menjadi Berwarna.

cara ini sudah saya coba kok dan hasilnya memuaskan, tapi sayangnya hasilnya hanya akan terlihat menggunakan browser mozilla firefox.

Cara Membuat Teks yang DiBlock Menjadi Berwarna

1. login blog

2. buka menu rancangan > edit HTML 
3. lalu cari kode ]]></b:skin>
4. lalu taruh kode dibawah ini tepat diatas kode ]]></b:skin>

::-moz-selection {

background: none;

color: #ff0000;

}

Ket.
* color: #ff0000; > adalah warna teks yang telah di block. Bila sobat ingin menggantinya sobat bisa buka widget KODE WARNA 1 yang ada disini atau KODE WARNA 2 yang ada disini untuk mempermudah pemilihan warnanya.


5. Terakhir SIMPAN

Selamat Mencoba ?!!

Continue reading...

Cara Membuat Gambar Berjajar

Cara Membuat Gambar Berjajar. Kali ini Zona Artikel akan membagi informasi mengenai Cara Membuat Gambar Berjajar. Mungkin dari sobat ada yang lagi mengalami kesulitan untuk membuat gambar agar berjajar seperti ini :

Cara Membuatnya yaitu dengan Rancangan > Tambah Gadget > pilih HTML/Java Script

<table>
<tr>
<td><img border="0" height="100" src="URL GAMBAR 1" width="100" /></td>
<td><img border="0" height="100" src="URL GAMBAR 2" width="100" /></td>
<td><img border="0" height="100" src="URL GAMBAR 3" width="100" /></td>
<td><img border="0" height="100" src="URL GAMBAR 4" width="100" /></td>
<td><img border="0" height="100" src="URL GAMBAR 5" width="100" /></td>
</tr>
</table>

Ket.
* border="0" > untuk mengatur ketebalan garis sebagai bingkai gambar. 
Anda juga bisa mengganti angka  0 dengan keinginan Anda sendiri.
* height="100" > untuk menentukan tinggi gambar. 
Anda juga bisa mengganti angka  100  dengan angka yang lain.
* src="URL GAMBAR 1" > untuk menentukan alamat gambar. 
Anda juga bisa mengganti  URL GAMBAR 1  dengan alamat gambar yang lain. 
* width="100" > untuk menentukan lebar gambar. 
Anda juga bisa mengganti angka  100  dengan angka yang lain.

Ok mudah kan ?!!
Selamat mencoba !!!


Jika Anda bingung, Anda bisa memberikan komentar di bawah ...

Continue reading...

Tips Untuk Blogger Pemula

Masih pemula dalam dunia blog? Ehm..saya ingin berbagi sedikit tips nih tuk para blogger pemula. Walaupun saya sendiri belum termasuk blogger yang hebat, tapi kurang lebih udah tau la gimana dunia blog.. Tips yang saya sharing disini bertujuan untuk meningkatkan alexa rank blog anda tentunya!! Ehm.. 

Berikut tips untuk para blogger pemula: 

1. Gantilah template blog anda dengan template blog yg cantik. 
2. Pasanglah widget yang cantik tapi tidak berat. 
3. Sering-seringlah meminta tukeran link keblog yang punya rank tinggi. Lebih baik anda yang lebih dulu memasang link blog mereka kemudian tinggalkan pesan atau komentar sehingga sang owner blog bisa tau dan dia bisa melakukan backlink. 
4. Sering-seringlah berkunjung dan bercakap-cakap diblog yang memiliki shoutbox yg byk blogger yg online disana.
5. Sering-seringlah menulis artikel sehingga semakin banyak keyword diblog anda. Hal ini bisa menambah pengunjung dari search engine seperti Google. 
6. Janganlah sombong dan jangan lupa mengunjungi blogger yang telah menyempatkan diri untuk mengunjungi blog kita. 
7. Berikan komentar diblog blogger yang lain dan kalo bisa komentar yg diberikan adalah komentar yang berkualitas dan bagus sehingga ada kemungkinan blog kita dikunjungi pembaca yang lain. 
8. Jangan meng-copy paste sembarang tanpa seijin pemilik artikel/blog. Jika owner blog tidak menjawab request kita untuk copy-paste diblognya, copy langsung tapi sertakan link keartikel yang telah dicopy ya!Jangan sampai dicap Blogger Plagiator!! 
9. Percantik sebuah blog dolo. Klo udah cantik dan banyak pengunjung serta rank alexa da naik, baru buat blog yang lain. Hal ini akan menghindarkan kita dari blog yang berantakan.. 
10. Rajin-rajinlah mengunjungi blog ini!! Hehehe... Sekian.. Semoga bermanfaat!! 

Continue reading...

Cara Memasang Widget Alexa Rank

Cara Memasang Widget Alexa Rank. Kali ini saya akan share mengenai Cara Memasang Widget Alexa Rank. Untuk melanjutkan postingan beberapa waktu yang lalu mengenai Pengertian tentang Alexa Rank.

Penilaian alexa rank diambil berdasarkan jumlah visit dan pageviews yang semakin rendah angka alexa maka semakin bagus juga website atau blog tersebut. Lalu bagaimana alexa bisa mengetahui jumlah visit dan pageviews di suatu website atau blog?

Alexa akan mengetahui jumlah kunjungan terhadap suatu web atau blog berdasarkan informasi dari komputer yang browser internetnya memasang alexa toolbar. Lho, kan tidak semua orang memasang alexa toolbar di browser internetnya? nah, justru itulah maka muncul alternatif lain bagi pemilik blog atau web untuk mendapatkan data yang akurat tentang banyaknya kunjungan yaitu dengan memasang alexa widget pada blog atau web yang di miliki. Dengan memasang alexa widget di blog, maka mesin alexa akan mengetahui secara akurat berapa pengunjung serta Page view (halaman yang di lihat) pada web atau blog anda.

 Nah buat sobat yang berminat untuk memasang alexa widget silahkan ikuti tutorial berikut di bawah ini:

Langkah Pertama

1. Klik disini untuk memasang dan memilih widget alexa rank

2. Masukkan alamat url blog sobat di kolom yang tersedia. Contoh: ilmu-modern.blogspot.com (tanpa http://), lalu klik tombol "build widget".

Keterangan: Ada 3 ukuran widget yang bisa anda pilih, copy kode yang ada di sampingnya lalu paste pada notepad atau text editor lainnya. Simpan kode tersebut di notepad sobat untuk nanti di masukan ke blog.

Langkah Kedua

1. Login ke akun blogger sobat.

2. Klik menu rancangan.

3. Klik tambah gadget.

4. Pilih HTML/JavaScript.

5. Paste kode alexa tadi ke dalam kolom yang muncul.

6. Klik tombol SIMPAN.

7. Selesai.

Good Luck ^_^

Continue reading...

Membuat Link begerak bila disentuh kursor mouse

 

Anda pasti pernah melihat diberbagai blog sahabat yang apabila link tersebut tersentuh kursor maka link tersebut akan bergerak.. Nah..sekarang ini, saya akan memandu anda bagaimana cara membuat nya.

Cara ini menggunakan jquery, jadi penggunaan nya sangatlah mudah. so, kita langsung aja ke pembahasan :

• Login ke Blog anda
• Klik Tab Rancangan/Setting
• Kemudian, klik Edit HTML
• Jangan lupa untuk mendownload template anda terlebih dulu sebelum terlalu jauh.
• Ok,, sekarang anda cari kode ini </head>
• Copy kode berikut, dan letakkan diatas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$(&#39;a&#39;).hover(function() { //mouse in
$(this).animate({ marginLeft: &#39;12px&#39; }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});</script>

•  Save.

Selamat mencoba..

Continue reading...