ปรับแต่งเครื่องมือสำหรับนักพัฒนาเว็บ

Kayce Basques

Jecelyn Yeen

Sofia Emelianova

หน้านี้จะแสดงวิธีปรับแต่งเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome

การตั้งค่า

settings Settings > Preferences มีตัวเลือกมากมายสำหรับการปรับแต่ง DevTools

โปรดดูหัวข้อเปิดการตั้งค่าและค่ากำหนด

ธีมมืด

คุณเปิดใช้ธีมมืดได้ในการตั้งค่าหรือเมนูคำสั่ง

1. เปิดเมนูคำสั่ง

2. เริ่มพิมพ์ dark เลือกคำสั่งเปลี่ยนเป็นธีมมืด แล้วกด Enter เพื่อเรียกใช้คำสั่ง

   

3. อีกวิธีหนึ่งคือ ตั้งค่าธีมในการตั้งค่า การตั้งค่า > ค่ากำหนด > ลักษณะที่ปรากฏ > ธีม

ธีมแบบไดนามิก

เครื่องมือสำหรับนักพัฒนาเว็บจะจับคู่กับธีมสีของ Chrome ได้โดยอัตโนมัติ

วิธีตั้งค่าธีม

1. เปิดแท็บใหม่ แล้วคลิกแก้ไข ปรับแต่ง Chrome ที่มุมขวาล่าง
2. ในส่วนลักษณะที่ปรากฏ ให้เลือกธีมผ่านวอลเปเปอร์ เปลี่ยนธีม หรือเลือกชุดสี

ลิ้นชัก

ลิ้นชักมีฟีเจอร์ที่ซ่อนอยู่มากมาย

กด Escape เพื่อเปิดหรือปิดลิ้นชัก

คลิก more_vert เครื่องมือเพิ่มเติมเพื่อเปิดแท็บอื่นๆ ในลิ้นชัก

เปลี่ยนตำแหน่งเครื่องมือสำหรับนักพัฒนาเว็บ

โดยค่าเริ่มต้น เครื่องมือสำหรับนักพัฒนาเว็บจะยึดอยู่ที่ด้านขวาของวิวพอร์ต นอกจากนี้คุณยังตรึงเครื่องมือไว้ที่ด้านล่างหรือด้านซ้ายหรือเลิกตรึงเครื่องมือสำหรับนักพัฒนาเว็บในหน้าต่างแยกต่างหากได้อีกด้วย

คุณเปลี่ยนตำแหน่งเครื่องมือสำหรับนักพัฒนาเว็บได้ 2 วิธี ดังนี้

• เมนูหลัก: เปิด more_vert ปรับแต่งและควบคุมเครื่องมือสำหรับนักพัฒนาเว็บ แล้วคลิก
  • ad_group เลิกตรึงเป็นหน้าต่างแยก
  • dock_to_right ชิดซ้าย
  • dock_to_bottom Dock to bottom
  • dock_to_left ย้ายไปทางขวา

• เมนูคำสั่ง:

  1. เปิดเมนูคำสั่ง
  2. เริ่มพิมพ์ dock แล้วเลือกตัวเลือกที่แนะนำอย่างใดอย่างหนึ่ง ได้แก่ เชื่อมต่อกับด้านล่าง ซ้าย ขวา เลิกเชื่อมต่อ หรือกู้คืนตำแหน่งการต่อเชื่อมล่าสุด

หากต้องการสลับคืนค่าตำแหน่งแท่นชาร์จล่าสุดด้วยแป้นพิมพ์ลัด ให้กดดังนี้

• ใน Linux หรือ Windows: Control+Shift+D
• ใน MacOS: Command+Shift+D

เรียงลําดับแผง แท็บ และแผงใหม่

หากต้องการเปลี่ยนลําดับ ให้คลิกและลากรายการต่อไปนี้ไปทางซ้ายหรือขวา

