หัวเรื่องพร้อม ID (Heading IDs)

Heading IDs เป็นความสามารถแบบขยายของ Markdown ที่ให้เพิ่มตัวระบุ (ID) แบบกำหนดเองกับหัวเรื่อง เพื่อสร้างลิงก์ที่แม่นยำและควบคุมโครงสร้างเอกสารได้สะดวก

ไวยากรณ์พื้นฐาน

เพิ่ม ID ให้หัวเรื่อง

ใช้ไวยากรณ์วงปีกกา วางหลังข้อความของหัวเรื่อง:

## My Heading {#custom-id}

ผลลัพธ์การเรนเดอร์:

เอาต์พุต HTML จะมี ID ที่กำหนดกับองค์ประกอบหัวเรื่อง:

<h2 id="custom-id">My Heading</h2>

ID สำหรับหลายระดับหัวเรื่อง

หัวเรื่องทุกระดับสามารถกำหนด ID ได้:

# First Level Heading {#first-level}

## Second Level Heading {#second-level}

### Third Level Heading {#third-level}

#### Fourth Level Heading {#fourth-level}

สถานการณ์การใช้งาน

สร้างลิงก์สมอ (Anchor Links)

เมื่อมี ID แบบกำหนดเอง คุณสามารถสร้างลิงก์ไปยังส่วนเฉพาะในเอกสารได้:

