สุดยอด Visual นักแต่งเพลงลากและวางคู่มือการสร้างหน้าสำหรับ WordPress

สุดยอดคู่มือสำหรับนักแต่งเพลงภาพสำหรับ WordPress

Visual Composer กลายเป็นหนึ่งในปลั๊กอินสร้างหน้าขายอันดับต้นสำหรับ WordPress ตั้งแต่เปิดตัวเมื่อเดือนพฤษภาคม 2554 ปลั๊กอินได้ขยายออกไปพร้อมกับลูกค้ามากกว่า 150,000 ราย (และนั่นไม่นับผู้ใช้นับแสนคนที่ได้รับสำเนาที่มาพร้อมกับธีม) ส่วนเสริมและส่วนขยายมากกว่า 200 รายการและการตรวจสอบเชิงบวกนับร้อยรายการ เว็บ.


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

พบกับนักแต่งเพลง

เครื่องมือสร้างเพจ Visual Composer

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

การติดตั้ง The Visual Composer

ก่อนที่คุณจะสร้างเพจของคุณเองคุณจะต้องดาวน์โหลดและติดตั้ง Visual Composer มีสองวิธีในการรักษาความปลอดภัยให้กับปลั๊กอิน: ซื้อ สำเนาของคุณเอง หรือ ซื้อ ธีมพรีเมี่ยม ด้วยปลั๊กอินที่รวมอยู่ ปลั๊กอินทำงานเหมือนกันทุกประการ ไม่ว่าคุณจะเลือกเส้นทางแบบใดความแตกต่างเพียงอย่างเดียวในสองวิธีนี้คือวิธีที่คุณติดตั้ง.

ตัวเลือกที่ 1: ซื้อสำเนาของคุณเองเพื่อใช้บนเว็บไซต์ WordPress ของคุณ

วิธีแรกในการคัดลอก Visual Composer คือการซื้อปลั๊กอินสำหรับตัวคุณเอง เพียงไปที่ CodeCanyon เพิ่มสำเนาของ Visual Composer ลงในตะกร้าของคุณ (เราขอแนะนำให้เพิ่มการสนับสนุนพิเศษเพื่อให้คุณได้รับความช่วยเหลืออย่างเต็มที่จากผู้เขียนโปรแกรมเสริมเมื่อทำการกำจัด) และทำการซื้อให้เสร็จสิ้น.

ซื้อนักแต่งเพลง

ถัดไปนำทางไปยังหน้าดาวน์โหลดของคุณ คลิกที่ปุ่มดาวน์โหลดสีเขียวที่อยู่ถัดจากปลั๊กอิน Visual Composer ที่คุณเพิ่งซื้อและเลือกไฟล์ WordPress ที่ติดตั้งได้เท่านั้น.

ดาวน์โหลด The Visual Composer

ตอนนี้เข้าสู่แดชบอร์ด WordPress ของคุณและนำทางไป ปลั๊กอิน> เพิ่มใหม่. คลิกที่ อัปโหลดปลั๊กอิน ปุ่มที่ด้านบนของหน้าจอ.

อัปโหลดปลั๊กอินนักแต่งเพลงภาพ

เลือกไฟล์ zip นักแต่งเพลงที่คุณดาวน์โหลดจาก CodeCanyon จากนั้นเพียงคลิกเพื่อติดตั้งและเปิดใช้งานปลั๊กอิน.

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

คลิกเพื่อเปิดใช้งาน Visual Composer

สิ่งนี้จะเปิดพอร์ทัลเพื่อให้คุณอนุญาตให้ WPBakery ยืนยันการซื้อของคุณ คลิกสีเขียวขนาดใหญ่ อนุมัติ ปุ่ม. ไม่ต้องกังวล – คุณเพียงแค่ให้สิทธิ์ WPBakery เพื่อยืนยันว่าชื่อผู้ใช้ / อีเมลของคุณซื้อสำเนานักแต่งเพลงจริงๆ.

เปิดใช้งาน Via Envato

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

