Page Builder là gì? Những plugins nào hỗ trợ Page Builder tốt nhất hiện nay?

Rất nhiều người đã từng dùng Visual Composer và thích thú với khả năng tạo ra nhiều thiết kế đẹp từ nó. Nhưng bạn có biết Visual Composer không phải là Page Builder tốt nhất ?

Top-10-plugins-Page-Builder-tốt-nhất-cho-WordPress

Trước hết, ta phải tìm hiểu một xíu về Page Builder và cách thức hoạt động của chúng!

Page Builder là gì?

Page Builder là trình dựng trang hỗ trợ kéo thả (drag & drop). Mục đích của các plugins Page Builder là giúp người dùng dễ dàng tạo ra những giao diện theo ý thích mà không cần phải có kiến thức về code. Chỉ cần bạn kéo thả các block mình muốn để tạo ra một Page mới!

Đối với người dùng bình thường, Page Builder giúp họ chỉnh sửa lại các trang demo có sẵn theo ý mình. Còn với các Webmaster chuyên nghiệp, Page Builder giúp họ nhanh chóng tạo ra những giao diện theo ý thích của khách hàng mà không cần thiết kế lại theme WordPress.

Với các Page Builder mạnh mẽ như Elementor Pro, Beaver Builder hay Visual Composer, người dùng chỉ cần một theme WordPress đơn giản vẫn có thể tạo được nhiều giao diện phức tạp cho các loại trang web khác nhau, cái mà bản thân mỗi theme không thể làm được.

 

Phân biệt plugin Page Builders và Theme Builders

Nhiều người thường nhầm lẫn giữa Page Builder và Theme Builder!

Page Builders là các plugins, hoạt động trên website đã cài sẵn theme. Tác dụng của Page Builder là tạo ra các page và post có giao diện/thiết kế theo ý của người dùng. Như vậy, Page Buider tác động tới phần Front-End của trang web!

Theme Builders, thực chất là các Theme Framework hỗ trợ tạo Theme kiểu kéo thả. Tức là bạn sẽ tạo ra một theme WordPress với những tính năng mình thích bằng cách kéo thả các modules có sẵn. Theme Builders tác động lên phần Back-End của trang web.

4 Theme Frameworks hỗ trợ tạo theme kiểu kéo thả (Theme Builder) nổi tiếng là:

  1. Ultimatum.
  2. NexusThemes.
  3. PageLines .
  4. Headway .

Trong bài này, chúng ta chỉ tìm hiểu về các plugins Page Builder tốt nhất, còn các Theme Builder, nên dành cho các WordPress Developer nghiên cứu, VHW sẽ giới thiệu sau này!

Các tiêu chí đánh giá Page Builder tốt nhất

Để so sánh các plugins Page Builder, chúng ta sẽ xem xét 6 yếu tố chính:

  • Giá cả: Free – Premium – Có unlimited licenses không (dùng không giới hạn sites)?
  • Tính năng: khả năng tùy chỉnh (options) nhiều, số lượng modules, templates được tích hợp sẵn để người dùng lựa chọn và có thể sửa đổi nhanh chóng.
  • Dễ dùng: giao diện dễ làm quen, hỗ trợ chỉnh sửa từ Back-end và Front-End (Live Editing).
  • Tính tương thích: có thể dùng với đa số các themes wordpress ?
  • Code nhẹ và chuẩn SEO, ít lỗi và ít hao tốn tài nguyên hosting khi dùng.
  • Phương thức hoạt động: sinh ra shortcode (Shortcode Driven) hay không.

Shortcode Driven là gì?

  • Các plugins như Visual Composer, Divi Builder, Thrive Visual Content…tạo pages theo phương thức tạo shortcodes – shortcode driven. Nếu tắt plugins đi, nội dung của các pages sẽ trở nên xấy xí với một mớ thẻ shortcodes. Đây là một hạn chế lớn vì nó bắt bạn phải luôn dùng plugins dù không còn nhu cầu nữa!

TOP 10 PLUGIN PAGE BUILDER TỐT NHẤT 2017

