วิธีใช้งาน Elementor Page Builder

เข้าใช้งาน Elementor Page Builder
เข้าใช้งาน Elementor โดยการคลิกที่ปุ่มสีฟ้า Edit with Elementor เพื่อเข้าใช้งาน Elementor Page Builder
โดยการเข้าใช้งาน Elementor มี 2 รูปแบบ ดังนี้

โครงสร้างของ Elementor

1. พื้นที่สร้างเว็บไซต์สามารถใส่เนื้อหาและจัดรูปแบบเว็บไซต์โดยใช้Widget ต่างๆ
2. เครื่องมือสําหรับใส่เนื้อหาและจัดรูปแบบเว็บไซต์ ( Widget )
3. Responsive View = ดูรูปแบบเว็บไซต์ในขนาดหน้าจออื่นๆ เช่น Desktop, Tablet หรือ Mobile
4. Preview Website = แสดงตัวอย่างเว็บไซต์
5. ปุ่ม Update&Publish = บันทึกและเผยแพร่เว็บไซต์

การเพิ่ม Section และการแบ่ง Column

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

การใช้ Widget สำหรับใส่เนื้อหาเว็บไซต์
Widgets คือ ชุดเครื่องมือสําหรับใส่เนื้อหา องค์ประกอบต่างๆ และปรับแต่งเว็บไซต์ให้สวยงาม แบ่งเป็นประเภท
ต่างๆ เช่น ข้อความ, รูปภาพ, ปุ่ม, วิดีโอ, ฯลฯ ซึ่งก่อนจะใส่ Widget ลงไปในเว็บไซต์ ให้สร้าง section ขึ้นมาก่อน
ตามขั้นตอนก่อนหน้านี้ Widgets ทั้งหมดจะอยู่ในแถบ Elements ด้านซ้ายมือ

สามารถลาก widget ที่ต้องการใช้งานโดยการคลิกที่ widget จากแถบ Elements ด้านซ้ายมือมาวางในคอลัมน์
ที่ต้องการ

หลังจากใส่ widget ให้ดูเมนูด้านซ้ายมือ จะเห็น settings สําหรับปรับแต่ง widget นั้น ซึ่งจะประกอบไปด้วยแถบ
1. Content = สําหรับตั้งค่าในส่วนของเนื้อหาของ widget นั้นๆ
2. Style = กําหนดรูปแบบ เช่น สี,ขนาดตัวอักษร,สีพื้นหลังเป็นต้น
3. Advanced = เกี่ยวกับการกําหนด layout
(หากไม่เห็น settings ให้คลิกเลือก widget ที่ลากมาวางใน Section อีกครั้ง)

แนะนำ Elementor Widgets

Heading
สําหรับใส่หัวข้อ ชื่อเรื่อง พาดหัวหรือข้อความที่เราต้องการเน้นหรือทําให้ดูน่าสนใจ

Text Editor สําหรับใส่ข้อความหรือเนื้อหาต่างๆ

Image สําหรับใส่รูปภาพ

Image size = ปรับขนาดรูปภาพ
Aligment = ปรับตําแหน่งของรูปภาพ
Link = ใส่ลิงค์ให้รูปภาพ

Video สําหรับใส่วิดีโอ

Basic Gallery สําหรับการแทรกรูปภาพเป็นแกลลอรี่

Button สร้างปุ่มสําหรับใส่ลิงก์เชื่อมโยงไปยังหน้าอื่นๆ

การบันทึกและเผยแพร่หน้าเว็บไซต์

ออกจากการใช้งาน Elementor

การออกจากการใช้งาน Elementor เพื่อกลับไปยังหน้าระบบหลังบ้านของ WordPress สามารถทําได้
โดยการคลิกที่ปุ่ม Hamburger Menu มุมบนซ้ายและคลิกที่ EXIT TO DASHBOARD