Anonim

นักพัฒนาและโปรแกรมเมอร์ได้ใช้ text editor เป็นวิธีหลักในการป้อนรหัสคอมพิวเตอร์ สภาพแวดล้อมการพัฒนาบางอย่างมีบรรณาธิการในตัวของมันเอง แต่โดยทั่วไปแล้วนักพัฒนามักจะชอบโปรแกรมแก้ไขเพียงตัวเดียวและติดกับโปรแกรมนั้น เหตุผลข้อหนึ่งคือเครื่องมือแก้ไขการเข้ารหัสที่ดีมีการเน้นไวยากรณ์คุณลักษณะที่จัดรูปแบบซอร์สโค้ดและกำหนดแบบอักษรและสีให้กับคำหลักและสร้างภายในโค้ดเพื่อให้อ่านง่ายขึ้น ผู้แก้ไขข้อความเช่น Notepad ++ ซึ่งได้รับการกล่าวถึงในคำแนะนำเทค Junkie นี้ได้รับการสนับสนุนจากผู้พัฒนาด้วยเหตุผลนี้ นักพัฒนาส่วนใหญ่ไม่มอง Google Docs ว่าเป็นโปรแกรมแก้ไขโค้ดที่มีศักยภาพแม้จะมีคุณสมบัติเวิร์กกรุ๊ปที่ยอดเยี่ยมและการรวมระบบคลาวด์เพราะมันไม่มีตัวเลือกการเน้นไวยากรณ์ในตัว

อย่างไรก็ตามคุณสามารถเพิ่มการเน้นไวยากรณ์ให้กับรหัสในเอกสาร Google Doc อันที่จริงมีอย่างน้อยสองส่วนเสริมสำหรับเอกสารที่ช่วยให้คุณสามารถจัดรูปแบบภาษาการเขียนโปรแกรมและมาร์กอัปต่างๆด้วยการเน้นไวยากรณ์ นอกจากนี้ยังมีเว็บแอปมากมายที่คุณสามารถใช้เพื่อแทรกซอร์สโค้ดด้วยการเน้นใน Google เอกสาร ฉันจะแสดงวิธีเพิ่มไวยากรณ์ของซอร์สโค้ดที่เน้นเอกสารของคุณ

จัดรูปแบบซอร์สโค้ดด้วย Code Pretty

โค้ดพริตตี้เป็นส่วนเสริมสำหรับ Google เอกสารที่เพิ่มการเน้นสีให้กับรหัสที่เลือกโดยอัตโนมัติ โค้ดพริตตี้ไม่ได้รวมการตั้งค่าจำนวนมากสำหรับการกำหนดการจัดรูปแบบไวยากรณ์เอง แต่ก็ยังเพิ่มตัวเลือกการเน้นไวยากรณ์ที่สะดวกสบายให้กับเอกสาร คุณสามารถเพิ่ม CP ไปยังเอกสารได้โดยคลิกที่ปุ่ม Fr ee บนหน้าเว็บนี้ จากนั้นกดปุ่ม อนุญาต เพื่อยืนยันการอนุญาตสำหรับส่วนเสริม

ถัดไปเปิดเอกสารในเบราว์เซอร์ของคุณ และคลิกแท็บ Add-on เพื่อเปิดเมนู เมนูนั้นจะมีส่วนเสริมของ Code Pretty เพื่อให้ตัวอย่างวิธีการเน้นไวยากรณ์ของแอดออนนี้ให้เลือกและคัดลอกโค้ด JavaScript ตัวอย่างด้านล่างลงในเอกสาร Docs โดยกด Ctrl + C



JavaScript สามารถทำอะไรได้บ้าง

JavaScript สามารถเปลี่ยนคุณสมบัติ HTML

ในกรณีนี้ JavaScript เปลี่ยนแอตทริบิวต์ src (แหล่งที่มา) ของรูปภาพ

