7 สุดยอดปลั๊กอินกล่องไอคอน WordPress (ฟรี & จ่ายเงิน)

เผยแพร่แล้ว: 2024-01-25

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

แต่เมื่อพูดถึงปลั๊กอิน อาจมีตัวเลือกมากมาย และนั่นคือสิ่งที่โพสต์นี้เกี่ยวกับ: อ่านต่อเพื่อเรียนรู้เกี่ยวกับปลั๊กอินกล่องไอคอน WordPress ที่ดีที่สุด!

เนื้อหา ซ่อนอยู่
1 กล่องไอคอนคืออะไร?
2 ปลั๊กอินกล่องไอคอน WordPress 7 อันดับแรก
3 วิธีเลือกปลั๊กอินกล่องไอคอน WordPress ที่ดีที่สุด
4 คำสุดท้าย

กล่องไอคอนคืออะไร?

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

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

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

ดังนั้นเรามาเรียนรู้เกี่ยวกับปลั๊กอินกล่องไอคอนที่ดีที่สุด...

ปลั๊กอินกล่องไอคอน WordPress 7 อันดับแรก

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

1. วิดเจ็ตกล่องไอคอน ElementsKit

สถิติปลั๊กอิน:

  • การติดตั้งที่ใช้งานอยู่: 1+ ล้าน (เวอร์ชันฟรี)
  • คะแนน: 5.0 หรือสูงกว่า
  • เหมาะที่สุดสำหรับ : กล่องไอคอนอเนกประสงค์

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

วิดเจ็ตกล่องไอคอน ElementsKit ช่วยอำนวยความสะดวกทุกอย่าง เช่น ไอคอน ชื่อ คำอธิบาย ปุ่ม และ คุณสมบัติพิเศษอื่นๆ เช่น ป้ายสถานะ และลายน้ำ ข้อได้เปรียบที่สำคัญของปลั๊กอินนี้ในแง่ของการทำงานของกล่องไอคอนคือชุดไอคอนมากมาย คุณจะสามารถเข้าถึง Font Awesome- Regular, Font Awesome- Solid, Font Awesome- Brands และ ElementsKit Icon Pack

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

ข้อดี:

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

จุดด้อย:

  • มาเป็นส่วนเสริมของบุคคลที่สาม

2. วิดเจ็ตกล่องไอคอน Elementor

สถิติปลั๊กอิน:

  • การติดตั้งที่ใช้งานอยู่: 5+ ล้าน (เวอร์ชันฟรี)
  • คะแนน: 4.6 หรือสูงกว่า
  • เหมาะที่สุดสำหรับ : กล่องไอคอนอเนกประสงค์

ปลั๊กอินฟรีอีกตัวที่คุณสามารถใช้บนเว็บไซต์ WordPress คือ Elementor Icon Widget สิ่งที่ฉันชอบเกี่ยวกับปลั๊กอินนี้คือคุณไม่จำเป็นต้องติดตั้งปลั๊กอินเพิ่มเติมใดๆ เช่นเดียวกับที่คุณทำกับ ElementsKit ในกรณีที่คุณต้องติดตั้งทั้ง Elementor และ ElementsKIt และอินเทอร์เฟซผู้ใช้นั้นเป็นมิตรกับผู้เริ่มต้น

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

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

ข้อดี:

  • ปรับแต่งไอคอนและกำหนดตำแหน่งของไอคอน
  • ใช้เอฟเฟ็กต์ภาพเคลื่อนไหวเมื่อโฮเวอร์
  • รับตัวเลือกสไตล์สำหรับการพิมพ์
  • กล่องไอคอนตอบสนองมือถือ

จุดด้อย:

  • ไม่สามารถเพิ่มป้าย ลายน้ำ หรือปุ่มใดๆ ได้

3. แผงกล่องสีและกล่องข้อมูล

สถิติปลั๊กอิน:

  • การติดตั้งที่ใช้งานอยู่: 1,000+
  • คะแนน: 4.6 หรือสูงกว่า
  • เหมาะที่สุดสำหรับ : กล่องไอคอนอเนกประสงค์

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

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

ข้อดี:

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

