การใส่รูปหรือโลโก้เล็กๆ (favicon) หน้าชื่อ website

บางครั้งผมเข้าเว็บดังๆ แล้วเห็น Logo อันเล็กๆหน้าชื่อ Website เห็นแล้วสวยดี ก็เลยพยายามหาวิธีทำ ลองผิดลองถูกมา สุดท้ายก็ได้ ก็เลยจะเอามาแบ่งปันข้อมูล เผื่อใครมี Website ส่วนตัวแล้วสนใจจะทำครับ


ขั้นแรกเลย..
ออกแบบ Logo ที่ต้องการ ใช้โปรแกรมอะไรก็ได้ครับ ตามสะดวกเลย แต่ผมจะขอใช้ photoshop แนะนำขนาดประมาณ 40 - 50 px. น่ะครับ จากนั้นออกแบบตามใจชอบเลยย และเมื่อออกแบบเสร็จก็ Save รูปเลย แนะนำเป็น *.JPEG ก็จะได้ไฟล์รูปที่เราต้องการ



ขั้นที่สองง...
จากนั้นไปเว็บบริการทำ favicon อะไรก็ได้คับ ในตัวอย่างครั้งนี้ผมขอแนะนำเป็น http://www.favicon.cc เข้าไปแล้วก็เลือก Import Image จากนั้นเลือกไฟล์แล้วกด Upload รอสักครู่... รูปที่เราต้องการจะขึ้นมา จากนั้นกด Dwonload Favicon ก็จะได้ไฟล์ favicon.ico ออกมา



ขั้นที่สามม...
เมื่อได้ไฟล์ .ico ออกมาแล้ว ก็ทำการ Upload ขึ้นไปใน Hosting ของเราเลย (อย่าลืมจำตำแหน่งที่อยู่ด้วย !!) ผมจะวางไว้ในหน้า Home Directory จากนั้นเราก็มาทีดูโค๊ด ส่วนที่ต้องเพิ่มเข้าไป ของผมจะเป็น index.html เพื่อให้รูปขึ้น มีประมาณนี้ครับ จะเพิ่มไปในส่วนของ head

<head>
<link rel=”icon” href=favicon.ico type=”image/x-icon” />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>9Choo.in.th นายชูฮ๊าฟฟ ...</title>  // Name of website
<link />
</head>

เมื่อเสร็จแล้ว ก็ Upload index.html ขึ้น Hosting ไปใหม่ เพียงเท่านี้ก็เรียบร้อย :D



Comments

Post a Comment

Popular posts from this blog

interpreter กับ compiler ต่างกันยังไง?

Source file not compile Dev C++ win 8, win 8.1 , win10

LTE CAT3/4/6 + มือถือ 4G ซื้อให้ดีต้องดูถึง Network Technology Bands