ตัวเลือกที่ 2: Visual Composer ถูกรวมกับธีม WordPress ของคุณ

หากคุณซื้อชุดรูปแบบที่มีการติดตั้ง Visual Composer ที่แตกต่างกันและมันยังสามารถแตกต่างกันไปตามผู้เขียน เราจะแสดงวิธีติดตั้งปลั๊กอินหากคุณใช้ธีม WPExplorer เช่นยอดรวม (และควรใกล้เคียงกับธีมพรีเมี่ยมอื่น ๆ ส่วนใหญ่).

ก่อนอื่นคุณจะต้องดาวน์โหลดและติดตั้งธีม WordPress ของคุณ หากคุณซื้อชุดรูปแบบจาก Themeforest เป็นกระบวนการเดียวกับการดาวน์โหลด Visual Composer เข้าสู่บัญชี Themeforest ของคุณและไปที่หน้าดาวน์โหลดของคุณ จากนั้นค้นหาธีมของคุณคลิกที่ปุ่มดาวน์โหลดและเลือกไฟล์ WordPress ที่ติดตั้งได้เท่านั้น.

ดาวน์โหลด WordPress Theme

ต่อไปเข้าสู่การติดตั้ง WordPress ของคุณและคลิกที่ ลักษณะที่ปรากฏ> ธีม> เพิ่มใหม่. จากนั้นคลิกที่ อัพโหลดธีม ตัวเลือกที่ด้านบนของหน้า คุณจะต้องเปิดไฟล์ zip ที่ดาวน์โหลดเพื่อค้นหาไฟล์ WordPress ที่ติดตั้งได้ นี่เป็นเพราะธีมรวมนั้นมาพร้อมกับคุณสมบัติเพิ่มเติมเช่นปลั๊กอินพรีเมียมข้อมูลตัวอย่างและไฟล์ PSD.

ติดตั้งธีม WordPress รวม

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

ปลั๊กอินที่แนะนำทั้งหมด

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

ติดตั้งปลั๊กอินที่แนะนำ

นั่นคือทั้งหมดที่คุณต้องทำ! ไม่จำเป็นต้องเปิดใช้งาน Visual Composer ผ่าน Envato เพราะคุณซื้อชุดรูปแบบแทนที่จะเป็นปลั๊กอินของคุณเอง คุณไม่มีรหัสใบอนุญาตในการตรวจสอบ และคุณจะไม่สามารถเข้าถึงการอัปเดตปลั๊กอินได้จนกว่าผู้แต่งชุดรูปแบบจะมีให้คุณ.

การเปิดใช้งาน Visual Composer ที่เป็นตัวเลือก

แน่นอนถ้าคุณต้องการซื้อสำเนาของคุณเองเพื่อรับการอัปเดตที่เร็วขึ้นคุณอาจทำได้อย่างแน่นอน แต่ไม่จำเป็นต้องใช้ Visual Composer กับชุดรูปแบบของคุณ ด้วยสิ่งนั้นคุณสามารถไปที่จริงโดยใช้ปลั๊กอิน.

เริ่มต้นใช้งานด้วยเครื่องมือสร้าง Visual Composer Page Builder

ตอนนี้คุณได้ติดตั้ง Visual Composer แล้วก็ถึงเวลาเริ่มต้นด้วยการตั้งค่าปลั๊กอินของคุณ ในแดชบอร์ด WordPress ของคุณคุณควรเห็นตัวเลือก Visual Composer คลิกที่ภาพเพื่อเปิดหน้าการตั้งค่าของคุณ.

การตั้งค่าทั่วไปของนักแต่งเพลงภาพ

การตั้งค่าทั่วไป แท็บมีตัวเลือกง่าย ๆ สำหรับการเปิด / ปิดการใช้งานองค์ประกอบตอบสนองจากการซ้อนบนหน้าจอขนาดเล็ก (เพื่อให้คุณสามารถมีแถวคอลัมน์สามคอลัมน์มาตรฐานกลายเป็นสามแถวคอลัมน์เดี่ยวเทียบกับการหดแถวคอลัมน์สามแถวบนมือถือ) เลือกชุดย่อยแบบอักษรของ Google และปุ่มพักผ่อน สำหรับการเปิดใช้งานการแนะนำการใช้ Visual Composer.

