DevToys Web Pro iconDevToys Web Proบล็อก
ให้คะแนนเรา:
ลองใช้ส่วนขยายเบราว์เซอร์:

พรีวิวมาร์กดาวน์

การกำหนดค่า

  • ธีม

    เลือกธีมที่จะใช้สำหรับดูตัวอย่าง Markdown

  • การไฮไลต์ไวยากรณ์

    ไฮไลต์บล็อกโค้ดด้วย Shiki

  • Markdown แบบ GitHub

  • การขึ้นบรรทัดใหม่

  • รองรับอีโมจิ

    แปลงชอร์ตโค้ด :emoji: เป็นอีโมจิ

มาร์กดาวน์

  • ตัวอย่าง

  • Loading editor...
    รายละเอียดทางเทคนิค

    เครื่องมือพรีวิว Markdown ทำงานอย่างไร

    เครื่องมือนี้ทำอะไร

    เครื่องมือพรีวิว Markdown จะแปลงข้อความ Markdown ให้เป็นผลลัพธ์ HTML ที่จัดรูปแบบแล้ว พร้อมการเรนเดอร์แบบเรียลไทม์เพื่อดูว่า markdown ของคุณจะปรากฏอย่างไรเมื่อเผยแพร่ เครื่องมือแก้ไขและตัวดู markdown นี้ช่วยให้นักพัฒนาและนักเขียนพรีวิว markdown ทดสอบไวยากรณ์ markdown และตรวจสอบการจัดรูปแบบให้ถูกต้องก่อนเผยแพร่ เครื่องมือนี้ทำหน้าที่เป็นตัวแปลง markdown และตัวเรนเดอร์ markdown รองรับ GitHub-flavored markdown (GFM) ตาราง บล็อกโค้ด และส่วนขยาย markdown หลากหลาย เมื่อคุณต้องการพรีวิว markdown ออนไลน์หรือทดสอบการจัดรูปแบบ markdown เครื่องมือบนเบราว์เซอร์นี้ให้ผลตอบรับทางภาพทันทีโดยไม่ต้องใช้ตัวแก้ไข markdown แบบโลคัลหรือการติดตั้งใด ๆ

    กรณีการใช้งานทั่วไปของนักพัฒนา

    นักพัฒนาใช้เครื่องมือพรีวิว Markdown เมื่อเขียนไฟล์ README เอกสาร บล็อกโพสต์ หรือ GitHub issues ที่ต้องใช้การจัดรูปแบบแบบ Markdown ฟังก์ชันพรีวิว Markdown มีความสำคัญเมื่อสร้างเอกสารเชิงเทคนิค เพราะคุณต้องตรวจสอบว่าบล็อกโค้ด ตาราง และลิงก์แสดงผลได้ถูกต้อง นักพัฒนาจำนวนมากใช้พรีวิว Markdown เมื่อเขียน GitHub-flavored markdown เพื่อให้แน่ใจว่าเข้ากันได้กับเอนจินการเรนเดอร์ของ GitHub เครื่องมือนี้ช่วยเมื่อแปลง Markdown เป็น HTML สำหรับการเผยแพร่บนเว็บ ทดสอบไวยากรณ์ Markdown สำหรับตัวสร้างเว็บไซต์แบบสแตติกอย่าง Jekyll หรือ Hugo หรือเมื่อสร้างคอนเทนต์ Markdown สำหรับแพลตฟอร์มที่รองรับการเรนเดอร์ Markdown นอกจากนี้ยังมีประโยชน์สำหรับผู้สร้างคอนเทนต์ที่เขียนด้วย Markdown แต่ต้องการเห็นผลลัพธ์ที่จัดรูปแบบแล้วก่อนเผยแพร่ไปยังบล็อก วิกิ หรือเว็บไซต์เอกสารประกอบ

    รูปแบบข้อมูล ชนิด หรือรูปแบบย่อย

    พรีวิว Markdown รองรับไวยากรณ์ CommonMark มาตรฐานและส่วนขยาย GitHub-flavored markdown รองรับการจัดรูปแบบพื้นฐาน เช่น หัวข้อ ตัวหนา ตัวเอียง ลิงก์ และรายการ รวมถึงฟีเจอร์ขั้นสูง เช่น ตาราง บล็อกโค้ดพร้อมการไฮไลต์ไวยากรณ์ ข้อความขีดฆ่า และรายการงาน เครื่องมือนี้ประมวลผลโค้ดแบบอินไลน์ โค้ดเฟนซ์ที่ระบุภาษา บล็อกคำพูด เส้นคั่นแนวนอน และการฝังรูปภาพ รองรับไดอาเล็กต์ Markdown หลายแบบ รวมถึง GitHub-flavored markdown (GFM) ซึ่งเพิ่มการรองรับตาราง รายการงาน ขีดฆ่า และลิงก์อัตโนมัติ บางการติดตั้งยังรองรับนิพจน์ทางคณิตศาสตร์ เชิงอรรถ และส่วนขยายแบบกำหนดเอง พรีวิวรองรับทั้งองค์ประกอบระดับบล็อกและการจัดรูปแบบแบบอินไลน์ เพื่อให้แสดงผลได้ใกล้เคียงกับผลลัพธ์ที่เรนเดอร์จริง

    ข้อผิดพลาดที่พบบ่อยและกรณีขอบ

    เมื่อใช้พรีวิว Markdown โปรดทราบว่าตัวประมวลผล Markdown ที่ต่างกันอาจเรนเดอร์เนื้อหาแตกต่างกันเล็กน้อย GitHub-flavored markdown มีกฎเฉพาะสำหรับการขึ้นบรรทัดใหม่ การจัดรูปแบบตาราง และการตรวจจับลิงก์อัตโนมัติ ซึ่งอาจไม่ตรงกับการใช้งาน Markdown อื่น ๆ ปัญหาที่พบบ่อยได้แก่ การจัดการการขึ้นบรรทัดใหม่ไม่สอดคล้องกัน (อาจต้องใช้เว้นวรรคสองช่องหรือขึ้นบรรทัดใหม่สองครั้ง) การจัดรูปแบบตารางที่ใช้ได้ในตัวประมวลผลหนึ่งแต่ใช้ไม่ได้ในอีกตัว และความแตกต่างในการ escape อักขระพิเศษ การไฮไลต์ไวยากรณ์ของบล็อกโค้ดอาจแตกต่างกันตามภาษาที่ระบุและตัวไฮไลต์ที่มีอยู่ HTML ที่ฝังอยู่ใน Markdown อาจถูกทำความสะอาด (sanitize) แตกต่างกันในแต่ละแพลตฟอร์ม ทำให้การจัดรูปแบบที่ตั้งใจไว้เสียหายได้ ควรทดสอบ Markdown ของคุณบนแพลตฟอร์มเป้าหมายเสมอเพื่อให้แน่ใจว่าเรนเดอร์ได้สม่ำเสมอ

    เมื่อใดควรใช้เครื่องมือนี้แทนการเขียนโค้ด

    ใช้พรีวิว Markdown แบบบนเบราว์เซอร์นี้สำหรับการตรวจสอบเนื้อหาอย่างรวดเร็ว การสร้างเอกสารแบบครั้งคราว หรือเมื่อทำงานบนเครื่องที่ไม่ได้ติดตั้งตัวแก้ไข Markdown เหมาะสำหรับทดสอบไวยากรณ์ Markdown พรีวิวเนื้อหาก่อนเผยแพร่ หรือเมื่อคุณต้องแชร์พรีวิวที่จัดรูปแบบแล้วให้ผู้มีส่วนได้ส่วนเสียที่ไม่ใช่สายเทคนิค สำหรับการสร้างคอนเทนต์เพื่อใช้งานจริง แนะนำให้ใช้ตัวแก้ไข Markdown แบบเฉพาะทางที่มีไลฟ์พรีวิว (เช่น Typora, Mark Text หรือ VS Code พร้อมส่วนขยาย Markdown) ซึ่งให้ประสิทธิภาพที่ดีกว่า การจัดการไฟล์ในเครื่อง และการผสานกับระบบควบคุมเวอร์ชัน การประมวลผล Markdown แบบโค้ดด้วยไลบรารีอย่าง markdown-it, remark หรือ marked ให้การควบคุมตัวเลือกการเรนเดอร์มากกว่าและสามารถผสานเข้ากับ build pipeline ได้ เครื่องมือบนเบราว์เซอร์เด่นเรื่องพรีวิวเร็วและการแชร์ ขณะที่ตัวแก้ไขเฉพาะทางให้การผสานเวิร์กโฟลว์ที่ดีกว่าสำหรับการสร้างคอนเทนต์ Markdown เป็นประจำ