วิธีดาวน์โหลดแบบอักษรจากเว็บไซต์โดยใช้เครื่องมือสำหรับนักพัฒนา
ในบทความนี้ เราจะพูดถึงวิธีดาวน์โหลดแบบอักษรจากเว็บไซต์ในเบราว์เซอร์ Chrome หรือ Edge โดยใช้เครื่องมือสำหรับนักพัฒนา(download fonts from websites in Chrome or Edge browser using Developer Tools)ซอฟต์แวร์ ทั้งChromeและEdgeมาพร้อมกับนักพัฒนาเว็บและเครื่องมือสร้างเว็บในตัวที่ใช้ตรวจสอบเว็บไซต์โดยตรงในเบราว์เซอร์ คุณสามารถทำสิ่งต่างๆ ได้มากมายด้วยเครื่องมือสำหรับนักพัฒนา (Developer Tools)ตัวอย่างเช่น ช่วยให้คุณสามารถระบุแบบอักษรบนเว็บไซต์(identify fonts on a website)ค้นหาภายในไฟล์ต้นทาง ใช้ตัวตกแต่งในตัว จำลองเซ็นเซอร์และตำแหน่งทางภูมิศาสตร์ และอื่นๆ
ตอนนี้ คุณยังสามารถดาวน์โหลดแบบอักษร(download fonts)จากเว็บไซต์โดยใช้เครื่องมือสำหรับนักพัฒนา(Developer Tools)ซอฟต์แวร์ ในการดาวน์โหลดแบบอักษรจากเว็บไซต์ คุณจะต้องผ่านตัวเลือกบางอย่างและลองใช้เคล็ดลับ ลองตรวจสอบขั้นตอนในรายละเอียด
ดาวน์โหลด(Download)แบบอักษร(Font)จากเว็บไซต์(Website)โดยใช้เครื่องมือสำหรับนักพัฒนา Chrome(Chrome Developer Tools)
ในโพสต์นี้ เราจะแสดงขั้นตอนในการดาวน์โหลดแบบอักษรจากเว็บไซต์ในGoogle Chrome (Google Chrome)คุณสามารถใช้ขั้นตอนเดียวกันนี้เพื่อดาวน์โหลดแบบอักษรของเว็บไซต์ในเบราว์เซอร์Microsoft Edge นี่คือขั้นตอนในการทำเช่นนั้น:
- เปิด Google Chrome
- ไปที่เว็บไซต์ที่คุณต้องการดาวน์โหลดแบบอักษร
- เปิดเครื่องมือสำหรับนักพัฒนา
- ไปที่แท็บเครือข่าย
- คลิก(Click)ที่ ตัวเลือก แบบอักษร(Font)และเลือกแบบอักษรที่จะดาวน์โหลด
- ดาวน์โหลดไฟล์ฟอนต์
- เปลี่ยนชื่อไฟล์ที่ดาวน์โหลดด้วยนามสกุลไฟล์ฟอนต์
ให้เราตรวจสอบขั้นตอนเหล่านี้โดยละเอียด!
ขั้น แรก เปิดGoogle Chromeและไปที่เว็บไซต์ที่คุณต้องการดาวน์โหลดแบบอักษร ถัด(Next)ไป ไปที่เมนูสามแถบแล้วคลิกตัวเลือก More Tools > Developerอีกวิธีหนึ่ง คุณยังสามารถกดCtrl + Shift + Iเพื่อเปิดแผงเครื่องมือสำหรับนักพัฒนา ได้อย่างรวดเร็ว(Developer Tools)
ตอนนี้ ใน ส่วน เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์(Developer Tools) ที่เปิด อยู่ ให้คลิกที่ปุ่มลูกศรคู่ จากนั้นเลือกและเปิด แท็บ เครือข่าย(Network)จากแถบเมนูด้านบน หลังจากนั้น ให้โหลดเว็บไซต์ที่คุณเปิดอยู่ใหม่
ถัดไป คลิกที่ หมวด Fontแล้วคุณจะเห็นรายการแบบอักษรที่ฝังไว้ซึ่งมีชื่อแบบอักษรที่เกี่ยวข้องปรากฏอยู่บนเว็บไซต์ คุณสามารถเลือกแบบอักษรจากรายการและคุณจะเห็นตัวอย่างในแผงเฉพาะดังที่แสดงในภาพหน้าจอด้านล่าง
ตอนนี้จะระบุรูปแบบฟอนต์ได้อย่างไร? เพียง(Well)แค่วางเมาส์เหนือแบบอักษรและดูนามสกุลไฟล์ในตอนท้าย อ้างถึงภาพหน้าจอด้านล่าง
หลังจากนั้น เพียงคลิกขวาที่ฟอนต์ จากนั้นจากเมนูบริบท ให้คลิกที่ตัวเลือกCopy > Copy Response
ถัดไป เพิ่มแท็บใหม่ใน เบราว์เซอร์ Chrome ของคุณ และวางการตอบสนองที่คัดลอกไปยังแถบที่อยู่ในแท็บ จากนั้นกดปุ่มEnter ในขณะที่คุณทำเช่นนั้น ไฟล์จะถูกดาวน์โหลด
ตอนนี้ ไปที่ โฟลเดอร์ ดาวน์โหลด(Downloads) ของคุณ ที่ดาวน์โหลดไฟล์ฟอนต์ด้านบน ตอนนี้คุณต้องเปลี่ยนชื่อไฟล์นี้ด้วยนามสกุลไฟล์ฟอนต์ ก่อนอื่นให้ไปที่แท็บมุมมอง ใน ( View)File Explorerจากนั้นตรวจสอบให้แน่ใจว่าได้เปิดใช้งานตัวเลือกนามสกุลไฟล์ (File name extensions)ตอนนี้ เลือกไฟล์ฟอนต์ที่ดาวน์โหลดมา และคลิกที่ตัวเลือกเปลี่ยนชื่อ (Rename)เพิ่มนามสกุลไฟล์ฟอนต์ที่ระบุ (เช่น . woff2 ) แล้วกดปุ่ม Enter
Voilaนี่คือวิธีดาวน์โหลดไฟล์ฟอนต์จากเว็บไซต์
เนื่องจาก ขณะนี้ Microsoft Edgeใช้Chromiumเช่นChromeคุณสามารถดาวน์โหลดไฟล์แบบอักษรใน เบราว์เซอร์ Edgeโดยทำตามขั้นตอนเดียวกับด้านบน
หวังว่าบทความนี้จะช่วยให้คุณเรียนรู้วิธีดาวน์โหลดแบบอักษรจากเว็บไซต์ใน เบราว์เซอร์ ChromeหรือEdgeโดยใช้เครื่องมือสำหรับนักพัฒนา(Developer Tools)ซอฟต์แวร์
เคล็ดลับ(TIP) : มีคำแนะนำและเคล็ดลับสำหรับเครื่องมือพัฒนา Chrome(Chrome Development Tools Tips and Tricks) อีกมากมาย ที่คุณสามารถเรียนรู้ได้
ตอนนี้อ่านแล้ว: (Now read:) ใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์เพื่อล้างข้อมูลไซต์สำหรับเว็บไซต์เฉพาะใน Chrome หรือ(Use Developer Tools to clear Site Data for a particular website in Chrome or Edge) Edge
Related posts
Identify แบบอักษรใน Chrome, Edge and Firefox ใช้ Developer Tools
ล้าง Site Data สำหรับไซต์เฉพาะใน Chrome or Edge โดยใช้ Developer Tools
วิธีการเปลี่ยน Default Font ใน Chrome, Edge, Firefox browser
โหมดนักพัฒนาซอฟต์แวร์ Chrome คืออะไรและมีประโยชน์อย่างไร?
Developer Tools ปิดการใช้งานใน Edge ใช้ Registry or Group Policy
ป้อนอัตโนมัติของ Google Chrome: คู่มือฉบับสมบูรณ์
ใช้ 4 ปลั๊กอิน Chrome เหล่านี้เพื่อเข้ารหัสข้อความ Gmail ของคุณ
Google Chrome ไม่ตอบสนอง Relaunch แล้วหรือยัง
Best ฟรี Font Manager software สำหรับ Windows 11/10
ปิดการใช้งานถอนการติดตั้ง Adobe Flash, Shockwave ใน Chrome, Firefox, Edge, IE
วิธีการเปลี่ยน Default Print Settings ใน Google Chrome
วิธีสร้าง Font cache ใน Windows 11/10
รายการเว็บไซต์ Online Font Converter ฟรีที่ดีที่สุด
วิธีการยกเลิก Google FLoC (Privacy Sandbox) ใน Chrome
เปิดใช้งาน Line Wrap ใน Source View ใน Chrome or Edge
หยุดเว็บไซต์ไม่ให้ส่งการแจ้งเตือนใน Chrome
เครื่องมือ FTP ที่ดีที่สุดในการถ่ายโอนไฟล์ไปยังโดเมนเว็บไซต์ของคุณ
Chrome update ล้มเหลวด้วยรหัสข้อผิดพลาด 3, 4, 7, 10, 11, 12, ฯลฯ
วิธีเปิดใช้งาน Global Media Playback Control ใน Chrome
วิธีล้าง Cache, Cookies, Browsing History ใน Chrome and Firefox