• แผงที่ด้านบนของเครื่องมือสำหรับนักพัฒนาเว็บ
• แผงในแผงองค์ประกอบ เช่น สไตล์ ที่คำนวณแล้ว เลย์เอาต์ และอื่นๆ
• แผงในแผงแหล่งที่มา เช่น หน้าเว็บ พื้นที่ทํางาน การลบล้าง และอื่นๆ
• แท็บลิ้นชักที่ด้านล่างของเครื่องมือสำหรับนักพัฒนาเว็บ

นอกจากนี้ คุณยังเลื่อนแผงและแท็บขึ้นและลงไปยังลิ้นชักและจากลิ้นชักได้ โดยคลิกขวาที่แผงหรือแท็บ แล้วเลือกย้ายไปด้านบนหรือย้ายไปด้านล่างจากเมนูแบบเลื่อนลง

ลำดับของแท็บที่กำหนดเองจะยังคงอยู่ในเซสชันเครื่องมือสำหรับนักพัฒนาเว็บ

เลย์เอาต์แผง

โดยค่าเริ่มต้น เครื่องมือสำหรับนักพัฒนาเว็บจะจัดเรียงเลย์เอาต์ของแผงใหม่โดยอัตโนมัติตามขนาดหน้าต่าง คุณสามารถปิดใช้การจัดเรียงอัตโนมัติได้ ไปที่การตั้งค่า การตั้งค่า > ค่ากำหนด > ลักษณะที่ปรากฏ และอัปเดตเลย์เอาต์ของแผงตามต้องการ

เช่น แผงสไตล์ในแผงองค์ประกอบจะย้ายจากด้านข้างไปไว้ที่ด้านล่างเมื่อหน้าจอมีขนาดเล็ก หากต้องการให้แผงสไตล์แสดงอยู่ด้านข้างเสมอ ให้เปลี่ยนเลย์เอาต์แผงเป็นแนวตั้ง

เปลี่ยนภาษาของ UI เครื่องมือสำหรับนักพัฒนาเว็บ

ดูการตั้งค่า การตั้งค่า > ค่ากําหนด > ลักษณะที่ปรากฏ > ภาษา

การตั้งค่าการซิงค์

คุณซิงค์การตั้งค่า DevTools ในอุปกรณ์หลายเครื่องได้

หากต้องการเปิดใช้การซิงค์ ให้เปิดการซิงค์ของ Chrome ก่อน เมื่อเปิดใช้แล้ว ระบบจะซิงค์การตั้งค่าเครื่องมือสำหรับนักพัฒนาเว็บโดยค่าเริ่มต้น

คุณเปิดหรือปิดการซิงค์การตั้งค่าเครื่องมือสำหรับนักพัฒนาเว็บแยกต่างหากได้โดยใช้ช่องทำเครื่องหมายการตั้งค่า การตั้งค่า > การซิงค์ > check_box เปิดใช้การซิงค์การตั้งค่า

DevTools จะซิงค์การตั้งค่าส่วนใหญ่ ยกเว้นการตั้งค่าในแท็บเวิร์กสเปซ การทดสอบ และอุปกรณ์ รวมถึงการตั้งค่าทั่วไปอื่นๆ อีก 2-3 รายการ สถานะของช่องทำเครื่องหมายเปิดใช้การซิงค์การตั้งค่าจะซิงค์ในอุปกรณ์ต่างๆ ด้วย

ตัวอย่างเช่น ระบบจะซิงค์การตั้งค่าลักษณะที่ปรากฏต่อไปนี้เพื่อให้คุณได้รับประสบการณ์การใช้งานที่สอดคล้องกันในอุปกรณ์ต่างๆ และไม่จําเป็นต้องกําหนดการตั้งค่าเดิมอีกครั้ง

อย่างไรก็ตาม ระบบจะไม่ซิงค์การตั้งค่าแท่นชาร์จ เนื่องจากนักพัฒนาแอปมีค่ากำหนดแท่นชาร์จที่แตกต่างกันเมื่อแก้ไขข้อบกพร่องในเว็บไซต์ต่างๆ

ปรับแต่งแป้นพิมพ์ลัด

โปรดดูที่การตั้งค่า > ทางลัด

เปิดใช้การทดสอบ

ดูการตั้งค่า > การทดสอบ