[Click to jump to my heading](#custom-id)

...other content...

## My Heading {#custom-id}

ผลลัพธ์การเรนเดอร์:

เมื่อคลิกลิงก์ ระบบจะเลื่อนไปยังหัวเรื่องที่มี custom-id โดยตรง

ลิงก์จากภายนอกไปยังส่วนเฉพาะของเอกสาร

ID แบบกำหนดเองช่วยให้ลิงก์จากเอกสารอื่นไปยังเนื้อหาเฉพาะทำได้สะดวก:

[Link to specific section of other document](other-doc.html#specific-section)

แชร์ส่วนเฉพาะผ่าน URL

หัวเรื่องที่มี ID สามารถแชร์ผ่าน URL ชี้ไปยังส่วนที่ต้องการได้:

https://www.markdownlang.com/documentation.html#installation-guide

การใช้งานขั้นสูง

ID สำหรับหัวเรื่องหลายคำ

เมื่อหัวเรื่องมีหลายคำ มักใช้เครื่องหมายขีดกลางเชื่อมคำใน ID:

## Installation and Configuration Guide {#installation-and-configuration}

การสร้างสารบัญและ Heading IDs

ตัวเรนเดอร์ Markdown จำนวนมากจะสร้าง ID อัตโนมัติจากข้อความหัวเรื่อง การกำหนด ID เองทำให้ลิงก์สารบัญคงที่แม้เปลี่ยนข้อความหัวเรื่อง:

## Getting Started Guide {#getting-started}

แม้ต่อมาคุณจะเปลี่ยนหัวเรื่องเป็น “Getting Started” ลิงก์ยังคงใช้ได้เพราะ ID เหมือนเดิม

การทำให้เป็นสากลและภาษาที่ไม่ใช่อังกฤษ

สำหรับหัวเรื่องที่ไม่ใช่ภาษาอังกฤษ การกำหนด ID ภาษาอังกฤษช่วยให้มีตัวระบุคงที่และอ่านง่าย:

## Installation Instructions {#installation}

## Usage Guide {#usage}

## Frequently Asked Questions {#faq}

ความเข้ากันได้และความแตกต่างในการใช้งาน

สถานะการรองรับบนแพลตฟอร์มต่าง ๆ

แพลตฟอร์ม/เครื่องมือ	รองรับ Heading ID	ไวยากรณ์
GitHub Markdown	✅	{#id}
GitLab Markdown	✅	{#id}
Jekyll (kramdown)	✅	{:#id} หรือ {#id}
Hugo	✅	{#id}
CommonMark	❌	ไม่รองรับ
VitePress	✅	{#id}
Pandoc	✅	{#id}

กฎการสร้าง ID อัตโนมัติ

เมื่อไม่ได้กำหนด ID เอง ตัวเรนเดอร์ส่วนใหญ่จะสร้างจากข้อความหัวเรื่อง:

1. แปลงเป็นตัวพิมพ์เล็ก
2. ลบ/แทนที่อักขระพิเศษ
3. แทนที่ช่องว่างด้วยขีดกลาง
4. ลบขีดกลางซ้ำ
5. ทำให้ ID ไม่ซ้ำ (มักเติมเลขต่อท้าย)

ตัวอย่าง:

Heading	Auto-generated ID
## Getting Started	#getting-started
## FAQ & Help	#faq-help
## Quick Start	#quick-start หรือ #section-1 (ขึ้นกับแพลตฟอร์ม)

แนวปฏิบัติที่ดี

ข้อแนะนำการตั้งชื่อ ID

✅ แนวทางที่แนะนำ:

1. **ใช้ ID ที่สั้นและสื่อความหมาย**:
   - `{#installation}`
   - `{#api-reference}`
   - `{#troubleshooting}`

2. **คงรูปแบบการตั้งชื่อให้สม่ำเสมอ**:
   - ตัวพิมพ์เล็กทั้งหมด
   - ใช้ขีดกลางคั่นคำ
   - เลี่ยง underscore หรือ camelCase

3. **คงความเสถียรของ ID**:
   - หลีกเลี่ยงการเปลี่ยน ID บ่อย ๆ
   - คง ID เดิมเมื่อแก้ไขข้อความหัวเรื่อง

❌ ควรหลีกเลี่ยง:

1. ใช้อักขระพิเศษ (เช่น `!@#$%^&*()`)
2. ใช้ ID ที่ไม่บอกความหมาย (เช่น `{#section1}`)
3. ID ยาวเกินไป
4. ใช้ช่องว่างหรือเครื่องหมายวรรคตอน

โครงสร้างเอกสารและ Heading IDs

สำหรับเอกสารขนาดใหญ่ แนะนำให้กำหนด ID มาตรฐานกับบทหลักเพื่อช่วยการนำทาง:

# Product Documentation {#product-docs}

## Introduction {#introduction}

## Installation {#installation}

### Windows Installation {#installation-windows}

### macOS Installation {#installation-macos}

### Linux Installation {#installation-linux}

## Configuration {#configuration}

## API Reference {#api-reference}

## FAQ {#faq}

ตัวอย่างการใช้งานจริง

Heading IDs ในเอกสารเทคนิค

ช่วยให้ผู้ใช้ลิงก์ไปยังส่วนเฉพาะได้โดยตรง:

# API Documentation {#api-documentation}

## Authentication {#authentication}

### Getting API Keys {#get-api-key}

### OAuth Authentication {#oauth}

## Endpoints {#endpoints}

### User Endpoints {#endpoints-users}

### Product Endpoints {#endpoints-products}

Heading IDs ในงานวิชาการ

ใช้สร้างการอ้างอิงตัดกัน (cross-reference):

# Research Methodology {#methodology}

As shown in the [Research Results](#results), our method performs well in multiple test cases.

...

# Research Results {#results}

This section presents the experimental results described in our [Research Methodology](#methodology).

แนวทางแก้ปัญหาที่พบบ่อย

Heading IDs ใช้งานไม่ได้

หาก Heading IDs ไม่ทำงาน:

1. ตรวจสอบว่าแพลตฟอร์มรองรับการกำหนด ID ให้หัวเรื่อง
2. ยืนยันว่าไวยากรณ์ถูกต้อง (โดยทั่วไป {#id})
3. ตรวจสอบว่า ID ไม่มีอักขระผิดกติกา
4. ลองใช้ตัวเรนเดอร์ Markdown อื่น

การชนกันของ ID

หากมี ID ซ้ำกันในเอกสารเดียวกัน อาจทำให้เกิดพฤติกรรมลิงก์ที่คาดเดาไม่ได้:

## Issue {#issue} <!-- First ID -->

...

## Common Issues {#issue} <!-- Duplicate ID, may cause problems -->

แนวทางหลีกเลี่ยงการชนกันของ ID:

## Issue {#issue-description}

...

## Common Issues {#common-issues}

ช่องว่างและอักขระพิเศษ

ตัวเรนเดอร์บางตัวจัดการช่องว่าง/อักขระพิเศษใน ID ไม่เหมือนกัน:

<!-- อาจมีปัญหาในบางแพลตฟอร์ม -->
## Advanced Settings {#advanced settings}

<!-- ทางเลือกที่ปลอดภัยกว่่า -->
## Advanced Settings {#advanced-settings}

ไวยากรณ์ที่เกี่ยวข้อง

• ลิงก์ - ไวยากรณ์ลิงก์พื้นฐาน
• สารบัญ - สารบัญอัตโนมัติ
• ส่วนอ้างอิง - เพิ่มบันทึกอ้างอิงและคำอธิบาย

เครื่องมือและปลั๊กอิน

สร้างสารบัญอัตโนมัติ

มีเครื่องมือจำนวนมากที่สร้างสารบัญจากหัวเรื่องและ ID ได้อัตโนมัติ:

[[toc]]

# Chapter 1 {#chapter-1}

## Section 1.1 {#section-1-1}

# Chapter 2 {#chapter-2}

เครื่องมือตรวจสอบ ID

• markdownlint: ตั้งค่าเพื่อตรวจสอบความสม่ำเสมอของ Heading ID ได้
• remark-lint: มีการตรวจสอบและแก้ไขอัตโนมัติของ Heading ID
• markdown-toc: สร้างสารบัญพร้อมลิงก์อัตโนมัติ

---

Heading IDs เป็นเครื่องมือสำคัญที่ช่วยเพิ่มการใช้งานและการเข้าถึงของเอกสาร Markdown ด้วยการใช้ ID แบบมาตรฐาน คุณสามารถสร้างโครงสร้างลิงก์ที่คงทน ช่วยการนำทางและอ้างอิง ทำให้เอกสารดูเป็นมืออาชีพและเป็นมิตรกับผู้ใช้มากขึ้น