เคล็ดลับเพื่อเพิ่มความเร็วของกระบวนการออกแบบด้วย Elementor

เคล็ดลับเพื่อเพิ่มความเร็วของกระบวนการออกแบบด้วย Elementor

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


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

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

เริ่มต้นด้วยเทมเพลต Premade

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

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

มีคอลเลกชันเทมเพลตฟรีและพรีเมียมที่ยอดเยี่ยมไว้บนเว็บ.

ตลาด Envato

ตลาด Envato

ตลาด Envato อาจเป็นตลาดที่ได้รับความนิยมสูงสุดไม่เพียง แต่สำหรับเทมเพลต Elementor เท่านั้น แต่สำหรับ WordPress และธีม.

เทมเพลทมอนสเตอร์

เทมเพลทมอนสเตอร์

TemplateMonster เป็นผู้ให้บริการเนื้อหาเทมเพลตคุณภาพดีอีกรายหนึ่งพวกเขายังมีเทมเพลตฟรีบางส่วน.

ไลบรารีเทมเพลต Elementor

ไลบรารีเทมเพลต Elementor

ไลบรารีเทมเพลต Elementor – เป็นคลังข้อมูลเทมเพลตดั้งเดิมสำหรับ Elementor เทมเพลตฟรีและพรีเมี่ยมใหม่ปรากฏขึ้นบ่อยครั้งมาก.

ใช้ปุ่มลัด

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

นี่คือรายการของทางลัดที่สามารถเพิ่มความเร็วในการออกแบบเว็บไซต์ของคุณอย่างจริงจัง:

การปฏิบัติ

เลิกทำCtrl / Cmd + Zเลิกทำการเปลี่ยนแปลงใด ๆ บนหน้า
ทำซ้ำCtrl / Cmd + Shift + Zทำซ้ำการเปลี่ยนแปลงที่ทำบนหน้านี้
สำเนาCtrl / Cmd + Cคัดลอกส่วนคอลัมน์หรือวิดเจ็ต
วางCtrl / Cmd + Vวางส่วนคอลัมน์หรือวิดเจ็ต
วางสไตล์Ctrl / Cmd + Shift + Vวางส่วนคอลัมน์หรือสไตล์ของวิดเจ็ต
ลบลบลบส่วน / คอลัมน์ / วิดเจ็ตที่แก้ไข
ซ้ำCtrl / Cmd + Dทำซ้ำส่วน / คอลัมน์ / วิดเจ็ตที่แก้ไข
บันทึกCtrl / Cmd + Sบันทึกหน้าของคุณในประวัติการแก้ไข

ไปที่

แผง / ตัวอย่างCtrl / Cmd + Pสลับระหว่างมุมมองพาเนลและมุมมองตัวอย่าง
การแก้ไขมือถือCtrl / Cmd + Shift + Mสลับระหว่างมุมมองเดสก์ท็อปแท็บเล็ตและมือถือ
ประวัติศาสตร์Ctrl / Cmd + Shift + Hไปที่แผงประวัติ
นักเดินเรือCtrl / Cmd + Iเปิดเนวิเกเตอร์
เทมเพลตไลบรารีCtrl / Cmd + Shift + Lเปิดโมดอลไลบรารีแม่แบบของเรา
แป้นพิมพ์ลัดCtrl / Cmd + ?เปิดหน้าต่างวิธีใช้แป้นพิมพ์ลัด
เลิกESCเปิดการตั้งค่าและข้ามไปที่ Exit to Dashboard

CSS ที่กำหนดเองสำหรับหน้า

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

ในการทำเช่นนี้คุณเพียงแค่ต้องใช้วิดเจ็ต HTML และโค้ดส่วนนี้ภายใน:

ดูตัวอย่างนี้:

รหัสที่กำหนดเอง

Elementor Finder Bar ค้นหา

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

โชคดีที่ Elementor มีโซลูชันในตัวเพื่อเพิ่มความคล่องตัวและเพิ่มความเร็วในกระบวนการออกแบบ แทนที่จะต้องเจอกับปัญหาเหล่านั้นคุณสามารถใช้ Elementor Finder คุณสามารถข้ามไปที่การตั้งค่าเทมเพลตหน้าหรือส่วนของธีมได้โดยตรงโดยค้นหาในแถบค้นหา ตัวค้นหาสามารถเข้าถึงได้โดยคลิกปุ่ม Cmd / Ctrl + E ที่ใดก็ได้ในแผงควบคุม WordPress ลองดูวิดีโอนี้เพื่อดูทุกสิ่งที่คุณสามารถทำได้ด้วย Finder.

ใช้นาวิเกเตอร์

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

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

คุณสามารถเข้าถึง Navigator ได้ด้วยวิธีง่ายๆ 3 วิธี:

  1. คลิกขวาที่องค์ประกอบใด ๆ จากนั้นคลิกที่นาวิเกเตอร์ สิ่งนี้จะนำคุณไปยังองค์ประกอบเฉพาะในแผนผังการนำทางโดยอัตโนมัติ.
  2. คลิกที่ปุ่มองค์ประกอบในส่วนท้ายของแผง.
  3. ใช้แป้นพิมพ์ลัด Cmd / Ctrl + I.

ดูวิดีโอนี้เพื่อดูวิดีโอ:

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

กำหนดจานสีของคุณ

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

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

ดูวิดีโอนี้:

สไตล์และเทมเพลตและเทมเพลตวิดเจ็ตที่สร้างขึ้นใหม่

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

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

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

WunderWP ที่ตั้งไว้ล่วงหน้า

ด้วย WunderWP คุณสามารถบันทึกและใช้สไตล์วิดเจ็ตของคุณเองใน Elementor ได้อย่างง่ายดาย ง่าย: จัดแต่งวิดเจ็ตบันทึกไว้ใน WunderWP Cloud (ซึ่งฟรี!) และใช้ในภายหลังสำหรับวิดเจ็ตที่คล้ายกัน มันใช้งานได้ทั้งวิดเจ็ตที่เรียบง่ายและซับซ้อน ตัวอย่างเช่นคุณสามารถใช้สิ่งนี้เพื่อบันทึกวิดเจ็ตส่วนหัวที่มีค่าตัวพิมพ์ที่แตกต่างกันหรือสำหรับวิดเจ็ตภาพที่มีเงาที่กำหนดเอง.

ลักษณะที่กำหนดเอง WunderWP

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

เทมเพลต WunderWP ที่กำหนดเอง

หรือคุณสามารถใช้ประโยชน์จากเทมเพลตเนื้อหาแบบ readymade ของ WunderWP ตอนนี้มีเทมเพลตส่วน readymade มากกว่า 50 แบบเช่นผู้ติดต่อการเรียกร้องให้ดำเนินการส่วนหัวส่วนท้ายส่วนท้ายบริการเกี่ยวกับทีมบริการนับถอยหลังและอื่น ๆ อีกมากมาย วัตถุประสงค์.

เทมเพลต WunderWP ล่วงหน้า

ห่อ

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

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

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