Mengganti Icon Pada URL Website dengan Javascript

icon

Menindak lanjuti tulisan saya sebelumnya *hayah*, mari kita lanjutkan belajar PHP dasar, kali ini sedikit dibumbui dengan Javascript. Kali ini kita akan mencoba mengganti Icon pada URL Website yang akan kita buat dengan icon yang kita inginkan. Pada directory belajarphp, tambahkan folder baru, beri nama gambar, jadi kita akan memiliki folder gambar didalam directory belajarphp (C:\xampp\htdocs\belajarphp\gambar). Folder ini nantinya akan kita gunakan untuk menyimpan file-file gambar (*.jpeg, *.gif, *.png dsb).

Pilih gambar yang ingin anda jadikan sebagai icon pada komputer anda, usahakan yang ukurannya tidak lebih besar dari 200 pixels baik lebar atau tingginya (saya memilih yang berukuran 90×99). Masukkan gambar tersebut ke dalam folder gambar yang telah kita buat sebelumnya (C:\xampp\htdocs\belajarphp\gambar). Lihat gambar anda pada browser, caranya pada URL ketikan http://localhost/belajarphp/gambar/nama-gambar-anda.jpg (saya http://localhost/belajarphp/gambar/it_beastie.jpg).

Masih ingat file hello.php yang pernah dibuat??, buka file itu denganĀ  DW. Tambahkan javascript pada file itu, berikut adalah skrip nya :

document.write(‘<link rel=”SHORTCUT ICON” href=” URL gambar anda”>’);

atau kalau saya seperti dibawah ini

document.write(‘<link rel=”SHORTCUT ICON” href=” http://localhost/belajarphp/gambar/it_beastie.jpg”>’);

Sehingga skrip lengkap file hello.php menjadi seperti dibawah ini:

<html”>
<head>
<title>.: Hello</title>
</head>

<script language=”javascript”>
document.write(‘<link rel=”SHORTCUT ICON” href=” http://localhost/belajarphp/gambar/it_beastie.jpg”>’);
</script>

<body>
<?php
echo “Selamat belajar PHP!! <br/>”;
echo “Hari ini adalah :”;
echo date (‘d/m/Y’);
?>
</body>
</html>

Hasilnya pun akan menjadi seperti tampilan dibawah ini :

icon Selamat mencoba kawanku sekalian :P

credit to : Friendstertalk

10 Responses to Mengganti Icon Pada URL Website dengan Javascript

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s