ข้ามไปยังเนื้อหาหลัก

Elementor Tutorial: แนะนำอินเตอร์เฟส

Divi: ธีม WordPress ที่ใช้ง่ายที่สุด

Divi: ธีม WordPress ที่ดีที่สุดของเวลาทั้งหมด!

ขึ้น ดาวน์โหลด 901.000 แล้วDivi เป็นธีม WordPress ที่ได้รับความนิยมมากที่สุดในโลก สมบูรณ์และใช้งานง่ายและมาพร้อมกับเทมเพลตฟรีมากกว่า 62 [แนะนำ]

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

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

สถานที่รับ Elementor สำหรับ WordPress

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

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

คุณสมบัติหลักของ Elementor

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

รุ่นฟรี เวอร์ชั่นเต็ม
หลายคอลัมน์ เมนูนำทางบทความ
โมดูลข้อความ, ชื่อเรื่อง โมดูล WooCommerce (ผลิตภัณฑ์หมวดหมู่)
โมดูลวิดีโอ, รูปภาพ, ม้าหมุน, แกลเลอรี่, Soundcloud การรวม Facebook (หน้า, ปุ่ม, ความคิดเห็น)
แชร์โมดูล ราคาตาราง
โมดูล HTML Portfolio, Form
โมดูลสำหรับเครื่องมือ WordPress โมดูลการวิจัย

 

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

เริ่มต้นใช้ Elementor

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

หน้างานนำเสนอ

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

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

ปลั๊กอินแจ้งเตือน elementor.png

เพียงแค่คลิกเพื่อไปที่หน้าลงทะเบียนและคลิกที่ กระตุ้น.

การลงทะเบียนใบอนุญาต elementor.png

โดยปกติคุณจะต้องมีหน้ายืนยันหากใบอนุญาตของคุณถูกต้อง

สร้างเว็บไซต์ของคุณอย่างง่ายดายด้วย Elementor

Elementor ช่วยให้คุณสร้างการออกแบบเว็บไซต์ได้อย่างง่ายดายด้วยรูปลักษณ์แบบมืออาชีพ หยุดจ่ายเงินแพงสำหรับสิ่งที่คุณสามารถทำได้ด้วยตัวเอง [ฟรี]

ใบอนุญาตใช้งาน elementor.png

หากคุณไม่มาที่หน้านี้ฉันขอเชิญคุณติดต่อผู้พัฒนาปลั๊กอินเพื่อขอข้อมูลเพิ่มเติม ความช่วยเหลือเกี่ยวกับปัญหา.

วิธีการใช้ Elementor

Elementor ทำงานบนเพจและโพสต์บน WordPress ไม่ว่าคุณจะใช้อินเทอร์เฟซแบบคลาสสิกหรืออินเทอร์เฟซ Gutenberg ใหม่คุณจะเห็นปุ่มที่จะแจ้งให้คุณใช้ตัวสร้าง Elementor

constructor elementor.png

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

presentation interface elementor.png

คุณจึงมีตัวควบคุมต่างๆที่ปลั๊กอินนำเสนอทางด้านซ้ายและทางด้านขวาคุณจะมีตัวอย่างการเปลี่ยนแปลงของคุณ ในบทช่วยสอนนี้เราใช้ธีม Twenty Sixteen WordPress

ส่วน Elementor

Elementor Sections คือกลุ่มของบล็อกการทำงานที่ Elementor นำเสนอ จำนวนส่วนขึ้นอยู่กับว่าคุณใช้เวอร์ชันเต็มหรือไม่และคุณกำลังใช้ WooCommerce, Yoast SEO หรือปลั๊กอินอื่น ๆ ที่เข้ากันได้ ขึ้นอยู่กับเงื่อนไขเหล่านี้คุณจะมีส่วนมากหรือน้อยบนอินเทอร์เฟซของคุณ เนื่องจากเราใช้เวอร์ชันเต็มโดยเปิดใช้งานปลั๊กอิน WooCommerce นี่คือลักษณะของอินเทอร์เฟซของเรา

ส่วน elementor.png

วิธีการวางบล็อก Elementor

เมื่อคุณขยายส่วนคุณจะพบ Elementor Blocks บล็อก Elementor ต่างๆวางโดย "ลากและวาง" บนพื้นที่ที่เน้นด้วยเส้นประ

เพิ่มบล็อค elementors.png

วิธีเลือกเค้าโครงใน Elementor

ก่อนที่จะเพิ่มบล็อกใน Elementor คุณต้องจำไว้ว่าให้เลือกเค้าโครงโดยคลิกปุ่ม“ +” ในส่วนที่ไฮไลต์

เลือกเลย์เอาท์ layoutor.png

คุณกำลังมองหาธีมและปลั๊กอิน WordPress ที่ดีที่สุดหรือไม่?

ดาวน์โหลดปลั๊กอินและธีม WordPress ที่ดีที่สุดใน Envato และสามารถสร้างเว็บไซต์ของคุณได้ง่ายๆ ดาวน์โหลดมากกว่า 49.720.000 [EXCLUSIVE]

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

ส่วน elementor กับ zone.png

บล็อกต่างๆที่มีเครื่องหมาย "+" อยู่ด้านในคือพื้นที่ที่สามารถรับบล็อก Elementor ได้ หากคุณเพิ่มบล็อก Elementor โดยไม่เลือกเค้าโครงก่อนเค้าโครงคอลัมน์เดียวจะถูกเลือกโดยค่าเริ่มต้น

คุณสามารถจัดเรียงส่วนองค์ประกอบใหม่ได้โดยใช้หลักการ "ลากและวาง" เดียวกัน คุณยังสามารถลบส่วนได้หากคุณไม่ต้องการใช้อีกต่อไป

การย้ายองค์ประกอบ elementor.png

นี่คือตัวอย่างของส่วนที่มี 2 บล็อกคือบล็อกหัวเรื่องและบล็อกข้อความ

ส่วนที่มี 2 blocs.png

วิธีใช้เครื่องมือออกแบบอื่น ๆ

หลังจากออกแบบเสร็จแล้วสิ่งหนึ่งที่คุณต้องทำคือบันทึกงานของคุณ คุณจะพบตัวเลือกนี้ที่ด้านล่างสุดของส่วนที่แสดงส่วนของ Elementor ต่างๆ

backup elementor.png

คุณมีทางเลือกระหว่างการบันทึกโดยตรง (เผยแพร่) และบันทึกเป็นฉบับร่างหรือเป็นเทมเพลต เราจะสำรวจจุดต่างๆเหล่านี้เพิ่มเติมในภายหลัง

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

ตัวอย่างของการเปลี่ยนแปลง elementor.png

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

action elementor.png

สิ่งนี้จะช่วยให้คุณย้อนกลับไปได้ง่าย

สร้างร้านค้าออนไลน์ได้อย่างง่ายดาย

ดาวน์โหลดฟรี WooCommerce ปลั๊กอินอีคอมเมิร์ซที่ดีที่สุดในการขายผลิตภัณฑ์ทางกายภาพและดิจิทัลของคุณบน WordPress [แนะนำ]

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

ตัวเลือกเบราเซอร์ elementor.png

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

การตั้งค่า elementor.png

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

บทความนี้ประกอบด้วยข้อคิดเห็น 0

แสดงความคิดเห็น

ที่อยู่อีเมลของคุณจะไม่ถูกเผยแพร่ ช่องที่ต้องการถูกทำเครื่องหมาย *

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

กลับไปด้านบน