วิธีสร้างเว็บไซต์ ฉบับมือใหม่ ทำเองได้ง่าย ๆ ไม่ต้องเขียนโค้ด

เตรียมข้อมูลเหล่านี้ไว้ จะช่วยให้แก้ไขหน้าเว็บได้ต่อเนื่อง:

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

ภาพประกอบในบทความเป็นหน้าเดโม ชื่อร้าน เมนู และข้อมูลตัวอย่างควรเปลี่ยนเป็นข้อมูลจริงของคุณก่อนเผยแพร่

เข้า Tinyfront แล้วไปที่หน้าแดชบอร์ด กด สร้างหน้าใหม่ และเลือก เริ่มจากเทมเพลต

กรองหมวด ร้านอาหาร แล้วเปิดดูตัวอย่างดีไซน์ที่สนใจ ในตัวอย่างนี้เราเลือก Trattoria Editorial ซึ่งมีพื้นที่สำหรับภาพอาหาร ข้อความแนะนำร้าน เมนู และข้อมูลติดต่อ

เมื่อเลือกได้แล้ว กด ใช้เทมเพลต จากนั้นกด Create my page เพื่อสร้างหน้าใหม่และเข้าสู่หน้าแก้ไขเว็บไซต์ หรือ Editor

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

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

ข้อความหน้าแรกควรตอบให้ได้ว่า “นี่คือร้านอะไร” และ “ลูกค้าทำอะไรต่อได้” ลองแบ่งเป็นสามส่วน:

• หัวเรื่องหลัก: ประโยคสั้น ๆ ที่อยากให้คนจำ เช่น “มื้ออร่อย เริ่มที่โต๊ะเดียวกัน”
• คำอธิบายสั้น ๆ: บอกประเภทอาหารหรือรูปแบบบริการตามข้อมูลจริงของร้าน
• ปุ่มหลัก: เลือกสิ่งที่อยากให้ลูกค้าทำต่อ เช่น ดูเมนูหรือติดต่อร้าน พร้อมตรวจปลายทางของปุ่ม

จากนั้นตรวจเนื้อหาส่วนอื่นให้ครบ ทั้งรูปอาหาร รายการเมนู ราคา เรื่องราวร้าน และข้อมูลติดต่อ อย่าลืมเปลี่ยนข้อมูลตัวอย่างจากเทมเพลตก่อนเปิดเว็บให้ลูกค้าใช้

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

ในเดโมนี้เราเปลี่ยนจากโทนอุ่นเป็น Sage เพื่อให้เห็นว่าชุดสีเปลี่ยนบรรยากาศของหน้าเว็บได้อย่างไร คุณยังเลือกปรับสี ข้อความ และรูปทรงผ่านแท็บในแผงธีมได้

หลังเปลี่ยนธีม ลองดูว่าข้อความบนภาพอ่านชัดหรือไม่ ปุ่มหลักมองเห็นง่ายแค่ไหน และสีที่เลือกเข้ากับรูปอาหารของร้านหรือเปล่า

หากร้านมีลูกค้าทั้งคนไทยและต่างชาติ ให้เตรียมเนื้อหาสำหรับแต่ละภาษาด้วย ตัวอย่างนี้มี EN และ ไทย อยู่แล้ว จึงสลับภาษาที่กำลังแก้ไขจากแถบด้านบนได้ทันที

หากต้องการภาษาอื่น ใช้ปุ่ม เพิ่มภาษา แล้วตรวจข้อความให้ครบในภาษานั้น โดยเฉพาะหัวเรื่อง รายละเอียดเมนู ปุ่มติดต่อ และเวลาเปิด–ปิด

หลังแก้ข้อความภาษาใดภาษาหนึ่ง ควรตรวจอีกภาษาด้วยว่าข้อมูลยังตรงกัน การมีตัวเลือกภาษาเพียงอย่างเดียวไม่ได้หมายความว่าข้อความทุกส่วนได้รับการตรวจแล้ว

ก่อนเผยแพร่ ลองสลับปุ่ม เดสก์ท็อป และ มือถือ ในแถบเครื่องมือ เพื่อดูการจัดวางบนหน้าจอแต่ละขนาด

ตรวจทีละจุดโดยเริ่มจากสิ่งที่ลูกค้าต้องใช้:

• ชื่อร้านและหัวเรื่องอ่านครบหรือไม่
• เมนู ราคา และคำอธิบายอ่านง่ายหรือเปล่า
• รูปภาพแสดงส่วนสำคัญของอาหารหรือบรรยากาศร้านได้ดีไหม
• ปุ่มดูเมนูและติดต่อร้านมองเห็นชัดหรือไม่

ตรวจทั้งไทยและอังกฤษ เพราะข้อความสองภาษาอาจขึ้นบรรทัดต่างกัน จากนั้นใช้ ดูตัวอย่าง เพื่อตรวจหน้าเว็บก่อนเผยแพร่

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