Đứng đầu danh sách là cái tên mới, nhưng đang tạo ra một cơn sốt trong cộng đồng WordPress Webmasters trên thế giới, Elementor Pro:

1Elementor

Tháng 6/2016, bản free của Elementor được giới thiệu, đến tháng 11 đã có hơn 100.000 lượt tải. Đó là tiền đề để Elementor Pro ra mắt vào cuối năm 2016 và làm thay đổi cuộc chiến giữa các Page Builder (hihi). Hàng loạt blog wordpress nổi tiếng như WPBeginner, WPKube, WPColt, Athemes, Colorlib…đều xếp hạng 5 sao cho tân binh Elementor Pro!

Elementor Pro thực sự là một bước tiến mới trong lĩnh vực WordPress Page Builder. Plugin này hỗ trợ cực tốt cả Back-end và Front-end, đặt biệt tính năng Live Editing hoạt động mượt mà và hiệu quả đến khó tin.

Người dùng có thể tùy chỉnh từ bố cục tổng quát (page layout) cho đến các chi tiết thiết kế từng thành phần và cả hiệu ứng động! Elementor Pro cũng hỗ trợ hoàn hảo cho tùy chỉnh thiết kế responsive trên các thiết bị tablets và mobile.

Với người dùng chưa có kinh nghiệm, các modules và templates có sẵn cùng giao diện trực quan giúp việc tạo pages với thiết kế đẹp, chuyên nghiệp khá dễ dàng.

Đối với người dùng thích mày mò và có kiến thức thiết kế, hàng loạt options nâng cao của Elementor Pro cho phép họ tạo ra những thiết kế đặt trưng, độc đáo mà không cần phải gõ bất kỳ dòng code css hay html nào!

Page Builder tốt nhất - Elementor Pro
Live Editor của Elementor Pro rất mượt và hiệu quả!

Các tính năng nổi bật của Elementor Pro:

  • Hỗ trợ Live Editing cực nhanh và mượt.
  • Tích hợp nhiều modules và templates đẹp, hiện đại và cập nhật thêm liên tục.
  • Có nhiều options nâng cao để cho người dùng thích tạo thiết kế riêng.
  • Code chuẩn SEO,  nhẹ (chỉ 200kb), không gây nặng hosting.
  • Tương thích với hầu hết các themes hiện nay. Kể cả 2 thương hiệu khó tính là Genesis Framework và ThriveThemes.
  • Non Shortcode-Driven (không tạo shortcodes): GREAT!

Giá:

  • Có bản Free (giới hạn tính năng).
  • Bản Pro từ $49 (1 site) đến $199 (unlimited sites) /năm.
  • Mua qua VHW GroupBuy giá $20 (unlimited sites).

VHW sẽ có bài giới thiệu đầy đủ về Elementor Pro và hướng dẫn cách sử dụng. Bạn có thể trải nghiệm ngay plugin tuyệt vời này bằng cách tham gia VHW GroupBuy, giá chỉ $20 cùng hàng loạt themes + plugins bonus khác (tặng kèm WProcket + key lifetime)!

2Beaver Builder

Beaver Builder – có giá lên tới $399/ năm, và hiện có gần 300.000 websites đang dùng nó, đủ thấy chất lượng của plugins này.

Beaver Builder có tích hợp sẵn rất nhiều modules & templates để bạn dùng hoặc chỉnh sửa lại theo ý mình. Họ còn cung cấp một Beaver Builder Theme rất mạnh mẽ!

Các tính năng nổi bật của Beaver Builder:

Trong số những plugin Page Builder tốt nhất hiện nay, Beaver Builder dễ dùng nhất, hoạt động nhẹ nhàng nhất và có tính tương thích cao nhất.

  • Tính năng Live Editing cho phép bạn chỉnh sửa nóng từng chi tiết nhỏ nhất của thiết kế một cách trực quan nhất ngay trên Front-end!
  • Dễ dùng: Beaver Builder dễ dùng nhất trong số các plugins Page Builder hiện nay.
  • Tính tương thích: dùng được với mọi loại themes, kể cả Genesis Framework và Thrive.
  • Code nhẹ và chuẩn SEO: nếu Visual Composer là con voi già thì Beaver Builder là chú ngựa đua đang tuổi thanh xuân!
  • Non Shortcode Driven: GREAT – như Elementor Pro, BB không sinh ra shortcodes!