Visual Composer Role Manager

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

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

องค์ประกอบตัวสร้างหน้า

องค์ประกอบของเครื่องมือสร้างเพจ Visual Composer

Visual Composer มาพร้อมกับตัวสร้างหน้ามาตรฐาน 34 องค์ประกอบสำหรับคุณสมบัติมากมายที่คุณต้องการเพิ่มในหน้าเว็บของคุณ (ภาพด้านบนแสดงให้เห็นทั้งหมดรวมถึงองค์ประกอบฟอร์มติดต่อ 7 ที่เราจะพูดถึงในภายหลัง) องค์ประกอบหลายอย่างรวมถึงตัวเลือกเพิ่มเติมสำหรับสีเส้นขอบการเว้นระยะขอบ CSS ที่กำหนดเองภาพเคลื่อนไหวและอื่น ๆ นี่คือบทสรุปอย่างรวดเร็วของสิ่งที่รวมอยู่:

  • แถว คือหน้าของหน้าของคุณ คุณจะใช้องค์ประกอบแถวเพื่อสร้างคอลัมน์และแทรกองค์ประกอบหน้าอื่น ๆ ของคุณทั้งหมด.
  • บล็อคข้อความ เป็นสิ่งที่พวกเขาฟัง – บล็อกของข้อความ การใช้เครื่องมือแก้ไข WordPress WYSIWYG มาตรฐานคุณสามารถเพิ่มและจัดรูปแบบข้อความด้วยโมดูลนี้.
  • ไอคอน รวมไอคอนแบบอักษรจากไลบรารีไอคอนต่อไปนี้: FontAwesome, Open Iconic, Typicons, Entypo, Linecons และ Mono Social.
  • ตัวคั่นและตัวคั่นพร้อมข้อความ เป็นวิธีในการสร้างบรรทัด (และหรือข้อความ) แบ่งระหว่างส่วนที่คุณสร้างในหน้าของคุณ.
  • กล่องข้อความ เหมาะอย่างยิ่งสำหรับการเพิ่มบันทึกการแจ้งเตือนหรือบริการนวดชนิดบรรจุกล่องอื่น ๆ.
  • Facebook, ทวีต, Google+ และ Pinterest ปุ่มการแบ่งปันทางสังคมที่เรียบง่ายทั้งหมดที่คุณสามารถเพิ่มให้ผู้ใช้แบ่งปันหน้าเว็บที่คุณกำลังสร้าง.
  • คำถามที่พบบ่อย เป็นสลับที่สามารถใช้สำหรับการเพิ่มเนื้อหาที่ซ่อนผู้ใช้สามารถเปิดเผยเมื่อพวกเขาอ่านหน้าของคุณ.
  • รูปภาพเดี่ยว เป็นเพียง – ภาพง่ายๆที่มีตัวเลือกเพิ่มเติมสำหรับการปรับขนาดภาพเคลื่อนไหวลิงค์และอื่น ๆ.
  • แท็บทัวร์และหีบเพลง คล้ายกับคำถามที่พบบ่อยซึ่งมีเนื้อหาที่ซ่อนอยู่หรือยุบได้ แต่เปิดส่วนแรกไว้.
  • คอนเทนเนอร์ Pageable เป็นตัวเลื่อนเนื้อหาพื้นฐาน (แต่คุณสามารถแทรกองค์ประกอบตัวสร้างหน้าใด ๆ ลงในแต่ละคอนเทนเนอร์ “หน้า”).
  • หัวเรื่องที่กำหนดเอง ทำให้ง่ายต่อการเพิ่มส่วนหัวของคุณเองไปยังส่วนต่างๆโดยใช้แบบอักษรที่กำหนดเองการปรับขนาดสีและอื่น ๆ.
  • ปุ่ม อนุญาตให้คุณเพิ่มลิงค์ไปยังหน้าอื่นหรือเว็บไซต์ภายนอก.
  • คำกระตุ้นการตัดสินใจ เป็นกล่องคำบรรยายภาพพร้อมปุ่มเพิ่มที่ดึงดูดความสนใจของผู้ใช้และช่วยให้คุณเพิ่มเนื้อหาที่น่าเชื่อถือเล็กน้อย.
  • แถบด้าน Widgetised ช่วยให้คุณสามารถแทรกแถบด้านข้างของคุณเองที่ใดก็ได้ในหน้า.
  • เครื่องเล่นวีดีโอ ทำให้ง่ายต่อการแทรกรูปแบบวิดีโอต่าง ๆ ที่ WordPress รองรับ.
  • Google Maps เป็นอีกตัวเลือกที่ตรงไปตรงมา – เพียงวางในรหัส Google Map ของคุณเพื่อแทรกแผนที่ในหน้าของคุณ.
  • แถบความคืบหน้าแผนภูมิวงกลมแผนภูมิวงกลมและแผนภูมิเส้น ทุกวิธีในการสร้างกราฟหรือแสดงข้อมูลหรือทักษะ.
  • พื้นที่ว่าง ทำให้ง่ายต่อการเพิ่มตัวแบ่งแนวตั้งระหว่างองค์ประกอบ.
  • Post, Media, Post Masonry และ Media Masonry Grids เป็นกริดที่กำหนดเองทั้งหมดที่คุณสามารถเพิ่มไปยังหน้า (ด้วยตัวเลือกในการมิกซ์และจับคู่โพสต์หรือประเภทสื่อ).

