แสดง Font ไทยสวยๆบนหน้าเว็บไซต์
สวัสดีครับ วันนี้ผมจะมาแนะนำวิธีการใส่ฟอนต์ในหน้าเว็บ โดยเข้าไปโหลดฟอนต์ในหน้าเว็บ f0nt.com ซึ่งเป็นเว็บไซต์ที่รวบรวมฟอนต์ไทยสวยงามมากมาย และที่สำคัญสามารถนำมาใช้ได้ฟรี (หรือเปล่านะ :) แบบว่าขอยืมอ่ะคับ ฮ่าๆ) แล้วนำมาแปลงเป็น font ที่สามารถนำมาใช้ได้ในหน้าเว็บ เอาละครับเรามาเริ่มกันเลย
ขั้นตอนแรก ให้เราเข้าไปที่เว็บไซต์ f0nt.com ในหน้าเว็บจะมีฟอนต์ต่างๆมากมายให้เราเลือก เราก็เลือกๆมาสักตัวครับ ในตัวอย่างผมขอเลือกใช้ font ตัวนี้ก็แล้วกัน
ส่วนวิธีการดาวน์โหลดผมขอไม่บอกนะครับ..ฮ่าๆ บอกนิดนึงก็ได้... คลิกเข้าไปที่ชื่อฟอนต์เลยครับ แล้วมันจะมีลิงค์ให้ดาวน์โหลดอยู่ด้านล่าง...คลิกโหลดมาได้เลยคับ...โหลดมาแล้วมันจะเป็นไฟล์ .zip ก็แตกไฟล์ออกมาจะได้เป็นไฟล์ .ttf อย่างของผมจะได้ไฟล์ชื่อว่า paaymaay_regular.ttf
เอาละครับเมื่อได้ฟอนต์มาแล้วขั้นตอนต่อไปให้เราเข้าไปที่เว็บไซต์ https://www.kirsle.net/wizards/ttf2eot.cgi เพื่อแปลง font .ttf ไปเป็นไฟล์ .eot ซึ่งไฟล์ตัวนี้จะสามารถนำมาใช้บนหน้าเว็บได้นั้นเอง....ต่อๆๆไปเมื่อเราเข้ามาที่เว็บที่ผมบอกไปเมื่อกี้ได้แล้วให้เราทำการ convert ไฟล์โดยคลิกที่ปุ่ม "เลือกไฟล์" จากนั้นเลือกไฟล์ฟอนต์ .ttf ที่เราโหลดมา เมื่อเลือกไฟล์เสร็จแล้วให้เรากดที่ปุ่ม "Convert TTF to EOT!"
เมื่อ Convert ได้แล้วมันจะมีลิงค์ให้เราดาวน์โหลดฟอนต์ตามภาพครับโหลดเบย
สังเกตุว่าเขาจะมีตัวอย่างการนำไปใช้ให้เราด้วยครับ ตามนี้ครับ
มาถึงขั้นตอนการนำไปใช้แล้วครับผมขอแสดง code html การนำไปใช้นะบัดนี้.......
<html> <head>step-juice.blogspot.com <body>ฟอนต์ "ป้ายไม้" สวยจุง
ฟอนต์ "ป้ายไม้" สวยจุง
ฟอนต์ "ป้ายไม้" สวยจุง
ฟอนต์ "ป้ายไม้" สวยจุง
</body> </html>
และนี่คือผลลัพธ์การแสดง font ในหน้าเว็บ
เอาไว้ผมจะมาอธิบาย Code HTML ทีหลังนะครับ และขอทิ้งลิงค์ตัวอย่างไว้ให้ได้ไปศึกษากันครับ
0 ความคิดเห็น