วิธีการ - เพิ่ม Favicon ใน HTML
เรียนรู้วิธีเพิ่ม favicon ใน HTML
วิธีเพิ่ม Favicon ใน HTML
favicon คือรูปภาพขนาดเล็กที่แสดงถัดจากชื่อหน้าในแท็บเบราว์เซอร์
คุณสามารถใช้รูปภาพใดก็ได้ที่คุณชอบเป็นไอคอน Fav คุณยังสามารถสร้าง favicon ของคุณเองบนเว็บไซต์เช่นhttps://favicon.cc
เคล็ดลับ: favicon เป็นรูปภาพขนาดเล็ก จึงควรเป็นรูปภาพธรรมดาที่มีคอนทราสต์สูง
รูปภาพ favicon จะแสดงที่ด้านซ้ายของชื่อหน้าในแท็บเบราว์เซอร์ ดังนี้:
ในการเพิ่ม favicon ลงในเว็บไซต์ของคุณ ให้บันทึกภาพ favicon ของคุณไปที่ไดเร็กทอรี root ของเว็บเซิร์ฟเวอร์ของคุณ หรือสร้างโฟลเดอร์ในไดเร็กทอรีรากที่เรียกว่า images และบันทึกภาพ favicon ของคุณในโฟลเดอร์นี้ ชื่อสามัญของรูปภาพ favicon คือ "favicon.ico"
ถัดไป เพิ่ม<link>
องค์ประกอบในไฟล์ "index.html" ของคุณ ต่อจาก<title>
องค์ประกอบ ดังนี้:
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<title>My Page
Title</title>
<link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
ตอนนี้ บันทึกไฟล์ "index.html" และโหลดซ้ำในเบราว์เซอร์ของคุณ แท็บเบราว์เซอร์ของคุณควรแสดงภาพ favicon ของคุณทางด้านซ้ายของชื่อหน้า