--- title: สร้างเว็บไซต์เอกสาร slug: th/user-guides/r4ksMOLcWMAHncqFaeis_ description: เรียนรู้วิธีเพิ่มเนื้อหาให้กับเอกสารของคุณอย่างมีประสิทธิภาพด้วย Archbee ค้นพบวิธีต่างๆ เช่น ทางลัดมาร์กดาวน์ ตัวเลือกการนำเข้า และการซิงก์กับ GitHub สำรวจคำแนะนำเกี่ยวกับการปรับแต่งเว็บไซต์ของคุณ การตั้งค่าโดเมนแบบกำหนดเอง การจัดการ createdAt: 2022-09-26T14:04:01.000Z --- เอกสารมีได้หลายลักษณะและหลายรูปแบบ คุณอาจมีข้อมูลบางส่วนอยู่แล้วหรืออาจต้องเริ่มจากศูนย์ มาดูกันว่าควรเพิ่มเนื้อหาใน Archbee อย่างไร ## เขียนใน Archbee เมื่อคุณสร้างเอกสารใหม่ คุณสามารถเริ่มเพิ่มเนื้อหาได้โดยใช้ **คีย์ลัด markdown **หรือหนึ่งใน **บล็อกแบบกำหนดเองกว่า 30 ชนิด** ได้ บล็อกแบบกำหนดเองช่วยให้คุณจัดรูปแบบเนื้อหาได้ตามต้องการ หากต้องการเปิด ให้พิมพ์เครื่องหมายทับ `/` ในตัวแก้ไขและดูตัวเลือกต่างๆ บล็อกต่างๆ ถูกจัดกลุ่มภายใต้หัวข้อ **พื้นฐาน**, **มีเดีย**, **นักพัฒนา**, **ฝัง**, และ **การนำเนื้อหากลับมาใช้ซ้ำ** ตัวอย่างเช่น หากคุณต้องการลิงก์ไปยังเอกสารอื่นแบบไดนามิก ให้พิมพ์ `@` และชื่อเอกสาร ซึ่งจะเชื่อมต่อกับ id ของเอกสาร หากคุณเปลี่ยนชื่อหรือย้ายตำแหน่งของเอกสาร ลิงก์ก็ยังคงชี้ไปที่เอกสารเดิมเสมอ อีกตัวอย่างหนึ่งคือการเรียกชื่อบล็อก กด `/` และพิมพ์ชื่อบล็อก เช่น `/verticalsplit` ซึ่งจะช่วยกรองบล็อกที่คุณต้องการใช้ ตัวเลือกที่สามคือการใช้วงเล็บและชื่อบล็อก เช่น **(api)** ซึ่งจะเพิ่มบล็อก API endpoint ### คัดลอก-วาง พี่น้องก็อปวางสไตล์คลาสสิก แต่ทำไมต้องพูดถึงเรื่องนี้? เนื่องจากตัวแก้ไขของ Archbee รองรับ Markdown หากคุณต้องการวางเนื้อหาในรูปแบบนี้ คุณอาจได้รับข้อความต่อไปนี้: :::BlockQuote เราตรวจพบเนื้อหา Markdown ในคลิปบอร์ดของคุณ คุณต้องการวาง Markdown ใช่หรือไม่? ::: หากคุณคลิกปุ่มยกเลิก เนื้อหาจะไม่ถูกเรนเดอร์ และหากคุณคลิกตกลงในหน้าต่างโต้ตอบ เราจะทำการแปลง Markdown ให้เป็นบล็อกของ Archbee ดังนั้นคุณจึงมีตัวอย่างโค้ดที่จะแสดงเป็นบล็อกตัวแก้ไขโค้ดใน Archbee ### นำเข้าไฟล์ Markdown หรือ Word การก็อปวางใช้งานได้ดี แต่ถ้าคุณมีไฟล์ Markdown หรือ Word ทำไมไม่ลองนำเข้ามาใน Space ล่ะ? ก่อนที่จะนำเข้าเนื้อหาใดๆ โปรดตรวจให้แน่ใจว่าคุณคลิกบน Space ที่คุณต้องการนำเข้าไฟล์ คุณเพิ่งคลิกเลือกประเภทไฟล์ที่คุณมีและประหยัดเวลาหลายนาทีจากการก็อปวางเนื้อหาจากแหล่งอื่น ### นำเข้าไฟล์ OpenAPI/Swagger หรือชุด Postman เมื่อพูดถึงการจัดทำเอกสาร API คุณมีตัวเลือกมากมาย สมมติว่าคุณกำลังใช้มาตรฐาน OpenAPI (เดิมคือ Swagger) ซึ่งช่วยให้สามารถนำเข้าและซิงค์ไฟล์ได้ง่าย เมื่อมีการนำเข้าไปยัง Archbee เนื้อหาจะถูกแสดงผลในเลย์เอาต์ 3 คอลัมน์ที่ช่วยให้จัดการเอกสารได้ง่าย ### ซิงค์รีโป GitHub บางครั้งเอกสารถูกเขียนไว้ในรีโพสิทอรี GitHub และคุณสามารถเขียนต่อใน GitHub และซิงค์รีโปกับ Space ของ Archbee ได้ ข้อดีคือคุณสามารถเผยแพร่ Space นั้นไปยังโดเมนกำหนดเองของคุณ และเพิ่ม Space อื่นๆ พร้อมข้อมูลเพิ่มเติม เช่น การอ้างอิง API ## ตั้งค่าโดเมนกำหนดเองและการควบคุมการเข้าถึง ก่อนที่คุณจะเริ่มต้นกับเนื้อหา ให้ทำขั้นตอนเล็กๆ ที่จะสร้างความแตกต่างในภายหลัง ตั้งค่าซับโดเมนของคุณเพื่อให้สามารถเข้าถึงสภาพแวดล้อมแบบพรีวิวและโปรดักชัน ไปที่ [หน้าเอกสาร](https://docs.archbee.com/hosting-spaces-on-a-custom-domain)และทำตามขั้นตอนเพื่อเพิ่มโดเมนกำหนดเองของคุณ ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/ihdZldxJRjXhZ6tQVFOIi_guides-domain-light.png) มีตัวเลือกหลายแบบให้ใช้งานภายใต้แท็บ **General** - คุณสามารถปิดการตั้งค่า **Indexable by search engines** (หากเป็นสาธารณะ) ได้จาก Space Settings เดียวกัน โดยทั่วไปคุณอาจต้องการให้เปิดใช้งานไว้เพื่อให้ผู้ใช้ค้นหาเว็บไซต์ของคุณจากหน้าผลลัพธ์ของเครื่องมือค้นหา คุณสามารถไปที่ตัวเลือก Public access control และเลือกหนึ่งในห้าตัวเลือกเพื่อการควบคุมที่มากขึ้น ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/blWxSmSe3Bv7Jvq4B6-Uh_guides-general-light.png) - **None** - ทำตามชื่อของมันอย่างตรงไปตรงมา คือเก็บการตั้งค่าของคุณเกี่ยวกับ Public Space ไว้เช่นเดิม - **Password** - ตั้งรหัสผ่านให้ Space ทุกคนที่มีลิงก์และรหัสผ่านจะสามารถอ่านเนื้อหาได้ - **Guest Accounts **- สร้างบัญชีผู้เยือน ทุกคนที่มีลิงก์และบัญชีผู้เยือนสามารถอ่านเนื้อหาได้ บัญชีผู้เยือนไม่ถูกนับเป็นที่นั่งที่ต้องชำระเงินใน Archbee - **Magic link **- คุณป้อนอีเมลเฉพาะหรืออนุญาตโดเมนทั้งหมด และผู้ใช้จะยืนยันตัวตนโดยใช้ลิงก์ที่เราส่งไปยังอีเมลของพวกเขา - **JWT authentication **- โปรดตรวจสอบ [\*\*หน้าเอกสาร\*\*](https://docs.archbee.io/authentication-options?__hstc=59513074.901e138137246d5bde4ccdbd22c4c426.1657529807386.1664186053341.1664199496535.118&__hssc=59513074.7.1664199496535&__hsfp=13091307)สำหรับวิธีตั้งค่า นี่เป็นตัวเลือกที่ยอดเยี่ยมหากคุณไม่ต้องการให้ผู้ใช้ต้องเข้าสู่ระบบทุกครั้ง ## เริ่มสร้างเพจ ก่อนที่คุณจะเขียนเอกสารใดๆ โปรดพิจารณาหัวข้อหลักที่คุณจะครอบคลุม ครั้งนี้การใช้ปากกาและกระดาษอาจช่วยให้คุณร่างโครงสร้างได้ จากนั้น สร้างเอกสาร แปลงมันเป็นหมวดหมู่ และกำหนดชื่อให้ เมื่อคุณมีสิ่งเหล่านี้แล้ว คุณก็พร้อมที่จะเพิ่มเอกสารภายใต้แต่ละหมวดหมู่ เริ่มต้นด้วยเอกสารที่แนะนำสิ่งสำคัญที่ผู้ใช้จะพบในเว็บไซต์เอกสาร ไม่จำเป็นต้องซับซ้อน นี่คือตัวอย่างที่เราใช้ใน**คู่มือผู้ใช้และนักพัฒนา**: - **เริ่มต้นใช้งาน** - **ตัวแก้ไข** - **เอกสาร** - **พื้นที่** - **พื้นที่ที่โฮสต์ให้** - **องค์กร** - **นำเข้าและส่งออก** - **การผสานรวม** - **คู่มือ** - **API สาธารณะ** - **เบ็ดเตล็ด** เมื่อคุณเริ่มเพิ่มเนื้อหา การมีเวิร์กโฟลว์เป็นสิ่งสำคัญ นี่คือตัวอย่างหนึ่งที่อาจใช้ได้ แต่คุณอาจต้องการปรับให้เหมาะสม: - เริ่มร่างใน **Personal docs** สิ่งนี้จะช่วยให้คุณเขียนสิ่งที่ยังไม่ต้องการแชร์กับทีมได้ - เมื่อพร้อมแล้ว ให้ **ย้าย** ไปยังพื้นที่สาธารณะ **Space** - **แจ้งเพื่อนร่วมทีม** ว่าเอกสารพร้อมแล้วและต้องการการรีวิว - หากมี ให้เพิ่ม **คอมเมนต์** แบบอินไลน์ในส่วนที่ต้องการความเห็นจากผู้ใช้อื่น - หลังจากคุณพอใจกับการแก้ไขแล้ว ให้ **เผยแพร่ไปยัง preview **เพื่อดูเว็บไซต์ staging - หากทุกอย่างเรียบร้อย ให้กด **publish to production** และประกาศว่าเนื้อหาทั้งหมดออนไลน์แล้ว การทำงานกับเทมเพลตช่วยให้ผู้เขียนเริ่มต้นสร้างเนื้อหาได้ง่ายขึ้น คุณสามารถบันทึกชุดเทมเพลตเพื่อช่วยให้การผลิตเนื้อหาเริ่มต้นได้อย่างรวดเร็ว หากคุณต้องการแรงบันดาลใจ เมื่อคุณสร้างเอกสารใหม่ คุณจะเห็นปุ่มที่ชื่อว่า เริ่มต้นด้วยเทมเพลต ที่ด้านล่างของหน้า ในการสร้างเทมเพลตของคุณเอง ให้ไปที่แถบนำทางด้านซ้าย เทมเพลต และเริ่มสร้างเอกสารด้วยโครงสร้างที่เอกสารของคุณต้องการ คุณอาจต้องการแนะนำบล็อกแบบกำหนดเองที่ผู้เขียนจะใช้ หรือเพิ่มตัวอย่างจากแหล่งอื่น ๆ ### ลิงก์ถาวรและการตั้งค่า SEO ตัวเลือกเหล่านี้อยู่ในระดับเอกสาร ดังนั้นคุณต้องคลิกที่จุดสามจุด`⋮` ที่มุมขวาบนและเลือก**การควบคุม SEO Meta**. เพิ่ม**ชื่อเรื่อง**ที่เกี่ยวข้อง เปลี่ยน**URL**, เขียน**คำอธิบายเมตา** หรือ**อัปโหลดรูปภาพ**สำหรับการแสดงตัวอย่าง ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/bHxgCTW8EyYZ1TqOak2HA_seo-modal-light.png) ## ปรับแต่งและสร้างแบรนด์ให้เว็บไซต์เอกสารของคุณ ในแท็บ **การแสดงผล** คุณจะพบกับตัวเลือกการปรับแต่ง เช่น **สีเน้น**, **โลโก้**, และ **ไอคอนเว็บไซต์ (Favicon)**, พร้อมตัวเลือกอื่นๆ สำหรับแม่แบบ. ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/iftMejOcUmqa9q8lY1Jhe_guides-apperance-light.png "ตัวเลือกการแสดงผลของ Archbee") ## สร้างเมนูนำทางด้วยหลายผลิตภัณฑ์หรือหลายเวอร์ชันของผลิตภัณฑ์ ขึ้นอยู่กับประเภทของผลิตภัณฑ์หรือบริการ คุณอาจต้องมีเส้นทาง URL ของ Space ที่แตกต่างกัน คุณสามารถมี Space เป็นเอกสารหลักและสร้าง Space อื่นๆ สำหรับผลิตภัณฑ์ต่างๆ หรือแม้แต่เวอร์ชันของผลิตภัณฑ์เหล่านั้นได้ มีทางลัด! คุณสามารถสร้างโคลนของ Space ใดก็ได้หากการเปลี่ยนแปลงเป็นแบบเพิ่มขึ้น ซึ่งจะช่วยให้คุณคงโครงสร้างเดิมและแก้ไขสำหรับเวอร์ชันใหม่ได้ง่ายขึ้น ดังนั้น หากคุณต้องการระบบเวอร์ชันหรือหลายผลิตภัณฑ์ ให้ใช้ Spaces ที่แตกต่างกันและเพิ่มเส้นทางที่เกี่ยวข้องหรือโดเมนกำหนดเอง ไปที่ [ลิงก์ Space](https://docs.archbee.com/space-links) และเริ่มสร้างระบบนำทางของคุณ ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/DlJ5An0ZMH5p14oHU0eUw_spacelinks-show-light.png "มุมมอง Space Links บนเทมเพลต Stripey") ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/PNTDeQDhJ1MCZwMIOpMM5_external-show-light.png "มุมมอง External Links บนเทมเพลต Stripey") ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/Gm7nDVmsIYMfyT580sRmk_version-show-light.png "มุมมอง Version Links บนเทมเพลต Stripey") ## สร้างหน้าแลนดิ้ง เป้าหมายหลักของโฮมเพจคือช่วยให้ผู้เข้าชมไปยังหน้าถัดไป การสร้างหน้าแลนดิ้งสำหรับเว็บไซต์เอกสารของคุณไม่จำเป็นต้องเป็นไปตามแนวทางเดียวกับเว็บไซต์นำเสนอ หน้าเอกสารแรกมีความสำคัญในการแนะนำผลิตภัณฑ์หรือบริการของคุณแก่ผู้ใช้ ดังนั้นการทำให้กระชับและกำหนดความคาดหวังจึงเป็นสิ่งสำคัญ ![](https://global-uploads.webflow.com/5f7178312623813d346b8936/62d13f507f7288f9eefe5678_archbee-user-guide.png) คุณสามารถใช้ฟีเจอร์ **[Custom landing page](https://docs.archbee.io/custom-landing-page?__hstc=59513074.901e138137246d5bde4ccdbd22c4c426.1657529807386.1664186053341.1664199496535.118&__hssc=59513074.7.1664199496535&__hsfp=13091307)** และเพิ่ม **HTML** ของคุณเพื่อควบคุมหน้าแรกได้มากขึ้น มีตัวเลือกมากมายให้หาแรงบันดาลใจ และหากคุณต้องการเปลี่ยนรูปลักษณ์และความรู้สึกของหน้าแรก นี่คือทางเลือกของคุณ นี่คือตัวอย่างว่าลูกค้ารายหนึ่งของเราได้สร้างหน้าเริ่มต้นสำหรับหน้าช่วยเหลือของพวกเขาอย่างไร ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/W78CicsWp6bniZbiQbrBn_guides-lpexample-light.png) ## เพิ่มโค้ดแบบกำหนดเอง ใช้ **[Custom CSS](https://docs.archbee.io/custom-css?__hstc=59513074.901e138137246d5bde4ccdbd22c4c426.1657529807386.1664186053341.1664199496535.118&__hssc=59513074.7.1664199496535&__hsfp=13091307)** หากคุณต้องการเพิ่ม **สไตล์** ของคุณลงในไซต์เอกสาร หากคุณคุ้นเคยกับ CSS classes คุณจะพบคลาสเริ่มต้นบางส่วนและสามารถเลือกใช้งานได้ ![](https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbN...)