17 ตุลาคม 2010 ผู้ชม: 11574
 แบบฟอร์มสำหรับรับการติดต่อจากผู้เยี่ยมชม หรือจะเป็นฟอร์มลงทะเบียนต่างๆ เอ่... ผมเรียกมันว่าแบบฟอร์มเอนกประสงค์ก็แล้วกัน เพราะมันสามารถสร้างแบบฟอร์มตามที่เราอยากจะให้มีได้ เพื่อที่จะให้ผู้เยี่ยมชมได้ระบุข้อมูลต่างๆ แล้วส่งมายังอีเมลของเราเอง หรือจะบันทึกไว้ในฐานข้อมูลก็ได้ |
Component CK Forms เป็นคอมโพเน้นท์หนึ่งที่สามารถสร้างแบบฟอร์มได้โดยง่าย กำหนดรูปแบบของ Field (ฟิลด์) ข้อมูลได้เอง และยังสามารถ Custom CSS ได้เองในแต่ละฟิลด์อีกด้วย มีระบบ Captcha ป้องกันสแปมในการกรอกข้อมูลอีก อูยยย เริ่มอยากใช้แล้ว งั้นติดตั้งเลยละกันครับ
ติดตั้งเสร็จแล้วก็จะยังไม่มีข้อมูลอะไรหรอก ว่างเปล่าครับ ซึ่งมีเมนูเริ่มต้นก็เท่านี้
ไม่รอช้า กดปุ่ม New เพื่อสร้างฟอร์มแรก ก็จะพบกับ Tab หลายแถบ อย่าเพิ่งมึน โฮ ครับไปทีละแถบกันเลย
General
Name : ชื่อของฟอร์ม ซึ่งต้องตั้งชื่อฟอร์มให้เป็นตัวอักษรภาอังกฤษตัวพิมพ์เล็ก ใหญ่ หรือเป็นตัวเลขอารบิกเท่านั้น
Title : ชื่อที่จะแสดงให้ผู้ใช้งานเห็นว่าฟอร์มนี้ คือฟอร์มชื่อว่าอะไร จะตั้งอย่างไรก็ตามสบาย
Publish : กำหนดการแสดงผลฟอร์ม ว่าเปิดใช้งาน หรือ ปิดใช้งานฟอร์มนี้
Description : รายละเอียดข้อความของฟอร์มนี้ ที่ให้ผู้ใช้งานได้รับทราบ
Result
Save result : กำหนดว่าจะให้บันทึกลงในฐานข้อมูลด้วยหรือไม่ ซึ่งเราสามารถนำมาเรียกดูภายหลังได้
Text result : เมื่อผู้ใช้งาน Submit ฟอร์มเข้ามาแล้ว ให้แสดงข้อความอะไรแก่ผู้ใช้งาน
Redirect URL : ถ้าเรากำหนด URL ไว้ในช่องนี้ , เมื่อผู้ใช้ Submit ฟอร์มเข้ามาแล้ว ก็จะทำการ Redirect เว็บเพจไปยังหน้าที่ต้องการได้
Redirect form data : ถ้ากำหนด URL ไว้ในช่องด้านบนแล้ว ก็ต้องปรับตรงนี้ให้เป็น Yes ด้วยครับ การ Redirect จึงจะทำงาน
ตรงนี้จะแบ่งเป็น 2 ส่วนนะครับ ผมจะแนะนำส่วนบนก่อน
Email result : ให้ส่งข้อมูลการ Submit Form ไปยังอีเมลด้วยหรือไม่
Mail FROM : กำหนดว่า เมลที่ถูกส่งไปนั้น ให้แสดงว่า ถูกส่งมาจากใคร หรือ อีเมลใด
Mail TO : กำหนดอีเมลที่จะให้ส่งข้อมูลไป
Mail CC และ Mail BCC : สำเนาข้อมูลไปยังอีเมลอื่นด้วย
Mail Subject : หัวข้ออีเมลที่จะกำหนดให้ส่งไป
Include fileupload file : จะบอกก่อนว่า CK Forms สามารถกำหนดให้ผู้ใช้งานสามารถอัพโหลดไฟล์เข้ามาได้ด้วย ถ้ากำหนด Option นี้ไว้ เมื่อมีการส่งข้อมูลไปแจ้งยังอีเมล ก็ให้นำไฟล์ที่ผู้ใช้อัพโหลดเข้ามา แนบไฟล์ไปกับอีเมลนั้นด้วย
ต่อไปส่วนที่ 2 ด้านล่างครับ
Email receipt : เมื่อผู้ใช้ Submit Form แล้ว ก็ให้ส่งอีเมลกลับไปหาผู้ใช้งานคนนั้นด้วย ซึ่งจะใช้ได้ก็ต่อเมื่อ Field ที่เราสร้าง มีการสร้างฟิลด์ประเภท Email Address ไว้ ซึ่งมันจะทำงานอัตโนมัติครับ เมื่อผู้ใช้งานระบุอีเมลลงในฟิลด์ที่เราสร้างขึ้น , ฟอร์มนี้ก็จะนำอีเมลนั้น มาจัดการส่งข้อมูลกลับไปยังอีเมลที่ผู้ใช้งานได้ใส่มาให้เอง
Email receipt Text : ข้อความที่จะแสดงผลไปกับอีเมล ที่ส่งกลับไปหาผู้ Submit Form ด้วย
Include data : นำข้อมูลที่ผู้ Submit นั้น ส่งไปพร้อมกับอีเมลด้วย
Include fileupload file : แนบไฟล์ที่ผู้ใช้งานได้แนบส่งมาในฟอร์ม กลับไปยังอีเมลนั้นด้วย ตรงนี้ผมไม่แนะนำครับ เพราะจะเปลืองพื้นที่มากกว่า แต่ถ้าใครต้องการใช้งาน ก็ไม่ว่ากัน
Advanced
Use Captcha : ใช้รหัสปลอดภัยป้องกันสแปมมาใช้งานแบบฟอร์มหรือไม่
Captcha tips text : ข้อความแจ้งให้ผู้ใช้งานทราบเกี่ยวกับ Captcha
Captcha custom text error : ข้อความแจ้งให้ผู้ใช้งานทราบ เมื่อไม่ได้ระบุรหัส Captcha ก่อน Submit Form
CSS class : อย่างที่บอกครับ สามารถกำหนด CSS เพื่อแสดงผลได้เอง ถ้าไม่ต้องการก็ปล่อยว่างไว้
Uploaded files path : พาทสำหรับเก็บไฟล์ที่ผู้ใช้งานอัพโหลดผ่าน Ck Forms มา
File uploaded maximum size : ขนาดไฟล์สูงสุดที่อนุญาตให้อัพโหลดเข้ามาได้
Display "powered by" text : และใจดีสุด สามารถซ่อน Credit ของ CK Forms ได้ด้วยครับ
Frontend display
Display IP address : แสดง IP address ที่แบบฟอร์มด้วย
Display Data detail : แสดงรายละเอียดข้อมูลที่เราได้ Submit ไป
สำหรับ 2 ตัวเลือกด้านบน หากกำหนดเป็น No ก็จะไม่แสดงให้เห็นในแบบฟอร์ม แต่สำหรับการส่งเข้าอีเมลหรือการบันทึกไว้ในฐานข้อมูล ก็ยังคงแสดงผลให้เห็นเป็นปกติ
Auto Publish data : แบบฟอร์มที่ Submit ไปแล้วนั้น จะให้เผยแพร่และอ่านได้ทางหน้าเว็บได้เลยหรือไม่ ถ้ากรณีทำแบบฟอร์มสำหรับการติดต่อที่ผู้ดูแลระบบอ่านได้อย่างเดียว ก็แนะนำให้ปิดไว้ครับ เพราะถ้าไม่ปิดไว้ และมีผู้ใช้งานหัวใส ก็สามารถเรียก URL ขึ้นมาดูได้
Title และ Description : หัวข้อแบบฟอร์มและคำอธิบายที่แสดงให้เห็นในแบบฟอร์ม
ถ้าพอใจการตั้งค่าแบบฟอร์มนี้แล้ว ก็กดปุ่ม Save ได้เลยครับ
เราก็จะได้แบบฟอร์มขึ้นมา 1 ฟอร์ม ซึ่งเราต้องทำความเข้าใจก่อนว่า มันเป็นเพียงแค่แบบฟอร์มว่างๆ ยังไม่มีช่องให้ผู้ใช้งานกรอกข้อมูลเลย ดังนั้น เราจะต้องไปสร้างช่องให้ผู้ใช้สามารถกรอกข้อมูลต่างๆ ได้ ซึ่งเหล่านี้เราจะเรียกว่าฟิลด์ (Field) , และแต่ละฟิลด์ เราก็สามารถกำหนดได้ว่า จะให้ฟิลด์นั้นกรอกอะไรได้บ้าง เช่น ให้กรอกตัวเลขเท่านั้น หรือตัวภาษาอังกฤษเท่านั้น เป็นต้น และก็เช่นเคย ติดตามบทความต่อไปละกัน ผมจะพาไปสร้างฟิลด์เพื่อใช้งานแบบฟอร์มนี้ให้สมบูรณ์ พร้อมกับการนำฟอร์มไปแสดงผลในรูปแบบต่างๆ ตามสถานการณ์
| ← สร้าง Field และนำ CK Form ไปแสดงผล | สร้างแผนที่ด้วย Phoca Map → |
|---|