องค์ประกอบเครื่องมือนักแต่งเพลงภาพ

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

Visual Composer Extensions

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

องค์ประกอบของเครื่องมือสร้างเพจทั้งหมดสำหรับนักแต่งเพลงที่มองเห็น

วิธีแรกในการ ขยาย Visual Composer ของคุณผ่านชุดรูปแบบของคุณ. ตัวอย่างที่ดีคือธีม WordPress รวมของเราซึ่งมีองค์ประกอบของตัวสร้างหน้าเพิ่ม 39 รายการ สิ่งเหล่านี้รวมอยู่ใน Total เพื่อทำงานกับคุณลักษณะของมันดังนั้นคุณต้องติดตั้งชุดรูปแบบและใช้งานเพื่อใช้งาน ยอดรวมรวมถึงส่วนขยายสำหรับประเภทโพสต์ที่กำหนดเอง (ข้อความรับรอง, พนักงาน, พอร์ตการลงทุน), แกลเลอรีที่กำหนดเอง, แถบเลื่อนที่เรียบง่าย, โซเชียลและอื่น ๆ อีกมากมาย สิ่งนี้ช่วยให้คุณเพิ่มเนื้อหาที่คุณต้องการได้ง่ายขึ้น.

Addons Visual Composer บุคคลที่สาม

หากธีมของคุณไม่มีส่วนขยายใด ๆ คุณสามารถติดตั้งได้ ส่วนขยายนักแต่งเพลงภาพบุคคลที่สาม. สิ่งเหล่านี้มีตั้งแต่ฟรีจนถึง $ 55 และมีให้บริการจากผู้เขียนหลายคนใน CodeCanyon และในเว็บ หากคุณต้องการเพิ่มคุณสมบัติพิเศษบางอย่างเช่นตารางการกำหนดราคาและโซเชียลดังนั้นปลั๊กอิน Symple Shortcodes ฟรีเป็นวิธีที่จะไป (เราสร้างที่นี่ที่ WPExplorer หลังจากทั้งหมด) หากคุณต้องการเพิ่มตัวเลือกเพิ่มเติมของเรือบรรทุกสินค้าปลั๊กอินพิเศษเช่น Ultimate Add-on อาจเหมาะกับคุณ มีหลายร้อยตัวเลือก – คุณสามารถดู รายการส่วนเสริมที่เข้ากันได้ทั้งหมด ใน WPBakery.