Có thể ở VN bạn ít nghe tới Beaver Builder, một phần vì nó quá đắt, thứ hai là mọi người dùng nhiều themes từ ThemeForest, nơi Visual Composer thống trị. Nhưng với cộng đồng WordPress trên thế giới, Beaver Builder mới là Page Builder được khuyên dùng nhiều nhất. Chẳng cần phải tìm hiểu các hướng dẫn, bật giao diện BB lên, bạn sẽ thấy ngay phải làm gì!

Dùng Beaver Builder với Genesis Framework
Dùng Beaver Builder + Genesis Framework. Bạn sẽ có một website siêu nhanh.

VHW cũng sẽ có bài hướng dẫn riêng cách sử dụng Beaver Builder, nhưng vì nó quá dễ dùng nên bạn có thể mua ngay từ VHW GroupBuy và bắt đầu tạo cho mình một Websites đẹp!

Giá:

  • Có Free – Lite Version (giới hạn tính năng).
  • Bản Pro từ $99 (1 site) đến $399 (unlimited sites) /năm.
  • Mua qua VHW GroupBuy giá $20 (unlimited sites).

3Visual Composer & Addons

Visual Composer – VC nằm trong TOP Premium plugins được dùng nhiều nhất hiện nay. Có thể bạn không biết hầu hết các Page Builder trong danh sách, nhưng Visual Composer chắc chắn bạn đã nghe qua!

ThemeForest và CodeCanyon trở thành Market về WordPress số 1 thế giới có công rất lớn của Michael M và team WPBakery – nơi ra đời Visual Composer!

Sự xuất hiện của Visual Composer giúp các nhà phát triển theme WordPress có thể tích hợp tùy thích các giao diện demo vào themes một cách dễ dàng. Nhờ đó, các themes ở ThemeForest đáp ứng hầu như đủ mọi nhu cầu của khách hàng, giúp tăng số lượng bán ra.

Khi cần mua theme WordPress, ai cũng nghĩ ngay đến ThemeForest – nói đến themes bán ở ThemeForest, thì hầu hết tích hợp miễn phí Visual Composer, với hàng chục đến hàng trăm giao diện demo có sẵn để lựa chọn.

Visual Composer không còn là Page Builder tốt nhất
Visual Composer hiện đã hỗ trợ Live Editing, nhưng khá hạn chế!

Nhưng – Visual Composer ngày càng phình to, chưa kể tới hàng đống addons  kèm theo. Yếu tố dễ dùng, code nhẹ và tính khả dụng của Visual Composer là vấn đề gây đau đầu!

Rất nhiều nhà phát triển đã bắt đầu chia tay VC để xây dựng riêng Page Builder cho mình. Tiêu biểu như Avada , X Theme, Flatsome, Sahifa, TheArk…mới đây nhất là Newspaper và Newsmag by Tagdiv đã quyết định dùng Tagdiv Composer từ Version 8!

Ưu điểm Visual Composer:

  • Cực kỳ mạnh mẽ: nếu sở hữu Visual Composer và vài bộ Addons của nó, bạn có thể tạo ra vô số các thiết kế tuyệt đẹp mà hầu như các Page Builder khác khó làm được hết.
  • Free: nếu mua các themes có sẵn Visual Composer, sẽ được dùng kèm với theme đó (nhất là khi mua themes từ ThemeForest).

Nhược điểm của Visual Composer:

  • Ngày càng phình to cả tính năng lẫn thiết kế khiến cho Visual Composer tốn khá nhiều tài nguyên máy chủ, việc chỉnh sửa các trang có thiết kế phức tạp thường lâu và nặng nề.
  • Tương thích kém.
  • Nhiều lỗi Javascripts và hầu như không được support nếu không mua license riêng.
  • Tính năng Live Editing giới hạn.
  • Khó dùng với người không chuyên do UI phức tạp.
  • Shortcode Driven: BAD, khi đã tạo pages từ Visual Composer, bạn sẽ phải dùng nó mãi mãi, hoặc phải bỏ ra nhiều giờ để xóa đống thẻ shortcodes khỏi các nội dung!

