Pages

Thursday, September 19, 2013

สร้าง Form แบบง่ายๆ สำหรับ Joomla3 ด้วย Breezing Forms

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

     บทความนี้ขอเสนอวิธีสร้าง Form รับข้อมูลแบบง่ายๆ สะดวก รวดเร็ว ฟังค์ชั่นครบ และที่ขาดไม่ได้คือ ฟรี ครับ  เพื่อนๆ คงอยากจะทราบแล้วว่ามันคือ Extension ตัวไหนถึงได้เพียบพร้อมขนาดนี้  อย่ารอช้าเลยครับ  ไปดูกัน




     Breezing Forms  (ต่อไปขอเรียกว่า B.F.) หนึ่งใน Extension เสริมที่ผมเลือกใช้ในเว็บไซต์ของผมเอง   B.F. มีทั้งเวอร์ชั่นเต็ม(จ่ายเงิน) และเวอร์ชั่นฟรี  แต่แค่เวอร์ชั่นฟรีก็สามารถตอบโจทย์ของการใช้งานขั้นพื้นฐานได้มากมายครับ  ลองมาดูกันว่า B.F. สามารถใช้งานได้ง่ายอย่างที่กล่าวมาหรือไม่

     จากรูปจะเห็นได้ว่าฟอร์มของผมนั้นมีทั้ง Textfield , Textarea , Radio , Uploadfile และ Captcha รหัสป้องกันการสแปม   ทั้งหมดนี้ถ้าใช้ B.F. คล่องๆ จะสามารถทำเสร็จภายในไม่กี่นาที  แถมข้อมูลทั้งหมดจะถูกส่งไปในรูปแบบ Record เรียกขึ้นมาดูได้ง่ายๆ อีกด้วย

ขั้นตอนการติดตั้ง

1. โหลดโปรแกรม Breezing Forms ได้ >> ที่นี่ <<

2.  แตกไฟล์ออกมา  ที่ใช้มี 3 ไฟล์คือ Com , Mod และ Plg เลือกใช้ตามเวอร์ชั่นของ Joomla

3. Install ทั้ง 3 ไฟล์ลงเว็บไซต์  (วิธีลงขอไม่กล่างถึง)

4. ตรวจสอบการทำงานของ Breezing Forms ที่ Extension Manager  --> แท๊บ Manage  ค้นคำว่า Breezing  ที่แถบ Status ให้ติ๊กถูก เพื่อเปิดใช้งานทั้ง 3 ไฟล์


วิธีใช้งาน

1. ตั้งค่าตารางข้อมูล ที่ Components --> Breezing Forms --> Manage Records  มันจะตั้งค่าให้อัตโนมัติ  จะได้แถบตาราง Record ขึ้นมา

2. ไปที่ Manage Forms  จะมีวิธีสร้างฟอร์มให้เลือก 3 อย่าง  Quick Mode , Easy Mode  และ Classic Mode

2.1.  Quick Mode

     
     เมื่อเลือกสร้างฟอร์มแบบ Quick Mode จะพอหน้าจอแบบรูปด้านบน  เริ่มต้นจะมีฟอร์มเปล่าๆ อยู่ 1 ฟอร์ม  โดยสามารถปรับค่า Properties ของ Form ได้
         
     ปรับค่าของฟอร์มเสร็จแล้วให้กดที่ปุ่ม New page เพื่อสร้างหน้าที่หนึ่งก่อน ที่ Properties ของ Page สามารถสร้างข้อความที่อยู่ส่วนบนของ Form

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

     New element จะเป็นการใส่เครื่องมือลงในฟอร์ม เช่นการใส่ช่องรับข้อมูล และรูปภาพต่างๆ
       
สร้างส่วนประกอบฟอร์มตามที่ต้องการ




เมื่อรันออกมาจะได้ฟอร์มแบบง่ายๆ ครับ

------------------------------------------------------------------------------------------------

2.2 Easy Mode

     โหมดนี้ใช้งานโดยการลากวาง  ให้ลากเครื่องมือจากทางด้านซ้ายมาวางที่รูปแบบฟอร์มด้านขวา  แล้วตั้ง Element ให้เครื่องมือนั้นๆ ด้วย  

-----------------------------------------------------------------

2.3 Classic Mode

     เมื่อเข้าโหมดนี้จะเข้าสู่หน้าจอตั้งค่าให้ฟอร์มก่อนเป็นอันดับแรก  เมื่อตั้งชื่อ Title กับ Name แล้วกดเซฟจะกลับสู่หน้าแรก  จะมีฟอร์มที่เราตั้งค่าเมื่อครู่ขึ้นมา  ให้คลิ๊กที่ฟอร์มนั้นจะพบหน้าต่างการใช้งานดังนี้ 

     การใช้งานในโหมดนี้เริ่มจากการกด New จะมีเครื่องมือขึ้นมาให้เลือก


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


-----------------------------------------------------------------------

     3. การนำตารางไปใช้  ทำได้โดยการไปที่ Module Manager เลือกสร้างโมดูลเป็น BreezingForms  ตั้งค่าให้เรียบร้อย  ที่สำคัญคือ ที่แท๊บ Option ให้ใส่ชื่อ Form ให้ตรงกับชื่อที่เราตั้งให้ฟอร์มที่เราจะนำมาใช้  แค่นี่้เราก็สามารถนำฟอร์มไปวางตามส่วนต่างๆ ของเว็บไซต์  หรือใช้คำสั่งเรียกใช้โมดูลเพื่อทำลิงค์ก็ได้นะครับ
ใส่ชื่อ Form ให้ถูกต้อง

     4. ข้อมูลที่ถูกส่งกรอกส่งมาจะถูกนำไปเก็บไว้ที่ คอมโพแนนต์ Breezing Forms ---> Manage Record ข้อมูลจะถูกจัดเป็นตารางง่ายๆ ครับ


     Breezing Forms ยังสามารถปรับค่าต่างๆ ได้อีกมากมาย ซึ่งผมคงไม่ได้อธิบายได้ละเอียดมากขนาดนั้น  ซึ่งหวังว่าเพื่อนๆ จะนำไปประยุกต์ใช้ให้ตรงตามใจของเพื่อนๆ นะครับ  สำหรับวันนี้สวัสดีครับ







       
       

2 comments:

  1. This comment has been removed by the author.

    ReplyDelete
  2. แล้วมันเก็บข้อมูลไว้ไหนครับบ

    ReplyDelete