วางตัวอย่าง JavaScript นั้นลงในเอกสารโดยกด Ctrl + V จากนั้นเลือกรหัสในโปรแกรมประมวลผลคำด้วยเคอร์เซอร์ คลิก Add-ons > โค้ดพริตตี้ และเลือกตัวเลือกการ จัดรูปแบบ จากเมนูย่อย ที่จะจัดรูปแบบ JavaScript ตามที่แสดงในภาพรวมด้านล่างโดยตรง

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

จัดรูปแบบซอร์สโค้ดด้วยบล็อครหัส

Code Blocks เป็นโปรแกรมเสริมสำหรับ CP ที่คุณสามารถเพิ่มลงในเอกสารได้ นี่เป็นส่วนเสริมที่ดีกว่าเล็กน้อยในการเน้นไวยากรณ์ด้วยเนื่องจากมีชุดรูปแบบการเน้นจำนวนมาก กดปุ่ม ฟรี บนหน้าเว็บไซต์นี้เพื่อเพิ่ม Code Blocks ไปยังเอกสาร

เมื่อคุณติดตั้ง Code Blocks ให้เปิดเอกสารและคัดลอกและวางรหัส JavaScript เดียวกันด้านบนลงในโปรแกรมประมวลผลคำเหมือนเมื่อก่อน คลิกส่วน เสริม > บล็อครหัส และเลือก เริ่มต้น เพื่อเปิดแถบด้านข้างที่แสดงในภาพด้านล่างโดยตรง

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

คัดลอกและวางซอร์สโค้ดที่เน้นสีลงใน Google เอกสาร

นอกเหนือจาก Code Blocks และ Code Pretty Docs แล้วคุณยังสามารถใช้ไฮไลต์แอปพลิเคชันเน้นข้อความทางเว็บเพื่อจัดรูปแบบซอร์สโค้ด จากนั้นคุณสามารถคัดลอกและวางซอร์สโค้ดที่ไฮไลต์จากเว็บแอปกลับไปที่เอกสารของคุณ Textmate เป็นหนึ่งในโปรแกรมเน้นข้อความทางเว็บที่มีรูปแบบการเขียนโปรแกรมและภาษามาร์กอัปมากมาย

คลิกที่ไฮเปอร์ลิงก์นี้เพื่อเปิด Textmate จากนั้นคัดลอกและวางข้อความ JavaScript ที่รวมอยู่ในโพสต์นี้ลงในซอร์สโค้ดของ Textmate พร้อมปุ่มลัด Ctrl + C และ Ctrl + V เลือก JavaScript จากเมนูแบบเลื่อนลงภาษา เลือกชุดรูปแบบไฮไลต์ไวยากรณ์จากเมนูแบบเลื่อนลงธีม กดปุ่ม ไฮไลต์ เพื่อดูตัวอย่างการจัดรูปแบบของซอร์สโค้ดดังที่แสดงในภาพรวมด้านล่างโดยตรง

จากนั้นเลือก JavaScript ที่ไฮไลต์ในตัวอย่างด้วยเคอร์เซอร์แล้วกด Ctrl + C วางโค้ดที่ไฮไลต์ลงใน Google เอกสารโดยกด Ctrl + V ที่จะเพิ่มซอร์สโค้ด JavaScript ที่ไฮไลต์ลงในเอกสาร Docs ดังที่แสดงด้านล่างโดยตรง

ดังนั้นคุณไม่จำเป็นต้องใช้โปรแกรมแก้ไขข้อความบนเดสก์ท็อปเพื่อเพิ่มการเน้นไวยากรณ์ให้กับซอฟต์แวร์และรหัสเว็บไซต์ แต่คุณสามารถเน้นรหัสไวยากรณ์ในเอกสาร Docs ด้วยส่วนขยาย Code Pretty และ Code Blocks อีกวิธีหนึ่งคือคัดลอกและวางรหัสของคุณไปยังและจากแอพ Textmate เพื่อแทรกซอร์สโค้ดพร้อมการเน้นใน Google เอกสาร

มีวิธีอื่นในการเพิ่มการจัดรูปแบบไวยากรณ์ใน Google เอกสารหรือไม่ แบ่งปันกับเราด้านล่าง!

วิธีเพิ่มการเน้นไวยากรณ์ไปยังซอร์สโค้ดใน Google เอกสาร