Giá:

  • Free nếu themes có tích hợp sẵn Visual Composer.
  • $34/ site, update lifetime nếu mua riêng license key.

Visual Composer vẫn còn là plugins Page Builder phổ biến nhất và mạnh mẽ nhất 2017. Nhưng nó đang mất dần thị phần và không còn là Page Builder tốt nhất!

4SiteOrigin Page Builder

Nói đến giải pháp miễn phí thay thế cho Visual Composer, người ta thường đề cập đến SiteOrigin Page Builder, plugin này miễn phí, chuẩn SEO và có đầy đủ khả năng tạo ra các trang có thiết kế phức tạp.

Đặc điểm của SiteOrigin là nó tạo pages bằng các widgets, chỉ cần kéo thả các widgets được tích hợp sẵn để tạo pages, nó cũng cho phép bạn kéo thả các widgets của plugins khác. Hiện có khá nhiều plugins dưới dạng Addons của SiteOrigin Page Builder để thêm nhiều widgets giúp đa dạng hơn các thiết kế.

Ưu điểm của SiteOrigin Page Builder:

  • Hoàn toàn Free.
  • Tương thích với hầu hết các themes hiện nay.
  • Nhẹ, chuẩn SEO và rất dễ dùng.
  • Non – Shortcode Driven: GREAT.

Hạn chế của SiteOrigin Page Builder:

  • Không hỗ trợ Front-End (Live Editor).
  • Khá ít tùy chọn (options) và tích hợp ít widgets.

5Thrive Visual Editor

Thrive Visual Editor thực chất là bộ 3 trong 1 plugins nổi tiếng của ThriveThemes, bao gồm Thrive Content Builder – Thrive Landing Pages và Thrive Lightbox. Với 3 plugins này, bạn có thể tạo ra một websites với những tính năng đắt giá, đặt biệt, nếu bạn là dân Maketing Online và Kiếm tiền Online!

Ưu điểm của Thrive Visual Editor

  • Nhanh và dễ dùng, tạo và chỉnh sửa ngay từ Front-End.
  • Tương thích với hầu hết các themes.
  • Tích hợp rất nhiều Landing Pages.
  • Tích hợp sẵn Tables, Opt-in Form, Lightbox, Tables of Content (TOC)…rất tuyệt vời cho trình bày bài viết, phát triển nội dung!

Nhược điểm

  • Shortcode Driven!
  • Không có nhiều chức năng như các Page Builder khác.
Thrive Content Editor gồm 3 plugins cực chất của ThriveThemes
Bộ 3 trong 1 plugins của Thrive rất tuyệt vời cho Marketing và Kiếm tiền Online!

Thrive Visual Editor không phải là một Page Builder toàn diện như 4 cái tên top đầu, nhưng nó là plugins số 1 cho mục đích Focus Conversion (chú trọng vào tỉ lệ chuyển đổi – yếu tố cực kỳ quan trọng đối với Marketing Online, bán hàng, kiếm tiền online)!

Tốc độ và tính hiệu quả là thứ mà khách hàng đánh giá cao nhất đối với ThriveThemes, và Thrive Visual Editor cũng không ngoại lệ!

Giá:

  • Free: không có.
  • Bản Premium: $67(1 site) đến $147(15 sites) /năm.
  • $49/ tháng cho unlimited sites (trọn bộ Thrive Themes + Plugins).
  • Nhận Free khi tham gia VHW GroupBuy.

6Divi Builder

Divi (ElegantThemes) là một trong những theme WordPress toàn năng nhất thế giới.

Nhờ tích hợp plugins Divi Builder, người dùng có thể tạo ra mọi loại websites theo yêu cầu. Rất nhiều nhà phát triển WordPress ăn nên làm ra nhờ việc tạo ra các ChildThemes và Premade Layouts cho Divi Theme dựa vào Divi Builder.

