Senin, 08 Juni 2009

Membuat link dengan button dan gaya tampilan berbeda

Apa maksud saya dengan judul di atas?. Sebenarnya ada banyak tampilan dari link yang biasa di berikan oleh para blogger. Seperti link dengan kedip warna, link yang berubah ukuran ketika mouse diarahkan, link yang berkedip, dll.

Nah pada tulisan kali ini saya akan mencoba memberikan suatu yang berbeda. Contohnya teman-teman semua bisa melihat tombol di salah satu blog saya. Coba kunjungi blog saya yang ini dan klik tombol atau button disana, lalu lihat bagaimana proses tampilanya.

Bagaimana cara membuatnya?...



1. Login ke account blogger kamu, lalu copy paste kode di bawah ini di tempat yang kamu inginkan pada blog kamu, (misal pada posting atau pada sidebar).

<script language="JavaScript">
<!-- Begin

//Animated Window- By Rizwan Chand (rizwanchand@hotmail.com)
//Modified by DD for NS compatibility
//Visit http://www.dynamicdrive.com for this script

function expandingWindow(website) {
var windowprops='width=100,height=100,scrollbars=yes,status=yes,resizable=yes'
var heightspeed = 2; // vertical scrolling speed (higher = slower)
var widthspeed = 7; // horizontal scrolling speed (higher = slower)
var leftdist = 10; // distance to left edge of window
var topdist = 10; // distance to top edge of window

if (window.resizeTo&&navigator.userAgent.indexOf("Opera")==-1) {
var winwidth = window.screen.availWidth - leftdist;
var winheight = window.screen.availHeight - topdist;
var sizer = window.open("","","left=" + leftdist + ",top=" + topdist +","+ windowprops);
for (sizeheight = 1; sizeheight < winheight; sizeheight += heightspeed)
sizer.resizeTo("1", sizeheight);
for (sizewidth = 1; sizewidth < winwidth; sizewidth += widthspeed)
sizer.resizeTo(sizewidth, sizeheight);
sizer.location = website;
}
else
window.open(website,'mywindow');
}
// End -->
</script>
<!-- set up your links, either via text links or form buttons-->

<form>
<input value="cerita cinta" onclick="expandingWindow('http://ceritacinta-di.blogspot.com')" type="button"/>
</form>


2. Ganti cerita cinta dengan nama yang kamu inginkan dan ganti ceritacinta-di.blogspot.com dengan link yang kamu mau.

3. Simpan dan selesai.


Selamat mencoba, salam tips blogger.





Read this | Baca yang ini



Widget by [ Tips Blogger-Tutorial Blogger Pemula ]

3 comments:

www.tutoblogspot.blogspot.com mengatakan...

tampilin donk, hasil dari kode itu ntar gimana...

Blog Herman Pick mengatakan...

wah bner tuh kata www.tutoblogspot.blogspot.com....

tampilin dunk hasil karya.na...??? :D

Bang arie mengatakan...

Contohnya silahkan lihat Disini

Posting Komentar

:)) :)] ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} ~x( :-t b-( :-L x( =))

Untuk menggunakan emotion copy paste kodenya saja, budayakan berkomentar setelah membaca ya .

Note : Harap gunakan nama anda dan jangan menggunakan keyword-keyword tertentu atau komentar anda tidak akan dipublish...