galaxy-class-schedule

ลิงก์ประจำสาขา (ใช้ภายในทีมเท่านั้น)

เอกสารนี้ไม่ได้ผูกอยู่ในหน้าเว็บไหนเลย และไม่มีหน้าไหนลิงก์มาถึงมันได้ เปิดจากที่นี่ตรง ๆ ตอนจะคัดลอกลิงก์ไปส่งลูกค้า อย่าพิมพ์ URL เอง ให้ก๊อปจากตารางนี้เท่านั้น เพื่อกันพิมพ์ผิดสาขา (bangna ↔ rangsit ↔ vibhavadi หน้าตาคล้ายกันมาก)

รังสิตมี 2 ลิงก์แยกกลุ่มผู้เข้าถึง — member (ตารางเต็ม) กับ jin (ตารางย่อยสำหรับลูกบ้าน) สองอันนี้ยิ่งต้องระวังเป็นพิเศษ เพราะ URL คล้ายกันมากและเนื้อหาต่างกันจริง (ไม่ใช่แค่บางส่วน) ส่ง member ให้ลูกบ้านผิด = เห็นคลาสที่ไม่มีสิทธิ์เข้า ส่ง jin ให้สมาชิกผิด = เห็นตารางไม่ครบ

ตารางลิงก์

สาขา	โฟลเดอร์	URL ที่ส่งลูกค้า	สถานะ
บางนา (Bangna)	/bangna/	https://lioladex.github.io/galaxy-class-schedule/bangna/	✅ ใช้งานจริง
วิภาวดี (Vibhavadi)	/vibhavadi/	https://lioladex.github.io/galaxy-class-schedule/vibhavadi/	✅ ใช้งานจริง
สาทร (Sathorn)	/sathorn/	https://lioladex.github.io/galaxy-class-schedule/sathorn/	✅ ใช้งานจริง
รังสิต — สมาชิก (Rangsit Member)	/rangsit/member/	https://lioladex.github.io/galaxy-class-schedule/rangsit/member/	✅ ใช้งานจริง
รังสิต — จิน/ลูกบ้าน (Rangsit Jin)	/rangsit/jin/	https://lioladex.github.io/galaxy-class-schedule/rangsit/jin/	✅ ใช้งานจริง

เช็กก่อนส่งให้ลูกค้าทุกครั้ง

• เปิดลิงก์จริงในเบราว์เซอร์ก่อนส่ง — อย่าเชื่อจากการอ่านตัวอักษร ให้ดูป้าย “📍 สาขา…“ ใต้โลโก้ในหน้าที่เปิดขึ้นมาว่าตรงกับที่ตั้งใจ
• เทียบชื่อสาขาในแชทที่คุยกับลูกค้า กับป้ายสาขาที่เห็นในหน้าเว็บ ให้ตรงกันคำต่อคำ
• ถ้าไม่แน่ใจ เปิดเอกสารนี้แล้วก๊อป URL จากตารางด้านบนใหม่ อย่าแก้จากลิงก์เก่าที่เคยส่งไปสาขาอื่น

ทำไมแต่ละสาขาถึงแยกกันชัดเจน

• แต่ละสาขาเป็นไฟล์ index.html คนละไฟล์ ไม่มีหน้ารวมหรือลิงก์เชื่อมข้ามสาขา
• แต่ละหน้ามีป้าย “📍 สาขา…” ต่อว่ากันไม่ให้เผลอ, <title> แท็บเบราว์เซอร์ก็บอกชื่อสาขาไว้แล้ว
• แต่ละสาขามีสีเน้นของตัวเอง (ปรับได้ที่ --plasma / --ion ในไฟล์นั้น ๆ) เพื่อให้ดูออกได้จากภาพรวมโดยไม่ต้องอ่านตัวหนังสือก่อน
• ทุกหน้าใส่ noindex และมี robots.txt กัน Google เก็บลิงก์ไปแสดงในผลค้นหา ลดโอกาสที่ลูกค้าจะเจอสาขาอื่นเองจากการค้นหา