Ưu điểm của Divi Builder :

  • Code nhẹ, nhanh và chuẩn SEO.
  • Hỗ trợ Back-End và Front-End.
  • Có rất nhiều Modules + Templates miễn phí (Premade Layout).
  • Khả năng tùy biến mạnh mẽ cho người dùng chuyên nghiệp.

Nhược điểm:

  • Shortcode Driven.
  • Khó dùng cho người mới bắt đầu.
Nhanh - mượt - chuẩn SEO là ưu điểm của Divi Builder
Nhanh – mượt – chuẩn SEO là ưu điểm của Divi Builder

Divi Builder + Divi Theme là bộ đôi tuyệt vời dành cho những nhà thiết kế web WordPress nhờ khả năng tùy biến mạnh mẽ và hoạt động rất mượt mà.

Hiện nay Divi Builder có thể hoạt động tốt với hầu hết các theme WordPress phổ biến chứ không chỉ gói gọn cho Divi Theme.

Giá:

  • Bản Free: không có.
  • Bản Premium không bán riêng, mua tài khoản trọn gói ElegantThemes từ $89/năm hoặc $249/ trọn đời.
  • Nhận Free khi tham gia VHW GroupBuy.

7Themify Builder

Themify là thương hiệu theme WordPress sáng lập bởi Nick La, một tên tuổi lớn trong cộng đồng Web Designers thế giới!

Các themes của Themify nổi tiếng nhanh, nhẹ và chuẩn SEO đều được tích hợp sẵn Themify Builder để người dùng tùy biến giao diện theo ý mình.

Tính năng của Themify Builder khá tương đồng với SiteOrigin, nhưng các modules và templates có thiết kế đẹp và bóng bẩy hơn.

Điểm hạn chế của Themify Builder là khá khó dùng và sinh ra shortcodes khi tạo pages!

Giá:

  • Bản Free – Lite.
  • Tích hợp miễn phí cho các themes Themify.
  • Bản Premium từ $39 – $59/năm unlimited sites.

8Cornerstone

Bạn có nghe qua Cornerstone Page Builder?

Có thể chưa. Nhưng chắc chắn bạn biết X Theme, một trong những Multipurpose Theme bán chạy nhất mọi thời đại bên cạnh Avada. Cornerstone chính là cỗ máy bên trong X Theme, giúp người dùng tha hồ tạo ra các giao diện mới.

Sau một thời gian gắn chặt với X Theme, tháng 3/2016 Cornerstone Page Builder đã chính thức ra riêng ở CodeCanyon với giá $39/site, và hoạt động tốt trên hầu hết các theme WordPress khác.

Ưu điểm của Cornerstone:

  • Giao diện kiểu ứng dụng, rất hiện đại và trực quan. Hỗ trợ Live CSS Editing.
  • Tích hợp hàng trăm blocks, modules, templates rất đẹp để bạn chỉnh sửa lại và nhanh chóng có được thiết kế ưng ý.
  • Khắc phục được nhiều lỗi thường gặp trên Visual Composer.

Nhược điểm:

  • Không toàn diện như nhiều Page Builder khác.
  • Shortcode Driven.

Giá:

  • Bản Free: không có.
  • Tích hợp miễn phí cho X Theme.
  • Premium: $39/site lifetime.

9KingComposer

KingComposer là một Page Builder mới rất đáng dùng. Tác giả là King-Theme, một nhà phát triển theme WordPress nổi tiếng trên ThemeForest.

KingComposer có khá nhiều nét tương đồng với Elementor Pro. Đặc biệt hỗ trợ Live Editing và Không sinh Shortcodes khi tạo pages.

Dù chưa tạo được tiếng vang lớn như Elementor nhưng KingComposer là một plugins hứa hẹn sẽ chiếm lĩnh thị trường Page Builder trong thời gian tới. Hiện bản Free của plugins này nhận được rất nhiều phản hồi tích cực từ người dùng.

Giá:

  • Bản Free – Lite.
  • Bản Pro: $29 – $499/năm.

10MotoPress Content Editor

