บล็อกข้อมูลสำเร็จรูป

คุณสามารถออกแบบเว็บไซต์ของคุณโดย:ref:การลากและวางบล็อกการสร้าง <website/building_blocks/add> จากนั้น:ref:`แก้ไขบล็อก <website/building_blocks/edit>`ให้เหมาะกับเนื้อหาและความต้องการเค้าโครงของคุณ

ดูเพิ่มเติม

NightPOS Tutorial: Design your website: text and colors

เพิ่มบล็อกการสร้าง

เมื่อต้องการเพิ่มบล็อกลงใน:doc:หน้าเว็บไซต์ <../structure/pages> ให้เข้าถึงหน้านั้น คลิก:guilabel:แก้ไข จากนั้นลากและวางบล็อกการสร้างที่ต้องการไปยังตำแหน่งที่เหมาะสม มีบล็อกการสร้างสองประเภท: หมวดหมู่`และ:guilabel:`เนื้อหาภายใน บล็อกการสร้าง:guilabel:`เนื้อหาภายใน`สามารถเพิ่มได้เฉพาะภายในบล็อกการสร้าง:guilabel:`หมวดหมู่`เท่านั้น

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

Tip

ค้นหาบลอกเฉพาะเจาะจงในหน้าต่างป๊อปอัป แทรกบลอก โดยใช้แถบค้นหา

การเลือกบล็อกแบบป๊อปอัป

เมื่อวางบล็อกหมวดหมู่แล้ว คุณสามารถลากและวางบล็อก:guilabel:`เนื้อหาภายใน`ไว้ภายในได้ บล็อก:guilabel:`เนื้อหาภายใน`ช่วยให้คุณสามารถเพิ่มองค์ประกอบต่างๆ เช่น วิดีโอ รูปภาพ ปุ่มโซเชียลมีเดีย ฯลฯ ลงในบล็อกหมวดหมู่ที่มีอยู่แล้ว

Note

  • คุณยังสามารถเพิ่มบล็อกการสร้างบนหน้าเข้าสู่ระบบได้ เมื่อต้องการดำเนินการดังกล่าว ให้ไปที่หน้าแรกของเว็บไซต์ เพิ่ม /web/login ลงใน URL แล้วกด Enter

  • การเข้าถึงบล็อกบางอย่างจำเป็นต้องติดตั้งแอปพลิเคชันหรือโมดูลที่เกี่ยวข้อง (เช่น อีคอมเมิร์ซสำหรับบลอก สินค้า)

Example

เพิ่มบัญชีโซเชียลมีเดียทั้งหมดของคุณในที่เดียวด้วยบล็อกเนื้อหาภายใน:guilabel:โซเชียลมีเดีย เปิดหรือปิดสวิตช์ถัดจากแพลตฟอร์มที่ต้องการ แล้วคัดลอก/วาง URL บัญชีของคุณ

บล็อกเนื้อหาภายในโซเชียลมีเดีย

ฟอร์ม

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

ตัวอย่างบล็อกฟอร์ม

การดำเนินการ

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

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

ฟิลด์

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

  • เปลี่ยนฟิลด์ ประเภท

    Tip

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

    ฟิลด์ฟอร์มทุกประเภท

    ฟิลด์บางประเภทมีลักษณะคล้ายกัน แต่ข้อมูลที่ป้อนต้องเป็นไปตามรูปแบบเฉพาะ

  • แก้ไข ป้ายชื่อ ของฟิลด์และปรับ ตำแหน่ง ของมัน

  • เปิดใช้งาน คำอธิบาย ของฟิลด์ เปิดสวิตช์แล้วคลิกที่คำอธิบายเริ่มต้นในฟอร์มเพื่อแก้ไข

  • เพิ่ม ตัวยึดตำแหน่ง หรือ ค่าเริ่มต้น

  • ระบุว่าฟิลด์ จำเป็น หรือไม่

  • แก้ไขการตั้งค่า การมองเห็น ของฟิลด์

  • เพิ่ม ภาพเคลื่อนไหว

เมื่อคุณทำการเปลี่ยนแปลงที่ต้องการแล้ว ให้คลิก บันทึก

Add an NightPOS contact form on a non-NightPOS website

You can display an NightPOS contact form on another website using an iframe. To do so, follow these steps:

  1. Prepare the NightPOS form: Create a contact form on a page in NightPOS Website and remove the header design and the footer design. Make sure only the contact form remains on the page.

  2. Generate an embeddable code: Copy the URL of the NightPOS form page and paste it into an iframe generator, such as La Digitale.dev or iFrame Generator . Adjust the width and height for proper display.

  3. Add the embedded code to the non-NightPOS website: Open the relevant page’s HTML (in the code editor or CMS) and insert the embedded code where the form should be displayed.

Example

ตัวอย่างของโค้ดที่ฝังไว้:

<iframe src="https://example.com/nightpos-form"
        style="border:0;"
        name="nightposForm"
        scrolling="no"
        frameborder="0"
        marginheight="0"
        marginwidth="0"
        height="400px"
        width="600px"
        allowfullscreen>
 </iframe>

รหัสที่ถูกฝัง

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

หลังจากลากและวางบลอก โค้ดฝังตัว จากส่วน เนื้อหาภายใน ลงในหน้า ให้คลิกที่บลอก จากนั้นไปที่แท็บ สไตล์ แล้วคลิก แก้ไข แทนที่โค้ดตัวยึดตำแหน่งด้วยโค้ดฝังตัวที่กำหนดเองของคุณ

เพิ่มลิงก์ไปยังโค้ดฝังที่คุณต้องการชี้ไปที่

Warning

อย่าคัดลอก/วางโค้ดที่คุณไม่เข้าใจ เพราะอาจทำให้ข้อมูลของคุณตกอยู่ในความเสี่ยง

ย้าย สลับ ทำซ้ำ หรือลบบล็อกการสร้าง

ดึงเส้นขอบสีเขียวบนบล็อกเพื่อลดหรือเพิ่มพื้นที่ที่ด้านบนหรือด้านล่างของมัน

เปลี่ยนลำดับบล็อกโดยคลิก (เชฟรอนขึ้น) หรือ (เชฟรอนลง) และย้ายบล็อกบนหน้าโดยคลิก (ลูกศร) เมื่อคุณมีหลาย คอลัมน์ ให้ย้ายคอลัมน์ไปทางซ้ายหรือขวาโดยคลิก (เชฟรอนซ้าย) หรือ (เชฟรอนขวา)

หากต้องการทำซ้ำบล็อกการสร้าง ให้คลิก (ทำซ้ำ) เมื่อทำซ้ำแล้ว บล็อกใหม่จะปรากฏบนหน้าใต้บล็อกต้นฉบับ

Tip

อีกทางหนึ่ง ให้คลิกไอคอน (ทำซ้ำ) ที่ด้านบนของแท็บ สไตล์ เพื่อทำซ้ำบล็อกที่เลือก

หากต้องการลบบล็อก ให้คลิก (ถังขยะ)

ขยายระยะขอบของบล็อกสร้าง

แก้ไขบล็อกสร้าง

หากต้องการแก้ไขเนื้อหาของบล็อกการสร้าง ให้คลิกที่บล็อกแล้วไปที่แท็บ สไตล์ ตัวเลือกการปรับแต่งที่มีจะแตกต่างกันไปตามประเภทของบล็อกที่เลือก

ดูเพิ่มเติม

พื้นหลัง

หากต้องการแก้ไขพื้นหลังของบล็อกการสร้าง ให้เลือกบล็อก ไปที่แท็บ สไตล์ แล้วคลิกจุดสีหรือตัวเลือก พื้นหลัง อื่น ๆ คุณสามารถเปลี่ยนสีและ/หรือเพิ่มรูปภาพ วิดีโอ และ/หรือรูปร่าง เมื่อคุณเลือกรูปร่างแล้ว ฟิลด์ใหม่จะปรากฏขึ้นเพื่อให้คุณปรับแต่งรูปร่างได้

Tip

  • จัดตำแหน่งองค์ประกอบ (รูปภาพ ข้อความ ฯลฯ) ไว้ด้านหลังหรือด้านหน้าองค์ประกอบอื่นโดยใช้ไอคอน ส่งไปด้านหลัง หรือ นำมาด้านหน้า

    เปลี่ยนตำแหน่งบล็อก

  • หากต้องการปรับขนาดบล็อก ให้คลิกและลากจุดรอบขอบเพื่อปรับตามต้องการ

    ปรับขนาดบล็อก

ดูเพิ่มเติม

ธีมทั่วไป

เค้าโครง: กริดและคอลัมน์

สำหรับบล็อกการสร้างส่วนใหญ่ คุณสามารถเลือกระหว่างรูปแบบเค้าโครงสองแบบ: กริด หรือ คอลัมน์ (cols) หากต้องการเปลี่ยนรูปแบบเค้าโครงเริ่มต้น ให้คลิกที่บล็อก ไปที่แท็บ สไตล์ และตั้งค่าฟิลด์ เค้าโครง เป็น กริด หรือ คอลัมน์

ตาราง

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

เมื่อเลือกเค้าโครงแบบกริดแล้ว ให้เลือกรูปภาพและลากและวางไปยังตำแหน่งที่ต้องการ

Cols

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

Note

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

บันทึกบล็อกสร้างแบบกำหนดเอง

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

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

Tip

ในป๊อปอัป แทรกบล็อก ให้คลิก (แก้ไข) เพื่อเปลี่ยนชื่อบล็อกแบบกำหนดเอง หรือ (ลบ) เพื่อลบ