อย่างไรก็ตามคุณเลือกที่จะขยาย Visual Composer ของคุณเราขอแนะนำให้คุณ อย่าใช้ธีมและส่วนขยายปลั๊กอินทั้งหมดพร้อมกัน. มากขึ้นไม่ได้ดีกว่าเสมอ – โดยเฉพาะในกรณีนี้ สิ่งนี้ไม่เพียง แต่จะสร้างตัวเลือกที่ซ้ำซ้อนและซ้ำซ้อนมากมาย แต่มันจะทำให้ไซต์ของคุณช้าลงอย่างมากด้วย ดังนั้นเลือกส่วนขยายที่เหมาะกับคุณที่สุดและติดกับมัน.

การแก้ไขแบ็กเอนด์และส่วนหน้า

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

ตัวแก้ไขแบ็กเอนด์ของ Visual Composer

ตัวแก้ไขแบ็กเอนด์ของ Visual Composer

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

เครื่องมือแก้ไขแบ็กเอนด์นั้นใช้งานค่อนข้างง่าย เพียงคลิกที่ปุ่มสีน้ำเงินสำหรับ โปรแกรมแก้ไขแบ็กเอนด์ เพื่อเปิดใช้งาน Visual Composer สำหรับหน้าหรือโพสต์ที่คุณกำลังแก้ไข.

เปิดใช้งานตัวแก้ไขแบ็กเอนด์

จากนั้นคลิกที่ปุ่มสีฟ้าครามเพื่อ +เพิ่มองค์ประกอบ.

เพิ่มองค์ประกอบผ่านตัวแก้ไขแบ็กเอนด์

จากที่นี่คุณสามารถเริ่มแทรกองค์ประกอบของหน้าใด ๆ และทั้งหมดที่คุณต้องการ!

Visual Frontos Composer Editor

Visual Frontos Composer Editor

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

หากต้องการเปิดใช้งานการแก้ไขส่วนหน้าคลิกที่หนึ่งในสอง แก้ไขส่วนหน้า ตัวเลือกสำหรับหน้าหรือโพสต์ของคุณ.

เปิดใช้งาน Frontend Editor

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

เพิ่มองค์ประกอบผ่านตัวแก้ไขส่วนหน้า

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

การเพิ่มและแก้ไของค์ประกอบของหน้า

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

นักแต่งเพลงภาพ: แก้ไขแถว

ตัวเลือก Visual Composer Row

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

  • ครั้งแรก ไอคอนแถว เป็นที่ที่คุณสามารถคลิกเพื่อลากและวางแถวไปยังตำแหน่งใหม่บนหน้าของคุณ.
  • ดินสอ ไอคอนจะเปิดตัวเลือกสำหรับการตั้งค่าแถวของคุณ สิ่งเหล่านี้อาจแตกต่างกันไปตามธีมของคุณ ด้วยชุดรูปแบบรวมคุณจะเห็นตัวเลือกสำหรับรหัสเลื่อนท้องถิ่นการยืดแถว (สำหรับแถวเต็มความกว้าง) แถวความสูงเต็มความสูงขั้นต่ำความสามารถในการมองเห็นบนมือถือเนื้อหาตรงกลางคอลัมน์ความสูงเท่ากันภาพเคลื่อนไหวตัวอักษรความกว้างสูงสุด วิดีโอพื้นหลังหรือพารัลแลกซ์และตัวเลือกการออกแบบ (ระยะขอบเส้นขอบช่องว่างสี / ภาพพื้นหลัง).
  • คอลัมน์ คือการกำหนดจำนวนคอลัมน์ในแถวของคุณ มีตัวเลือกเริ่มต้นสำหรับ 6 คอลัมน์ แต่คุณสามารถกำหนดเค้าโครงคอลัมน์ที่กำหนดเองได้หากต้องการ.
  • บวก เพิ่มแถวใหม่ใต้แถวที่คุณกำลังแก้ไข.
  • ซ้ำ ไอคอนจะโคลนแถวปัจจุบันของคุณและเนื้อหาทั้งหมด (หรือองค์ประกอบทั้งหมดที่คุณแทรกเข้าไปในแถว) สิ่งนี้ดีมากถ้าคุณต้องการใช้เค้าโครงแถวซ้ำหลายครั้งในหน้าเดียวกัน.
  • ขยะ เป็นเพียงการลบทั้งแถวและเนื้อหา.