จุดด้อย:

  • อย่าปรับแต่งการพิมพ์และไอคอนใดๆ
  • ไม่สามารถอัปโหลดไอคอนของคุณเองได้
  • คุณสมบัติส่วนใหญ่มีอยู่ในเวอร์ชันโปร

4. กล่องไอคอน Betheme

สถิติปลั๊กอิน:

  • เหมาะที่สุดสำหรับ : กล่องไอคอนอเนกประสงค์

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

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

ข้อดี:

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

จุดด้อย:

  • จำเป็นต้องชำระค่าแผนเต็ม

5.ตู้โชว์กล่องบริการ

สถิติปลั๊กอิน:

  • การติดตั้งที่ใช้งานอยู่: 5,000+
  • คะแนน: 4.8 หรือสูงกว่า
  • เหมาะที่สุดสำหรับ : กล่องไอคอนตามบริการ

ปลั๊กอิน Service Box Showcase นำเสนอวิธีที่ง่ายดายในการออกแบบกล่องไอคอนด้วยเทมเพลตที่สร้างไว้ล่วงหน้า คุณสามารถใช้มันเพื่อแสดงบริการที่น่าดึงดูดตามชื่อที่กำหนดไว้

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

สิ่งที่ดีอีกประการหนึ่งเกี่ยวกับปลั๊กอิน Service Box Showcase คือมันช่วยให้คุณเพิ่มปุ่มอ่านเพิ่มเติมซึ่งมีเฉพาะในเวอร์ชันโปรของปลั๊กอินก่อนหน้าเท่านั้น

ข้อดี:

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

จุดด้อย:

  • พัฒนาขึ้นเพื่อจุดประสงค์เดียว
  • คุณสมบัติส่วนใหญ่มีอยู่ในเวอร์ชันโปร

6. กล่องบริการ

การติดตั้งที่ใช้งานอยู่ : 500+

คะแนน : 5.0

เหมาะที่สุดสำหรับ : กล่องไอคอนตามบริการ

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

ข้อดี:

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

จุดด้อย:

  • พัฒนาขึ้นเพื่อการสร้างกล่องไอคอนตามบริการเป็นหลัก
  • ไม่สามารถเพิ่มป้ายและลายน้ำได้

7. กล่องข้อมูล (บล็อกกูเทนแบร์ก)

การติดตั้งที่ใช้งานอยู่ : 1,000+

คะแนน : 5.0

เหมาะที่สุดสำหรับ : กล่องไอคอนอเนกประสงค์

ปลั๊กอินสุดท้ายที่เราต้องการเพิ่มลงในรายการนี้คือ Info Box ปลั๊กอิน WordPress นี้ได้รับการพัฒนาสำหรับโปรแกรมแก้ไข Gutenberg ช่วยให้คุณสร้างกล่องไอคอนที่กำหนดเองได้อย่างสมบูรณ์สำหรับเว็บไซต์ Gutenberg ของคุณ

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

ข้อดี:

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

จุดด้อย:

  • ไม่มีคุณสมบัติตราหรือลายน้ำ

วิธีเลือกปลั๊กอินกล่องไอคอน WordPress ที่ดีที่สุด

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

ดังนั้น ด้านล่างนี้เราจะร่างข้อกำหนดขั้นต่ำขั้นพื้นฐานบางประการเมื่อเลือกปลั๊กอินที่เหมาะสมเพื่อแสดงกล่องข้อมูล

กำหนดความต้องการของคุณ

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

ตัวเลือกการปรับแต่ง

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

หน้าจอผู้ใช้

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

เค้าโครงที่สร้างไว้ล่วงหน้า

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

การออกแบบที่ตอบสนอง

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

ความขัดแย้งของปลั๊กอิน

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

คำสุดท้าย

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

ขณะนี้ปลั๊กอินส่วนใหญ่ในรายการนี้ใช้งานได้ฟรี ดังนั้นคุณควรลองใช้และค้นหาปลั๊กอินที่คุณใช้งานได้จริง และนี่จะเป็นวิธีที่เหมาะสมในการค้นหาปลั๊กอินกล่องไอคอน WordPress ที่ดีที่สุด