ในหน้าตรวจสอบก่อนเผยแพร่ ระบบจะแสดงที่อยู่สาธารณะให้ดู ตัวอย่างนี้ใช้ tinyfront.co/tiny-table-demo หากต้องการแก้ไข ให้กด เปลี่ยนที่อยู่

เมื่อที่อยู่ถูกต้องแล้ว กด ใช้ที่อยู่นี้และเผยแพร่ และรอข้อความยืนยันว่าเผยแพร่สำเร็จ

หลังเผยแพร่สำเร็จ กด เปิดหน้าเว็บจริง จากหน้าต่างแชร์ เพื่อดูเว็บไซต์ที่ลูกค้าจะเข้าชม

ลองเปิดเมนู สลับภาษา และตรวจปลายทางของปุ่มติดต่ออีกครั้ง รวมถึงเปิดลิงก์บนโทรศัพท์จริงก่อนส่งให้ลูกค้า

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

ดูเว็บไซต์เดโมร้านอาหาร

หลังเผยแพร่ เว็บไซต์ของคุณมี QR Code สำหรับแชร์ลิงก์ ลูกค้าสแกนด้วยมือถือเพื่อเปิดหน้าเว็บและดูเมนูได้ เหมาะกับการวางไว้หน้าร้าน บนโต๊ะ หรือในสื่อของร้าน

1. กด แชร์ ในหน้า Editor หลังเผยแพร่ แล้วเลือก QR สำหรับแชร์
2. ตรวจลิงก์สาธารณะและกด เปิดหน้าเว็บจริง เพื่อเช็กปลายทาง
3. กด ดาวน์โหลด PNG เพื่อนำรูป QR ไปใส่ในสื่อของร้าน

หากต้องการป้ายพร้อมจัดวาง ใช้ ป้าย QR ตั้งโต๊ะ จากแถบเครื่องมือ เลือกรูปแบบ สี ภาษา และข้อความบนป้าย แล้วดูตัวอย่างก่อนพิมพ์ ป้ายต้นฉบับเป็น A6 และจัดพิมพ์ได้ 4 ป้ายต่อ A4

ลองสแกนจากกระดาษจริงก่อนนำไปใช้ หากเปลี่ยนที่อยู่เว็บไซต์ ต้องสร้างและพิมพ์ QR ใหม่ การสแกน QR นี้เปิดหน้าเว็บไซต์ ไม่ได้ส่งออเดอร์หรือชำระเงินอัตโนมัติ

ดูตัวอย่างป้ายได้ฟรี ส่วนการพิมพ์หรือดาวน์โหลด PDF ของป้ายตั้งโต๊ะใช้แพ็กเกจ Pro

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

1. เปิด ใบจดออเดอร์ จากแถบเครื่องมือใน Editor
2. ตรวจเมนู ราคา รหัส และตัวเลือกในแท็บ รายการ การแก้ข้อมูลสินค้าในแท็บนี้จะอัปเดตสินค้าบนเว็บไซต์ด้วย
3. ใช้แท็บ การจัดวาง เพื่อเลือกรูปแบบ จำนวนคอลัมน์ ขนาดตัวอักษร และภาษาของแต่ละใบ
4. ใช้แท็บ ข้อมูลที่แสดง เพื่อเลือกหมวด ราคา รหัสเมนู ตัวเลือก และพื้นที่จดหมายเหตุที่ต้องการ
5. ตรวจตัวอย่าง แล้วกด พิมพ์ หรือ ดาวน์โหลด PDF หากต้องการไฟล์ ให้เลือก บันทึกเป็น PDF ในหน้าต่างพิมพ์

เลือกกระดาษ A4 แนวกระดาษให้ตรงกับแบบ และขนาดจริง 100% ตรวจว่ารายการครบก่อนพิมพ์หลายชุด ดูตัวอย่างได้ฟรี ส่วนการพิมพ์หรือดาวน์โหลด PDF ใช้แพ็กเกจ Pro

ลูกค้าสแกน QR เพื่อดูภาพและรายละเอียดเมนู แล้วลูกค้าหรือพนักงานใช้ใบจดออเดอร์บันทึกรายการบนกระดาษได้ ใบนี้เป็นแบบฟอร์มสำหรับเขียน ไม่ใช่ระบบรับออเดอร์ออนไลน์หรือส่งรายการเข้าครัวอัตโนมัติ

เว็บไซต์ร้านอาหารหน้าแรกอาจเริ่มจากข้อมูลที่ลูกค้าต้องการมากที่สุด: ร้านขายอะไร มีเมนูไหน ราคาเท่าไร และติดต่ออย่างไร แล้วค่อยเพิ่มรายละเอียดเมื่อพร้อม

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