MotoPress là page builder đáp ứng các tiêu chí nhẹ – đơn giản – rất dễ dùng. Với vài chục modules rất đẹp có sẵn cùng cách sắp xếp khoa học và minh họa trực quan, bạn không phải mất nhiều thời gian để tạo một page ưng ý.

Hạn chế lớn nhất của MotoPress là nó khá ít tùy chỉnh, do đó sẽ khó khăn khi cần tạo những thiết kế phức tạp.

Giá:

  • Bản Free – Lite.
  • Bản Pro: $29 – $139.

KẾT LUẬN

Ngày càng có nhiều plugins Page Builder chất lượng được giới thiệu, cả free lẫn premium, giúp cho người dùng không chuyên có thể tự tay thiết kế giao diện trang web theo ý mình mà vẫn giữ được nhưng tiêu chuẩn như tối ưu SEO, thiết kế đẹp – hiện đại & thu hút.

Qua bài giới thiệu 10 plugins Page Builder tốt nhất, hi vọng các bạn có thể chọn được cho mình một Page Builder ưng ý nhất!

Riêng với VHW, nếu theme không tích hợp sẵn Page Builder, thì Elementor Pro hay Beaver Builder là những lựa chọn không thể tốt hơn trong năm 2017 này!

Chúc các bạn thành công!

16 COMMENTS

  1. Cám ơn tác giả, 1 bài viết rất hay và bổ ích. Mong tác giả có thể làm một bài viết so sánh giữa Elementor và Visual Composer tổng quát nhất

    • Page Builder thường tích hợp sẵn các Landing Pages đẹp để làm trang quảng cáo dịch vụ & sản phẩm.
      Nhưng không chỉ có vậy, Page Builder còn có rất nhiều modules để tạo ra các giao diện công ty, dịch vụ hay cả trình bày bài viết blog đẹp và sinh động nữa.

  2. sau khi tải plugin Elementor, lúc post bài viết thì xuất hiện thế này
    Elementor requires PHP version 5.4+, plugin is currently NOT ACTIVE.
    cho mình hỏi có ai biết cách khắc phục không.
    cảm ơn

  3. Hi Quỳnh,
    Mình cũng thấy là khi dùng Newspaper, Visual Composer không cần thiết lắm, muốn disable nó đi, nhưng kẹt cái là sợ bị mất định dạng homepage. Bản 8.0 nó có hỗ trợ chuyển đổi giữa Visual Composer với Tagdiv page builder của nó ko Quỳnh? VHW có nâng cấp lên bản 8 không, hay vẫn dùng 7.8 Quỳnh nhỉ?
    Cảm ơn Quỷnh nhiều

    • Bản 8.0 có tùy chọn giữa Tagdiv Composer và Visual Composer ạ. Quỳnh test thì tagdiv composer hoạt động mượt hơn hẳn VC.
      Hiện Quỳnh vẫn chưa nâng cấp lên 8.0 vì trước đây S.Admin có tùy chỉnh lại khá nhiều code css và js nên việc nâng cấp phải chờ S.Ad có thời gian rãnh mới làm giúp.

  4. Cảm ơn bạn đã đánh giá về KingComposer của bên mình. Sản phẩm hoàn toàn cho developer Việt Nam triển khai. Rất mong nhận được sự ủng hộ và quan tâm của người dùng Việt. Bên mình đang có discount event lên đến 25% với code ‘kc25’
    Sắp tới bên mình sẽ cho ra nhiều tính năng và elements khác nữa.

  5. Plugins Visual Composer sao mình dùng trên theme Newpapper bị lỗi nhỉ, mở ra trình soạn rồi mà bấm vào + không hiện ra bảng để thêm các widget.

    Còn bạn có post nào hướng dẫn áp dụng các trình builder trên cho từng website tự code không nhỉ? Tìm mãi không thấy mà khó dùng quá, toàn phải dùng giao diện đơn giản như cái blog của mình.

    • hi bạn Newspaper có trình buider riêng là TagDiv compose nên không cần Visual Compose , đa phần các theme đầu xài trình riêng của mình chứ ko xài Visual Compose vì nó khá nặng

LEAVE A REPLY

Please enter your comment!
Please enter your name here