Visual Composer: แก้ไขคอลัมน์

ตัวเลือกคอลัมน์นักแต่งเพลงภาพ

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

  • ครั้งแรก ไอคอนคอลัมน์ เหมือนกับแถว – คลิกที่มันเพื่อลาก & วางและจัดเรียงคอลัมน์ใหม่ภายในแถวของพวกเขา.
  • ดินสอ เป็นการตั้งค่าคอลัมน์ทั่วไป คล้ายกับแถวตัวเลือกคอลัมน์อาจแตกต่างกันไปตามธีมที่คุณใช้ ด้วยตัวเลือกทั้งหมดต่อไปนี้: การมองเห็นบนมือถือ, ภาพเคลื่อนไหว, การพิมพ์, ความสูงขั้นต่ำ, ตัวเลือกการออกแบบ (ระยะขอบ, ขอบ, ช่องว่างภายใน, พื้นหลัง) และการตั้งค่าการตอบสนอง (ออฟเซ็ตกำหนดเอง, ความกว้างหรือตัวเลือกที่ซ่อนอยู่ตามอุปกรณ์).
  • สำหรับคอลัมน์ บวก ไอคอนจะเพิ่มองค์ประกอบที่ด้านบนของคอลัมน์เหนือองค์ประกอบอื่น ๆ ที่แทรกไว้แล้ว.
  • อีกครั้ง ขยะ ไอคอนคือการลบทั้งคอลัมน์รวมถึงเนื้อหา หลังจากลบคอลัมน์คอลัมน์ที่เหลือจะรักษาขนาดไว้ (หากคุณลบ 1 จาก 3 คอลัมน์ส่วนที่เหลืออีก 2 คอลัมน์จะยังคงเป็นคอลัมน์ขนาด 1/3) ดังนั้นอย่าลืมแก้ไขความกว้างของคอลัมน์หลังจากลบ.
นักแต่งเพลง: แก้ไของค์ประกอบของหน้า

ตัวเลือกองค์ประกอบหน้านักแต่งเพลง

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

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

ตัวเลือกทั่วไปขององค์ประกอบของหน้า

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

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

Visual Composer: การออกแบบองค์ประกอบของหน้า

ตัวเลือกการออกแบบองค์ประกอบของหน้า

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

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

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

ปลั๊กอินที่เข้ากันได้ยอดนิยม

นอกจากส่วนขยายของ Visual Composer ส่วนขยายปลั๊กอินยอดนิยมจำนวนมากเข้ากันได้กับ Visual Composer และเพิ่มองค์ประกอบการสร้างหน้าของตัวเองโดยอัตโนมัติ ต่อไปนี้เป็นปลั๊กอินบางส่วนที่คุณยินดีที่จะได้ยินและทำงานร่วมกับปลั๊กอิน Visual Composer เพื่อการสร้างหน้าเว็บที่ดียิ่งขึ้น.

องค์ประกอบ WooCommerce สำหรับ Visual Composer

WooCommerce: ถ้าคุณต้องการสร้างร้านค้าด้วย WordPress แล้ว WooCommerce เป็นวิธีที่จะไป ปลั๊กอินนี้ไม่เพียงฟรีและเต็มไปด้วยคุณสมบัติที่ยอดเยี่ยมเท่านั้น แต่ยังเข้ากันได้กับ Visual Composer อย่างสมบูรณ์ เมื่อติดตั้งและเปิดใช้งาน WooCommerce จะไม่เพียง แต่เพิ่มการตั้งค่าและตัวเลือกของตัวเอง แต่ยังเพิ่ม 17 องค์ประกอบตัวสร้างหน้าใหม่ สำหรับคุณที่จะเล่นกับ.

