Garis bawah pada link bagi sebagian blogger itu kurang sedap untuk di pandang, jika Agan termasuk yang seperti itu maka bisa mencoba tutorial ini.
Sehingga nantinya semua link yang akan tampil tidak lagi memiliki garis bawah. Berikut caranya :
1. Masuk ke Template. Klik Edit HTML.
__Pilih lanjutkan.
2. Carilah kode ]]></b:skin>
__Pakai CTRL F untuk menemukannya.
3. Lalu tambahkan kode berikut di atas kode tadi.
a:link {text-decoration: none}
a:visited {text-decoration: none}
a:active {text-decoration: none}
4. Simpan Template. Selesai.
Tampilkan postingan dengan label ILMU LINK. Tampilkan semua postingan
Tampilkan postingan dengan label ILMU LINK. Tampilkan semua postingan
Kamis, 11 Oktober 2012
Kamis, 20 September 2012
Cara Membuat Jump Menu Pop Up
Demo nya bisa Agan klik di sini. Coba Agan klik satu per satu.
Bagaimana sudah lihat ??
Agan bisa gunakan ini untuk memasang foto dagangan (jika punya dagangan), atau koleksi foto Award, atau kumpulan foto lainnya. Style ini tentunya memberikan daya tarik tersendiri.
Jika Agan tertarik, Agan cukup salin kode ini :
<SCRIPT language="JavaScript">
/*
Script posted and featured on JavaScript Kit
http://ketagihanbaca.blogspot.com/
*/
function display_image(form) {
selectionname = form.imagename.options[form.imagename.selectedIndex].text;
selection = form.imagename.options[form.imagename.selectedIndex].value;
PreView = window.open("", "Preview", "toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,copyhistory=0,width=350,height=465");
PreView.document.open();
PreView.document.write("<HTML><HEAD>");
PreView.document.write("<TITLE>Preview</TITLE>");
PreView.document.write("</HEAD><BODY BGCOLOR=FFFFFF TEXT=000000>");
PreView.document.write("<FORM><CENTER><B><FONT SIZE=+1>" +
selectionname + "</FONT></B><HR>");
PreView.document.write("<IMG HSPACE=0 VSPACE=0 " +
"SRC='" + selection + "'>");
PreView.document.write("<HR><FORM><INPUT TYPE='button' VALUE='Close' " +
"onClick='window.close()'></FORM>");
PreView.document.write("</CENTER>");
PreView.document.write("</BODY></HTML>");
PreView.document.close();
}
</SCRIPT>
<FORM>
<select NAME="imagename" onChange="display_image(this.form)">
<option value="URL Foto 1" SELECTED>Judul 1
<option value="URL Foto 2">Judul 2
<option value="URL Foto 3">Judul 3
</select>
</FORM>
<div align="left">
<span style="font-family: arial; font-size: xx-small;">by </span><span style="font-size: xx-small;"><a href="http://ketagihanbaca.blogspot.com/">ketagihan baca</a></span></div>
</br>
Perhatikan :
Ganti tulisan URL Foto 1 - 3 dengan URL foto Agan.
Ganti tulisan Judul 1 - 3 dengan Judul nya.
Untuk menambah foto, Agan tinggal tambahkan kode berikut :
<option value="URL Foto 4">Judul 4
Pasang sebelum kode </select>
Selamat mencoba 
Minggu, 16 September 2012
Membuat Pop Up Image Viewer
Apa itu Pop Up Image Viewer ???
Pop Up Image Viewer adalah jendela munculan untuk melihat gambar. Seperti ini contohnya. Coba Agan klik link berikut :
Gambar 1
Bagaimana ?? Agan kaget ?? Maaf deh habis tadi bingung mau pakai gambar mana.
Postingan ini terinspirasi dari web Kent-Tatto (Studio Tatto ternama di Bandung) yang di salah satu menu nya terdapat Pop Up Image Viewer ini. Iseng-iseng mengintip lewat Open Source, akhirnya bisa juga.
Apabila Agan tertarik membuatnya, Agan cukup salin kode berikut.
Gambar 1</a>
<br />
Letakkan script di atas pada menu "HTML" di halaman membuat postingan. Sementara jika Agan hendak membuat lebih dari satu link, maka tinggal tambahkan kode berikut. Begitu seterusnya.
<a href="http://www.blogger.com/blogger.g?blogID=8310555286126623658#" onclick="jkpopimage('alamat gambar', 325, 445, 'Breakfast is served.'); return false">
Gambar 1</a>
<br />
Ganti sederetan angka ini 8310555286126623658 dengan blogID Agan.
Ganti tulisan alamat gambar dengan gambar punya Agan.
Ganti tulisan Gambar 1 dengan judul gambar.
Pop Up Image Viewer adalah jendela munculan untuk melihat gambar. Seperti ini contohnya. Coba Agan klik link berikut :
Gambar 1
Bagaimana ?? Agan kaget ?? Maaf deh habis tadi bingung mau pakai gambar mana.
Postingan ini terinspirasi dari web Kent-Tatto (Studio Tatto ternama di Bandung) yang di salah satu menu nya terdapat Pop Up Image Viewer ini. Iseng-iseng mengintip lewat Open Source, akhirnya bisa juga.
Apabila Agan tertarik membuatnya, Agan cukup salin kode berikut.
<script type="text/javascript">
// JK Pop up image viewer script-
// Visit JavaScript free (http://ketagihanbaca.blogspot.com)
// for free JavaScript tutorials and scripts
// This notice must stay intact for use
var popbackground="lightskyblue" //specify backcolor or background image for pop window
var windowtitle="Image Window" //pop window title
function detectexist(obj){
return (typeof obj !="undefined")
}
function jkpopimage(imgpath, popwidth, popheight, textdescription){
function getpos(){
leftpos=(detectexist(window.screenLeft))? screenLeft+document.body.clientWidth/2-popwidth/2 : detectexist(window.screenX)? screenX+innerWidth/2-popwidth/2 : 0
toppos=(detectexist(window.screenTop))? screenTop+document.body.clientHeight/2-popheight/2 : detectexist(window.screenY)? screenY+innerHeight/2-popheight/2 : 0
if (window.opera){
leftpos-=screenLeft
toppos-=screenTop
}
}
getpos()
var winattributes='width='+popwidth+',height='+popheight+',resizable=yes,left='+leftpos+',top='+toppos
var bodyattribute=(popbackground.indexOf(".")!=-1)? 'background="'+popbackground+'"' : 'bgcolor="'+popbackground+'"'
if (typeof jkpopwin=="undefined" || jkpopwin.closed)
jkpopwin=window.open("","",winattributes)
else{
//getpos() //uncomment these 2 lines if you wish subsequent popups to be centered too
//jkpopwin.moveTo(leftpos, toppos)
jkpopwin.resizeTo(popwidth, popheight+30)
}
jkpopwin.document.open()
jkpopwin.document.write('<html><title>'+windowtitle+'</title><body '+bodyattribute+'><img src="'+imgpath+'" style="margin-bottom: 0.5em"><br />'+textdescription+'</body></html>')
jkpopwin.document.close()
jkpopwin.focus()
}
</script>
<a href="http://www.blogger.com/blogger.g?blogID=8310555286126623658#" onclick="jkpopimage('alamat gambar', 325, 445, '.'); return false">Gambar 1</a>
<br />
Perhatikan :
Letakkan script di atas pada menu "HTML" di halaman membuat postingan. Sementara jika Agan hendak membuat lebih dari satu link, maka tinggal tambahkan kode berikut. Begitu seterusnya.
<a href="http://www.blogger.com/blogger.g?blogID=8310555286126623658#" onclick="jkpopimage('alamat gambar', 325, 445, 'Breakfast is served.'); return false">
Gambar 1</a>
<br />
Ganti sederetan angka ini 8310555286126623658 dengan blogID Agan.
Ganti tulisan alamat gambar dengan gambar punya Agan.
Ganti tulisan Gambar 1 dengan judul gambar.
Selamat mencoba.
Sabtu, 15 September 2012
Setiap Link Punya Warna Background Masing-Masing
Misal dalam satu artikel di dalamnya terdapat 3 link, maka ke 3 link tersebut memiliki warna background yang sama mengikuti warna body. Tidak bisa berbeda. Tapi coba sorot yang ini.
judul link 1
judul link 2
judul link 3
Untuk membuat warna berbeda ketika link di sorot,Agan cukup salin kode berikut :
<script>
/*
Highlight Link script
By JavaScript Kit (http://ketagihanbaca.blogspot.com/)
Over 400+ free scripts here!
Above notice MUST stay entact for use
*/
function highlight(which,color){
if (document.all||document.getElementById)
which.style.backgroundColor=color
}
</script>
<a href="alamat link" onMouseover=highlight(this,'warna') onMouseout="highlight(this,document.bgColor)">judul link 1</a>
<br />
<a href="alamat link" onMouseover=highlight(this,'warna') onMouseout="highlight(this,document.bgColor)">judul link 2</a>
<br />
<a href="alamat link" onMouseover=highlight(this,'warna') onMouseout="highlight(this,document.bgColor)">judul link 3</a>
<br />
Ganti tulisan alamat link dengan link milik Agan.
Ganti tulisan judul link dengan judul milik Agan.
Ganti tulisan warna dengan background apa saja. Misal "black", "white", "red".
Lakukan cara yang sama setiap Agan hendak membuat link.
Membuat Confirmation Box
Jadi, apabila pengunjung memilih "Cancel", maka box tersebut akan terus muncul sampai ia menutup halaman tersebut dengan Close Tab.
Berniat menanamkannya di blog ?? Agan cukup salin kode berikut.
1. Masuk ke Tata Letak.
2. Klik "Tambahkan Gadget/Widget" di elemen mana saja.
3. Pilih HTML/Javascript.
4. Masukkan kode ini.
<script>
if (!confirm("Do you want to enter this site ?"))
window.location=history.back()
</script>
5. Ganti kalimat Do you want to enter this site ? dengan kalimat buatan Agan.
6. Klik SIMPAN. Lihat hasilnya.
Minggu, 12 Agustus 2012
Membuat Semua Link Terbuka di Tab Baru
Secara default, setelan pada blogspot apabila pengunjung meng-klik salah satu link apa saja, maka halaman yang sedang dia baca berganti atau ketiban dengan halaman baru yang dia klik tadi.
Sementara jika Agan ingin membuat semua link ketika di klik otomatis terbuka pada tab baru, maka ikuti cara berikut. Sangat simpel.
1. Masuk ke Template. Klik Edit HTML.
__Pilih Lanjutkan. Centang expand template widget.
2. Cari kode berikut <head>.
__Gunakan CTRL F untuk memudahkan pencarian.
4. Lalu tambahkan kode berikut di bawah kode <head> tadi.
<base target='_blank'/>
5. SIMPAN. Klik link apa saja untuk melihat hasilnya.
Sementara jika Agan ingin membuat semua link ketika di klik otomatis terbuka pada tab baru, maka ikuti cara berikut. Sangat simpel.
__Pilih Lanjutkan. Centang expand template widget.
2. Cari kode berikut <head>.
__Gunakan CTRL F untuk memudahkan pencarian.
4. Lalu tambahkan kode berikut di bawah kode <head> tadi.
<base target='_blank'/>
5. SIMPAN. Klik link apa saja untuk melihat hasilnya.
Rabu, 08 Agustus 2012
Membuat Link Berubah-Ubah Warna
Secara default, setiap link yang kita sorot (mengarahkan kursor mouse ke link) maka tampilan warna link hanya berubah 1 warna saja.
Nah trik kali ini yaitu menjadikan semua link apabila di sorot, ia akan berubah-ubah warna secara otomatis.
1. Masuk ke Tata Letak.
2. Klik "Tambah Gadget", di mana saja.
__Jangan khawatir, ini hanya "script dalam" tidak akan muncul di tampilan.
3. Pilih HTML/Javascript.
4. Masukkan kode berikut.
5. Klik SIMPAN. Sorot link mana saja untuk melihat hasilnya.
Nah trik kali ini yaitu menjadikan semua link apabila di sorot, ia akan berubah-ubah warna secara otomatis.
1. Masuk ke Tata Letak.
2. Klik "Tambah Gadget", di mana saja.
__Jangan khawatir, ini hanya "script dalam" tidak akan muncul di tampilan.
3. Pilih HTML/Javascript.
4. Masukkan kode berikut.
<script src="http://bloggerblogwidgets.googlecode.com/files/Rainbow_Colors_Way2blogging.js" type="text/javascript"></script>5. Klik SIMPAN. Sorot link mana saja untuk melihat hasilnya.
Jumat, 22 Juni 2012
Cara Membuat Link
Apakah itu Link?
Link adalah sebuah tautan berupa teks yang apabila teks tersebut di klik, maka akan menuju ke halaman yang di tanamkan. Contohnya, apabila Agan ingin baca PROFIL blog ini, coba klik di sini.
Nah, kata "di sini" itu lah yang APABILA Agan klik (sudah di klik 'kan?) maka akan menuju ke halaman profil yang alamat halamannya telah saya tanamkan.
Cara membuatnya sebagai berikut :
1. Pilih dan blok kata yang Agan mau jadikan link. Lihat contoh gambar. Saya memilih dan mem-blok kata "di sini" untuk saya jadikan link.
2. Kemudian klik bacaan "Link" yang ada di tool bar.
3. Maka akan muncul halaman kecil.
__Masukkan alamat halaman yang dituju ke dalam kolom "To what URL should this link go"
Buka dulu di tab baru halaman yang di maksud. Kemudian ambil alamat halamannya (Salin). Alamat sebuah halaman itu posisinya ada di kolom atas layar komputer Anda. Contohnya, alamat tulisan ini adalah :
___Klik "OK" untuk selesai.
Semoga berhasil.
Link adalah sebuah tautan berupa teks yang apabila teks tersebut di klik, maka akan menuju ke halaman yang di tanamkan. Contohnya, apabila Agan ingin baca PROFIL blog ini, coba klik di sini.
Nah, kata "di sini" itu lah yang APABILA Agan klik (sudah di klik 'kan?) maka akan menuju ke halaman profil yang alamat halamannya telah saya tanamkan.
Cara membuatnya sebagai berikut :
1. Pilih dan blok kata yang Agan mau jadikan link. Lihat contoh gambar. Saya memilih dan mem-blok kata "di sini" untuk saya jadikan link.
2. Kemudian klik bacaan "Link" yang ada di tool bar.
3. Maka akan muncul halaman kecil.
__Masukkan alamat halaman yang dituju ke dalam kolom "To what URL should this link go"
Buka dulu di tab baru halaman yang di maksud. Kemudian ambil alamat halamannya (Salin). Alamat sebuah halaman itu posisinya ada di kolom atas layar komputer Anda. Contohnya, alamat tulisan ini adalah :
http://ketagihanbaca.blogspot.com/2012/06/cara-membuat-link.html
___Klik "OK" untuk selesai.
Semoga berhasil.
Langganan:
Postingan (Atom)