เพิ่มสาขาใหม่

1. ก๊อปโฟลเดอร์ bangna/ ทั้งโฟลเดอร์ ตั้งชื่อใหม่ตามสาขา (ตัวพิมพ์เล็ก ไม่มีเว้นวรรค เช่น rangsit)
2. ในไฟล์ index.html ของโฟลเดอร์ใหม่ แก้ 4 จุด:
   • <title> และแท็ก og:title / og:description ใน <head>
   • const BRANCH = { key:'...', name:'สาขา...', nameEn:'...' }
   • --plasma / --ion ให้เป็นสีที่ไม่ซ้ำสาขาอื่น
   • ตารางคลาสในบล็อก const STUDIOS = { ให้ตรงกับสาขานั้น
3. สร้างรูปพรีวิวลิงก์ (ขึ้นตอนแชร์ลิงก์ใน LINE/Messenger ฯลฯ):
   • เขียน SVG ขนาด 1200×630 ลายเดียวกับของเดิม (ดูตัวอย่างโครงสร้างได้จากซอร์สโค้ดที่แชทประวัติการทำงาน หรือถามทีมพัฒนา) ใส่ nameEn — อย่าใช้ชื่อไทยในรูปนี้ เพราะตัวแปลง SVG→PNG ที่ใช้ (rsvg-convert ผ่าน ImageMagick) ไม่มีฟอนต์ไทย จะกลายเป็นกล่องสี่เหลี่ยม
   • แปลงเป็น .jpg ด้วย magick file.svg -background "#0B0A16" -flatten -strip -quality 85 file.jpg แล้วลบ .svg ต้นทางทิ้ง (ไม่ต้องเก็บไว้ในโปรเจกต์)
   • วางที่ assets/og/<สาขา>.jpg แล้วอัปเดตแท็ก og:image / twitter:image ใน <head> ให้เป็น URL เต็ม (ไม่ใช่ path สัมพัทธ์) เช่น https://lioladex.github.io/galaxy-class-schedule/assets/og/<สาขา>.jpg
4. เพิ่มแถวในตารางลิงก์ด้านบนของเอกสารนี้
5. เช็กลิสต์ก่อนส่งให้ลูกค้าเหมือนเดิม

สาขาที่มีหลายกลุ่มผู้เข้าถึง (แบบรังสิต member/jin)

ถ้าสาขาไหนต้องมีตารางคนละชุดสำหรับคนละกลุ่ม (เช่น สมาชิกทั่วไป vs ลูกบ้าน/นิติบุคคล) ให้ทำ path ลึกลงไปอีกชั้นแทนที่จะรวมในหน้าเดียว:

<สาขา>/<กลุ่ม>/index.html    เช่น  rangsit/member/index.html
                                    rangsit/jin/index.html

• ทั้งสองไฟล์แชร์รูปคลาสร่วมกันได้ (assets/images/<สาขา>/) เพราะเป็นสถานที่เดียวกัน — แก้ path รูปเป็น ../../assets/... (ลึกขึ้นอีกชั้นจากไฟล์ปกติที่ใช้ ../assets/...)
• แชร์สีเน้น (--plasma/--ion) เดียวกันได้เพราะเป็นแบรนด์เดียวกัน ไม่ต้องแยกสีเหมือนแยกคนละสาขา
• แต่ ห้ามลิงก์เชื่อมกันระหว่างสองไฟล์เด็ดขาด — หลักการเดียวกับการแยกสาขา แค่ระดับลึกกว่า
• ตั้ง BRANCH.name ให้ต่างกันชัดเจน เช่น สาขารังสิต (Member) กับ สาขารังสิต (จิน) และใส่ 2 แถวแยกกันในตารางลิงก์ด้านบน — ห้ามรวมเป็นแถวเดียว เพราะเนื้อหาจริง ๆ ต่างกัน