ปฏิวัติปลั๊กอิน WordPress Slider

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

ปลั๊กอิน WordPress ของ LayerSlider

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

แบบฟอร์มการติดต่อ 7 ปลั๊กอิน WordPress ฟรี

แบบฟอร์มการติดต่อ 7: แบบฟอร์มการติดต่อเป็นส่วนสำคัญของเว็บไซต์ใด ๆ – ไม่ว่าคุณจะเป็น Blogger ที่มีแบบฟอร์มสำหรับสอบถามข้อมูลธุรกิจหรือทันตแพทย์ที่มีแบบฟอร์มการนัดหมาย แบบฟอร์มการติดต่อ 7 นั้นฟรีมีความยืดหยุ่นอย่างสมบูรณ์และด้วย Visual Composer การแทรกแบบฟอร์มการติดต่อของคุณเป็นเรื่องง่ายด้วยองค์ประกอบแบบฟอร์มที่กำหนดเอง.

ปลั๊กอินแปล WPML WordPress

WPML: หากคุณต้องการสร้างเว็บไซต์หลายภาษา WPML เป็นหนึ่งในตัวเลือกชั้นนำสำหรับการแปลโพสต์และหน้าของคุณ Plus WPML เข้ากันได้กับ Visual Composer อย่างสมบูรณ์ดังนั้นจึงเป็นไปได้ที่จะแปลหน้าเว็บที่คุณสร้างขึ้นทุกหน้า.

ปลั๊กอิน WordPress ของ Polylang ฟรี

Polylang: หากคุณไม่ต้องการลงทุนใน WPML Polylang เป็นตัวเลือกที่ยอดเยี่ยมที่เข้ากันได้กับ Visual Composer อย่างสมบูรณ์ (เป็นปลั๊กอินฟรีหนึ่งในโปรแกรมที่เราแนะนำให้ใช้กับเว็บไซต์ WordPress ของคุณ).

ปลั๊กอิน SEO ของ Yoast

Yoast SEO: Yoast ทำให้ผู้ใช้ทุกคนสามารถปรับปรุง SEO ที่หน้างานได้อย่างง่ายดาย มีฟังก์ชั่น SEO ที่สำคัญมากมายเช่นแผนผังไซต์, คำอธิบายเมตา, เกล็ดขนมปังและอื่น ๆ สิ่งที่ดีที่สุด – Yoast SEO เล่นได้ดีกับ Visual Composer ดังนั้นคุณสามารถกังวลเกี่ยวกับการสร้างหน้าเว็บที่ดีกว่าแทนที่จะทำการค้นหา SEO.

Templatera Template Manager สำหรับ Visual Composer

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

และเรามั่นใจว่ามีปลั๊กอินที่เข้ากันได้ดีมากอีกมากมาย! หากคุณมีข้อสงสัยเกี่ยวกับความเข้ากันได้ของปลั๊กอินใหม่กับ Visual Composer เพียงติดต่อผู้สร้างปลั๊กอินใหม่และถาม.

ตัวเลือกขั้นสูงสำหรับนักแต่งเพลงที่มองเห็น

สำหรับผู้ใช้ขั้นสูงเพิ่มเติมมีตัวเลือกพิเศษสองสามอย่างใน Visual Composer คุณสามารถใช้เพื่อเพิ่มรหัสย่อที่กำหนดเองให้กับเครื่องมือสร้างเพจของคุณและเพื่อสร้างกริดสื่อที่กำหนดเอง.

Visual Mapper ย่อนักแต่งเพลง

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

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

ห่อ

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

และถ้าเราพลาดบางสิ่ง แค่ถามเรา. เรายินดีที่จะบอกทุกสิ่งที่คุณต้องการทราบเกี่ยวกับ Visual Composer และวิธีการทำงาน – แสดงความคิดเห็นด้านล่าง. ขอบคุณที่อ่าน!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map