WordPressのデザインを手軽に変更したいなら、ページビルダープラグインを使うのがおすすめです。
ページビルダープラグインには、いくつか有名なプラグインがあります。
Elementorか、それともBeaver Builder?Divi Builderか、はたまたThrive Architect?いや、昔ながらのPage Builder by SiteOriginを選ぶのもアリかもしれません。
ページビルダーを選ぶのは簡単ではありません。なぜなら、市場には何十種類もの選択肢があり、それぞれが魅力的に見えるからです。
もしあなたがまだどれにするか悩んでいるのなら、がっかりしないでください。私たちが手を貸します。
この記事では、WordPressで使えるベストページビルダー10選を比較してご紹介します。
もともとは、それぞれのページビルダーに個別の記事を充てていましたが、すべてを一つにまとめて比較できたほうが便利だと思い、このような形にしました。これで、市場で最も優れたものを一目で見渡せます。
そして、もしあなたが細かい部分まで知りたいタイプで、特定のページビルダーについてもっと深く知りたいという場合は、それぞれに専用記事へのリンクも用意しています。
冒険の準備はできましたか?さあ、素晴らしい発見の旅へ出かけましょう!
ページビルダーとは?おすすめする理由
まずは、基本的な概念や、ページビルダーを使用する利点と価値について振り返ることが有益だと考えています。
ページビルダーとは?
ページビルダーとは、あらかじめ用意されたテンプレートを主に使いながら、コードを一切書かずにリッチで複雑なレイアウトを作成できるツールのことです。編集作業は、多くの場合ドラッグ&ドロップ形式で、リアルタイムに行われます。
ページビルダーはたいてい、プラグインの形で提供されます。
- 歴史的に見ると、Themeforestなどのプラットフォームで提供されるテーマには、ページビルダーがあらかじめ組み込まれていることがよくありました。その多くはWPBakeryビルダーを内蔵して販売されていました(ちなみに、今でもそうです)。
現在では、ページビルダーは独立して購入され、自分の好きなテーマにカスタマイズして使用するのが主流になっています。ただし、後述するように、一部のページビルダー(例:Divi)には専用テーマも用意されています。
これで少しイメージが湧いたのではないでしょうか。それでは次に、各ページビルダーに共通する主な特徴を見ていきましょう。
WordPressの優れたページビルダーに共通する主な機能
各ページビルダーには独自の特徴がありますが、基本的な仕組みは共通しています。
そのため、以下のような共通機能が多くのページビルダーに見られます:
- コーディングの知識がなくても使用可能
- ページ内の要素をドラッグ&ドロップで移動できる
- ワンクリックで有効化できるテンプレートが用意されており、ゼロから作る必要がない
- 市場に出回っているほとんどの有料・無料テーマと互換性がある
- サイトのフロントエンド(訪問者が見る画面)からリアルタイムでコンテンツを編集できる
(観客が拍手を送る)
近年では、ページビルダーは初心者にとって非常に心強い味方となっています。ページビルダーを使えば、技術的な知識がなくてもページのあらゆる要素(※ヘッダーやフッターを除くことが多いが、それは使用するプラグインの無料版かPro版かによる)と全体のデザインを自在にコントロールすることが可能です。
これは大きな進歩であり、そのためページビルダーはこの数年で非常に人気を集めています。
- ページビルダーが登場する以前は、サイトのデザインは基本的にテーマに依存していました。しかし、少しでも個性を加えて枠を外れたカスタマイズをしたいとなると、HTMLやCSSの知識が必須でした。
その結果、初心者はすぐに限界に直面し、カスタマイズは非常に複雑なものとなっていました。
ページビルダーのおかげで、こうした障壁はほとんど取り除かれました。すべてが簡単に、そして何よりも迅速に行えるようになったのです。
今までは、WordPress標準のコンテンツエディター(Gutenberg)ではページビルダーとしての機能が不十分で、比較にもなりませんでした。
しかしこの状況は、2022年1月にリリースされたWordPress 5.9で少し変わりました。このバージョンでは、コードなしでサイト全体のあらゆる部分をカスタマイズできる「サイトエディター」が導入されたのです。これにより、ページや投稿のコンテンツ領域に限らず、幅広いカスタマイズが可能となりました。
この新しいエディターは、基本的にページビルダーの仕組みを採用しており、その機能に近づいてはいるものの、特に初心者にとってはまだ制限があります(この記事の最後でその詳細に再び触れます)。
WordPressのためのベストページビルダー10選
こちらは、WordPressにおすすめのページビルダー上位10件のリストです:
- Elementor
- Divi Builder
- Beaver Builder
- Brizy
- Oxygen Builder
- Live Composer
- Thrive Architect
- Page Builder by SiteOrigin
- WPBakery Page Builder
- Visual Composer Website Builder
ご参考までに、この比較では各ページビルダーにとって最も重要だと思われる以下の要素に注目してご紹介します:
使いやすさ、テンプレート/モジュールの数、カスタマイズ性、価格。
さらにボーナスとして、それぞれのビルダーについて「良かった点/気になった点」と「主にどのようなユーザーに向いているか」も併せてご紹介します。
Elementor
Elementor Website Builder – ただのページビルダーではない
アクティブインストール数:1,000万以上 / ユーザー評価:5点中4.5
Elementorは、市場で圧倒的ナンバーワンのページビルダーです。
WordPress公式ディレクトリでのアクティブインストール数は1,000万以上にのぼり、これはContact Form 7やYoast SEOといった一部のプラグインしか達成していない数字です。
その成長ぶりは目を見張るものがあります。2018年5月に私たちがElementorをテストした当時は、アクティブインストール数はわずか70万件でした。
それが、わずか3ヶ月で400万から500万へと一気に増加したのです。
Elementorによれば、1,100万以上のサイトがこのプラグインを使用しているとのことです。
W3Techsのデータによると、CMSを利用しているサイトのうち、ほぼ12%がElementorを使用しているとのこと(WordPress全体のシェアは61.4%)。
今や問われているのは、「Elementorがどこまで行くのか?」という点です。
毎週のように新機能が追加されるこの創造的な熱狂は、突然止まってしまうことがあるのでしょうか?
さらなる改善は可能なのか?それは今後数ヶ月の動きに注目です。とはいえ、現時点でもElementorは非常に優れたツールで、ほぼ無限の可能性を秘めています。
Elementorを使えば、コードを一切書かずに、思いつく限りのことがほぼ何でもできます。
使いやすさ
すっきりとしたインターフェースで、すぐに操作に慣れることができます。編集画面は2つのエリアに分かれています:
- 左側のカラムには、ウィジェット(画像、テキスト、動画などのコンテンツモジュール)が表示されます。
- 右側には、訪問者が実際に見るページの表示エリアがあり、これをリアルタイムで編集できます。
Elementorの編集画面では、変更を即座にプレビューできます(例:タイトルの変更など)。操作はすべてドラッグ&ドロップで行えるため、作業も簡単です。
テンプレートとウィジェット
Elementorの無料版では約30種類のウィジェットが用意されており、基本的なコンテンツモジュール(タイトル、画像、動画、ボタン、アイコンなど)はすべて揃っています。
Pro版ではさらに約50種類の高度なウィジェット(SNSシェアボタン、ポートフォリオ、スライダー、価格表など)が追加され、WooCommerce専用のウィジェットも24種類用意されています。
無料版には約40種類のページテンプレートがあり、FAQページ作成などに便利なブロック(セクション単位のテンプレート)も含まれています。
Pro版では、300種類以上のブロックやテンプレートが含まれる豊富なライブラリが利用可能です。
もちろん、独自のテンプレートを作成して保存し、後で再利用することも可能です。
※なお、テンプレートやウィジェットの呼び方は、使用するページビルダーによって異なります。Elementorでは「ウィジェット」と呼びますが、Diviでは「モジュール」、SiteOriginでは「レイアウト」などと呼ばれます。
カスタマイズ性
テンプレートやウィジェットのカスタマイズは、ほぼ無限です。
デザイン面では、CSSフィルターをコードなしで適用したり、セクション間に区切り線(シェイプ)を追加したり、縦横に要素の位置を調整したりできます。
アニメーションでは、マウスオーバー効果、クリック効果、パララックス効果なども追加可能です。
マーケティング面では、Elementor Proにはポップアップビルダーとフォームビルダーが搭載されています。
さらに、Elementor Proでは、サイト全体(ヘッダーからフッターまで)やWooCommerceストアのすべての要素を編集することができます。
※ほとんどのページビルダーでは、コンテンツの編集のみ可能で、ヘッダーやフッターの編集はPro版の機能になります。
これらはElementorの機能のほんの一部にすぎません。
気に入っている点:
- 圧倒的な数のモジュールとテンプレート
- サイト全体(ヘッダー・フッターを含む)をカスタマイズできる「テーマビルダー」(Pro限定)
- Elementorのエコシステム:多くのコミュニティや、追加機能をもたらすアドオンが存在
- ほぼすべてのテーマ・プラグインとの互換性
気になる点:
- オプションが豊富すぎるため、使いこなすには多少の学習が必要
- 希望の結果に到達するまでにクリックが多くなる傾向がある
- 無制限ライセンスが存在しない
価格
Elementorは公式ディレクトリに無料版が用意されています。
プレミアム版は 1サイトあたり年額59ドル から利用可能です。
Elementorは誰に向いているか?
すべての人におすすめですが、特に初心者のWebデザイナーに最適です。
Divi Builder
Diviは、Elegant Themesが開発したWordPress用のページビルダーです。
Elementorを紹介した後は、その主要なライバルであるDivi Builderを見ていきましょう。
Diviは、2013年にElegant Themesのストアからリリースされ、当初は市場でNo.1のページビルダーとしての地位を確立しました……が、その後Elementorに追い抜かれました。
少しずつDivi Builderは巻き返しを図っており、この2大巨頭は常に競い合っています。どちらが先に最新のトレンド機能をリリースするかが注目の的です。
Diviもまた、独自の機能を備えたページビルダーです。ページビルダーであると同時に、テーマ、そしてテーマビルダーの3つの機能を兼ね備えています。
Elementorと同様に、Diviでは本文だけでなく、ヘッダーやフッターも自由にカスタマイズできます。
なお、Diviは公式ディレクトリでは配布されていません。プレミアム版のみの提供で、すでに約90万人のユーザーに採用されています。
では、Diviの特徴をまとめてみましょう。
使いやすさ
Diviは非常に多機能なページビルダーで、実に多くのオプションを備えています。そのため、習得にはある程度の時間がかかります。
操作自体はそれほど複雑ではありませんが、選択肢が非常に多いため、たとえばElementorに比べると学習曲線はやや急です。
使い勝手としては、他のページビルダーと同様の基本構造になっており、編集は公開ページのインターフェース上で行います。
操作はすべてドラッグ&ドロップで、変更はリアルタイムでプレビュー可能です。
Diviが他と異なるのは、常時表示されるサイドパネルがないことです。何も操作していなければ、訪問者が実際に見るページと同じ表示になります。編集は、要素にマウスを重ねることで開始できます。
この方式は便利ですが、制限もあります。たとえば、ページを保存するボタンが少し分かりにくい場所にあります。
テンプレートとモジュール
思い描いたページを作るために、Diviは100種類ほどのモジュール(ネイティブおよびサードパーティ製)を用意しています。テキスト、画像、ギャラリー、動画、音声、テキスト+アイコン、お客様の声、ボタン、スペーサーなど、基本的なモジュールはすべて揃っています。
さらに、300種類以上のレイアウト(複数ページで構成されたサイトテンプレート)があり、ゼロから作成しなくてもすぐに使えるものが豊富です。
カスタマイズ性
Elementorと同様に、Diviではページデザインをほぼ完全に自由にコントロールできます。
アニメーション、影、グラデーション、セクション間の区切り線、フィルターなど、多彩なカスタマイズが可能です。
また、Diviでは一つの要素で適用したスタイルを、他の要素にコピー&ペーストすることもできます。
マーケティング機能
DiviもElementorと同様に、独自のフォームビルダーを搭載しています。さらに、特定のユーザーに対してアクセス制限を設ける「パーミッション機能」も備えています。これは、クライアントに限定的にサイトへのアクセス権を与えたいときに便利です。
気に入っている点:
- Diviがテーマビルダーである点
- 非常に競争力のある価格
- 提供されている豊富なレイアウト数
- WooCommerceのカスタマイズ対応(商品ページテンプレートの作成、商品カテゴリ/タグのカスタマイズなど)
- Diviのエコシステム:学習リソース、コミュニティ、アドオン、レイアウト、子テーマなどが充実
- WordPressエコシステムに深く根付いたページビルダーであること
気になる点:
- バックエンドのインターフェースがやや使いづらい(使用しなくても可)
- 多くのリソースを必要とするため、フロントエンドの動作が重くなることがある
- プラグインを無効化すると、多くのショートコードが残る(Shortcode Cleaner や Bye Bye Diviなどのプラグインで解決可能)
- これらのショートコードやパフォーマンスの問題は、現在開発中の大型アップデート「Divi 5.0」によって解消される見込み
価格
2つの価格プランがあります:
- 年間プラン:$89/年
- 一括買い切りプラン:$249(生涯アップデート・サポート付き)
Divi Builderは誰向け?
Divi Builderは初心者にも適しており人気がありますが、あらゆるレベルのユーザー(初心者、上級技術者、フリーランス、代理店)に適しています。
Beaver Builder
アクティブインストール数:10万以上 / ユーザー評価:5点中4.7
Beaver Builderは、WordPressのプロフェッショナルの間で確かな評判を得ているページビルダーです。
2014年から登場しているこのビルダーは、やや“古参”ともいえる存在です。ただし、無料版は勢いを失いつつあり、数年間で10万人以上のユーザーが離れたものの、Pro版は非常に充実しており、多くの魅力を備えています。
使いやすさ
Beaver Builderは、最も学びやすいページビルダーの一つです。他の多くの競合と同様に、ドラッグ&ドロップの操作が基本です。選択したモジュールやテンプレートをそのままページ上に配置して編集します。
「WYSIWYG(見たまま編集)」インターフェースにより、すべての変更がリアルタイムで反映されます。
Elementorと同様の動作方式で、右側にモジュールやテンプレートを含んだサイドバーが表示され(手動で移動可能)、ページ上で直接コンテンツの編集ができます。
なお、Beaver BuilderはElementorと同様、フロントエンド上でのみ使用可能です。Divi BuilderやWPBakery Page Builderのように、WordPressの管理画面(バックエンド)では使用できません。
テンプレートとモジュール
無料版ではわずか9つのモジュールしか提供されていません:オーディオ、写真、ビデオ、HTML、テキストエディター、サイドバー、ボタン、タイトル、アイコン。
非常に少ないですが、これはいわば「お試し用」であり、まずビルダーの操作感を知ってもらい、興味を持った人がより機能の多い有料版に切り替える、という仕組みです。
有料版では、約30のモジュールとおよそ60のテンプレートが用意されており、好きなように編集・保存ができます。
カスタマイズ性
Beaver Builderでは、モジュールやテンプレートのカスタマイズがある程度可能です。たとえばテンプレートを追加し、編集して保存、それを再利用することができます。これは作業時間の短縮に非常に便利な機能です。
ただし、モジュールについては一部制限があります。たとえばアイコンの場合、基本色、ホバー色、グラデーション、サイズなどは設定できますが、それ以上の細かいデザイン(例えば枠線や影の追加)は、CSSクラスの追加とコードの挿入が必要です(Beaver BuilderのエディターからCSSクラスの設定は可能です)。
また、私たちが2018年にレビュー記事を公開して以降、新しいモジュールやテンプレートは追加されていないことも付け加えておきます。
コードが書けない方がBeaver Builderをフルに活用したい場合は、「Ultimate Addons for Beaver Builder」(年額69ドル〜)といったアドオンプラグインの利用がほぼ必須になるでしょう。
気に入っている点:
- 安定しており信頼できるページビルダー。市場に登場してから6年以上が経ち、アップデートも頻繁。
- Pro版では、独自のテーマ(および子テーマ)を提供しており、サイト全体(ヘッダー、本文、フッター)の編集が可能。
- 非常に強力なアドオン「Beaver Themer」で、独自のヘッダー/フッター/テンプレートの作成が可能。
- プラグインを無効化してもショートコードが残らない。
- レスポンシブで親切なサポート体制。
気になる点:
- 無料版の制限が多い(モジュールやテンプレートは各10個程度しかない)
- モジュールのカスタマイズ性が低い
- 一部の競合と比較するとテンプレート・モジュールの数が少ない
- 無制限サイト対応のバージョンの価格が高い(年額399ドル)
価格
Beaver Builderは、WordPress公式ディレクトリで無料版が利用可能です。
プレミアム版は、無制限のサイトで使用可能で年額99ドルから利用できます。
Beaver Builderは誰向け?
すべてのユーザーにおすすめですが、特に初心者のWebデザイナーに適しています。
Brizy
アクティブインストール数:8万以上 / ユーザー評価:5点中4.7
Brizyは、プレミアムテーマストア「ThemeFuse」の開発者によって立ち上げられたプロジェクトです。これらの専門家は2009年からこの業界で活動しており、全世界で約100万人の顧客がいると公言しています。
Brizyは他の競合と比べてアクティブインストール数こそ及ばないものの、独自の強みを持っています。
なにしろ、「誰でも使えるサイトビルダー」と自称しているツールに、それなりの期待を持つのは当然のことです。
使いやすさ
Brizyはシンプルさと分かりやすさに重きを置いたページビルダーです。ほとんどの設定はユーザーの使いやすさを考慮して設計されており、すべてフロントエンド上で操作が完結します。
たとえば、ページ作成画面のインターフェースを見てみましょう。
画面中央には目立つボタンが一つあるだけ。迷うことはまずありません。
その後の操作も、Diviのようにサイドバーなしでオンライン上で直接編集が行われます。
Brizyの基本的な構造も、他のページビルダーと同様、**階層構造(行と列)**に基づいています。
その中に「Elements」と呼ばれるモジュール(テキスト、画像、CTA、フォームなど)をドラッグ&ドロップで追加します。ラグもなくスムーズに動作します。
テンプレートとモジュール
Brizyでは「レイアウト」と呼ばれるテンプレートが約100種類用意されており、20カテゴリほど(ビジネス、旅行、ポートフォリオ、スポーツなど)に分類されています。なお、無料版では約20種類が利用可能です。
競合と比べるとテンプレート数は少なめですが、心配は無用です。Brizyにはその弱点を補う**ブロック(事前デザイン済みのセクション)**があります。
このブロック機能には特に力を入れており、なんと500種類以上(約半数が無料)が用意されています。カテゴリも多岐にわたり、問い合わせフォーム、CTA、価格表、ヘッダー、フッターなど多彩です。
最後に「Elements」ですが、これはElementorのウィジェットやDiviのモジュールに相当するものです。**Pro版では24種類(無料版では17種類)**が利用でき、定番の要素(テキスト、画像、マップ、動画、コンタクトフォーム、ボタン、カウントダウン、スライダーなど)は一通り揃っています。
カスタマイズ性
Brizyでは、フォント、色、タイポグラフィ、マージン、ボーダーなど多くの要素を直接編集できます。
特に便利なのは、編集したいブロック上に直接設定が表示されるという点です。編集内容がすぐ目の前に見えるため、操作が非常に直感的です。
気に入っている点:
- 柔軟で使いやすいページビルダー
- 優れたコストパフォーマンスと買い切りライセンスの提供
- 約4,000種類のアイコンを使ってコンテンツをカスタマイズ可能
- 条件付きで動的コンテンツを作成できる機能
- 頻繁なアップデートで新機能が追加されている点
- ポップアップビルダーなどのマーケティングツールも搭載
- WooCommerceビルダーも含まれている
気になる点:
- エコシステムがほとんど存在しない(サードパーティのリソースが少ない)
- テンプレートの数が競合に比べてやや少ない
価格
Brizyは、WordPress公式ディレクトリにて無料版が提供されています。
有料版は3つのプランがあり、1サイト用のプランは年間約50ドルから利用可能です。
Brizyは誰におすすめ?
Brizyは「デザインや開発スキルが不要」なため、あらゆるユーザーに対応可能ですが、特に初心者にとって魅力的な選択肢となるでしょう。
Oxygen Builder
Oxygen Builderは、この「ベストページビルダー比較」に登場する他の選択肢とは少し異なる存在です。
まず第一に、Oxygen Builderは使用するために最も多くの技術的知識が必要です。これを正しく使いこなすには、最低限のHTMLやCSSの知識が求められます。
第二に、Oxygen Builderはアクティブなテーマを使用してサイトデザインを変更するタイプではありません。Oxygenはテーマなしで完全に動作することが可能です。
そして実は、このツールには他にも興味深い特徴がいくつか備わっています。
使いやすさ
正直に言って、Oxygen Builderは慣れるまでが少し難しいビルダーです。このツールを使いこなすには、ある程度の時間と習熟が必要です。
そのインターフェースは、一般的なページビルダーというよりも、**Webデザインツール「Sketch」**に近い印象です。
他の多くの競合と同様に、編集画面は2つのエリアに分かれています:
- 左側のカラムでは、ドラッグ&ドロップで要素を追加できます
- 右側には、実際に編集するサイトの表示部分があり、ここで内容を確認しながら作業します
このビルダーならではの便利な機能として、「Structureパネル」があります。これはページ上のすべてのコンテンツをリスト形式で表示してくれる機能で、全体構造を素早く把握できます。
テンプレートとモジュール
Oxygen Builderでは、タイトル、テキスト、ボタン、画像、動画など、**基本的な要素(約30種類)**が提供されています。基本は揃っていますが、コンタクトフォーム作成用の要素が存在しないのは残念です。
テンプレートに関しては、他の競合と比較するとかなり少なめで、使えるテンプレートはおよそ20種類です。
ただし、自作のテンプレートを作成する機能もあるので、柔軟にカスタマイズしたい人には向いています。
カスタマイズ性
Oxygen Builderは、レイアウト管理において非常に優れたカスタマイズ性能を誇ります:
- 列を作らなくても要素を横並びに配置できる
- 各要素間の間隔や配置を手動で調整でき、マージン数値の変更などに頼る必要がありません
さらに特筆すべきは、CSSクラスの管理機能です。特定のCSSクラスを変更すると、その変更をページ全体に一括適用することができます。つまり、同じクラスを持つ複数の要素を個別に編集する手間が省けます。
気に入っている点:
- ページデザインに対する高いコントロール性
- 高パフォーマンス:Oxygenは不要なスクリプトが少ない軽量ビルダー
- WooCommerce専用のページビルダーを搭載
- Gutenbergブロックビルダーをサポート
- 非常にリーズナブルな価格設定
気になる点:
- 学習コストが比較的高い
- 多言語プラグイン(例:WPML)との統合が必ずしも最適ではない
価格
Oxygenは有料版のみの提供で、価格プランは4種類。最安プランは129ドルからで、無制限のサイトで利用可能です。
Oxygen Builderは誰向け?
Oxygen Builderは主に開発者向け、もしくはCSSやPHPなどのコードに詳しい人を対象としています。
Live Composer
アクティブインストール数:1万以上 / ユーザー評価:5点中4.4
ベストページビルダー比較の続きとして、今回ご紹介するのはこのセレクションの“小さな巨人”、Live Composerです。
あまり知られていない存在ではありますが、アクティブインストール数は1万以上あり、多くの機能を無料で提供しているという興味深い利点を持っています。
Live Composerは約10年前から存在しますが、月日が経つごとに市場シェアを失い、ElementorやDivi Builderといった大手の中で存在感を示すのに苦戦しています。
それでも果たして健闘しているのか?その使用感をまとめましたので、ご自身で判断してみてください。
使いやすさ
最初の印象:Live Composerはあまり使いやすくありません。有効化すると、ダッシュボードには多数のカスタム投稿タイプが表示され、どこから始めればよいのか分かりづらい状態になります。
また、フロントエンドの編集インターフェースはやや古臭く、派手な色使いが特徴です。
使用方法としては、ほとんどのオプションがページ下部のツールバーにまとめられています。このツールバーからモジュールやテンプレートにアクセスできますが、位置を動かすことはできません。
個人的には、ツールバーは右か左のサイドにあった方が便利だと思います。
とはいえ、ドラッグ&ドロップでのオンライン編集は可能なので、そこは少し評価できます。
テンプレートとモジュール
すぐに使えるテンプレートを求めている方には残念なお知らせです。Live Composerには、完成されたページテンプレートは存在しません。
Live Composerには非常に基本的なテンプレートがいくつか用意されていますが、一般的な意味での「ページテンプレート」は提供されていません。
これは大きな制約ですが、モジュールとカスタム投稿タイプを使って自分でテンプレートを作成し、それを各ページにインポートして再利用することは可能です。
一方で、モジュールに関しては充実しており、約40種類のモジュールが用意されています。これは他の多くのページビルダーの平均よりも多い数です。
さらに、有料アドオンとして18種類のプレミアムモジュールを1つのプラグインにまとめたパックも提供されています。
カスタマイズ性
マージン、フォントサイズ、行間、シャドウなど、基本的なカスタマイズ項目は揃っており、一通りの編集は可能です。
しかし、操作は非常に直感的とは言えず、使いにくいです。レイアウトも分かりづらく、モジュールの幅を手動で引き伸ばすような操作ができない点も不便です。
気に入っている点:
- 無料で使える!
- WooCommerceストア用のカスタマイズ機能(専用の有料アドオンが必要)
気になる点:
- テーマビルダーではないため、ヘッダーやフッターのカスタマイズは不可(自社製テーマを使えば可能)
- 編集の流れがスムーズではない
- ページテンプレートが存在しない
- 他の競合と比べてあらゆる面で見劣りする
価格
Live ComposerはWordPress公式ディレクトリにて無料版が提供されています。
ただし、有料プラグインとして以下の2つが用意されています:
- WooCommerce専用アドオン
- 拡張機能パック(公式)
どちらも1サイトあたり69ドルで利用可能です。
Live Composerは誰向け?
このページビルダーは、カスタム投稿タイプの仕組みに精通している技術者や開発者向けです。
一般的には、多くの制限があるため、使用はあまり推奨できません。
Thrive Architect
あなたは“変換率オタク”ですか?つまり、コンバージョン重視の人ですか?
もしそうなら、Thrive Architectをすでに知っているか、少なくとも一度は耳にしたことがあるはずです。
このページビルダーは、技術的な知識なしに売上を伸ばしたいマーケター向けに特化して設計されています。
Thrive Architectを使うのに、コーディングの知識は一切不要です。そのオプションの豊富さについては、以下をご覧ください。
使いやすさ
Thrive Architectの開発者は、製品のコンセプトを次のように説明しています:
「とにかく素早く使えるように設計した」と。
実際、その言葉通り、基本的には操作がスムーズです。ただし、オプションの数が非常に多いため、最初は少し学習が必要です(この点については後ほど触れます)。
編集インターフェースはモダンで使いやすく、Elementorに非常に似た構造です:
- 左側のカラムに要素が表示され、ドラッグ&ドロップでページに追加できます
- 右側では、変更をリアルタイムプレビューしながらオンラインで編集できます
テンプレートとモジュール
Thrive Architectには、約40種類のウィジェットがデフォルトで統合されています。中でもマーケティング用途に特化したもの(例:コンタクトフォーム、カウントダウン、テスティモニアル、ウェビナーなど)が豊富です。
そして、Thrive Architect最大の魅力はランディングページにあります。
執筆時点で、350種類以上のテンプレートが用意されています!
この膨大な数のおかげで、ランディングページ、セールスページ、ウェビナーページ、オプトインページの作成にはまったく困りません。
カスタマイズ性
Thrive Architectは、要素のカスタマイズにおいてほぼ無制限の自由度を提供しています。
たとえば、以下のようなことが可能です:
- カラムのサイズを手動で調整
- デバイス(PC・スマホ・タブレット)ごとに要素の表示/非表示を管理
- ダイナミックなアニメーションの追加
気に入っている点:
- テンプレートやコンテンツ要素が頻繁に追加され、進化し続けている点
- Thrive Themesのエコシステム:Thrive Architect以外にも多数のツールが提供されており、たとえばThrive Leadsを使えばサイト上でメール収集も可能。これをThrive Architectと連携させることも可能
- 公式の動画チュートリアルが豊富で、機能を最大限に活用できる
- コストパフォーマンスが非常に良い
気になる点:
- 機能が多すぎて、最初に全体像を把握するまでに時間がかかる
- Thriveスイートの他のツールと連携して使うことが前提になっている
- サポートの対応がやや遅いことがある
価格
Thrive Architectは有料のプレミアムページビルダーで、
1サイトでの使用ライセンスは年額99ドルから利用可能です。
また、**Thrive Suite(年額299ドル)**に加入すると、Thrive Themesが提供するすべてのツールにアクセスできます。
Thrive Architectは誰におすすめ?
Thrive Architectは、自分のサイト上で本格的なマーケティング戦略を実現し、コンバージョンを最大化し、売上を伸ばしたい人に最適です。
ただし、その効果を最大限に引き出すには、Thriveスイートの他ツールと組み合わせて使う必要があります。
Page Builder by SiteOrigin
アクティブインストール数:60万以上 / ユーザー評価:5点中4.8
「古参のベテラン」――それが、この Page Builder by SiteOrigin を表す言葉です。長年にわたり提供されてきたこのページビルダーは、最初に登場したビルダーのひとつでもあります。
この長い歴史により、多くの熱心なユーザーコミュニティを築き上げてきました。執筆時点では、約100万人がこのプラグインをサイトに導入しており、公式ディレクトリにおいてはElementorに次ぐ2番目に人気のあるページビルダーです。なかなかすごいですよね?
競合との「技術的な」最大の違いは、コンテンツのカスタマイズにウィジェットを使用する点です。これは、WordPressのネイティブウィジェットと、SiteOrigin独自のウィジェットの両方が使えるということです。
そして最後に、無料で使えるという点も大きな魅力です。少し興味が湧いてきましたか?さっそく詳しく見ていきましょう!
使いやすさ
Page Builderは、Diviのようにバックエンドとフロントエンドの両方で使用可能です。
学習コストは比較的低く、すぐに使い始めることができますが、ユーザーインターフェースにやや難点があるのは残念です。
たとえば、アクションボタンが非常に小さいという問題があります。
また、大きな欠点のひとつはリアルタイム編集ができないことです。ページ上のコンテンツを直接編集しようとすると、設定ウィンドウが必ず開く仕様になっており、これは少々不便です。
テンプレートとモジュール
Page Builder自体が提供するウィジェットは非常に少なく、約10種類(ボタン、スライドショー、動画、リッチテキストなど)。加えて、**WordPressのデフォルトウィジェット(12種類)**も利用可能です(アーカイブ、最近の投稿、カテゴリ、カレンダーなど)。
さらに機能を拡張したい場合は、SiteOrigin Widgets Bundle という別プラグインを有効化する必要があります。これにより、CTAボタン、コンタクトフォーム、Googleマップなど22種類の追加ウィジェットが利用可能になります。
また、Page Builderは以下も提供しています:
- 16種類のレイアウト(ページテンプレート):ワンクリックで有効化可能
- 16種類のパック(サイト全体のテンプレートモデル)
カスタマイズ性
SiteOrigin Widgets Bundle を利用することで、なかなか良いカスタマイズ体験が得られます。興味のあるウィジェットだけを有効化することもできるため、ページ読み込み速度の低下を防ぐことができます。
レスポンシブ表示の際には、カラムの左右切り替えなどの設定も可能です。
スタイル要素(色、フォント、間隔、マージンなど)の変更も一般的な競合と同様に行えます。
ただし、ビジュアルの細かいカスタマイズを行うにはCSSコードが必要になる場面が多いです。
気に入っている点:
- ウィジェットを通じたWordPressとの高い統合性
- 軽快な読み込みスピード
気になる点:
- 無料プラグインのため、個別のメールサポートがない
- 機能面では他の競合よりも制限が多い
- Elementor Pro や Divi Builder のようなテーマビルダー機能がない(ヘッダーやフッターのカスタマイズ不可)
価格
Page Builder は完全無料で利用できます。
さらにカスタマイズの幅を広げたい場合は、**SiteOrigin Premium(1サイトあたり29ドル〜)**のアドオンパックを購入することで追加機能が利用可能になります。
Page Builder by SiteOrigin は誰向け?
このページビルダーは、初心者から上級者まで幅広く利用可能ですが、もしこれが初めてのページビルダーであれば、他の最新ビルダー(Elementor、Divi、Thrive Architectなど)をおすすめします。
それらの方がカスタマイズ性やユーザー体験が優れているためです。
WPBakery Page Builder(旧:Visual Composer)
このページビルダーを旧名「Visual Composer」としてご存知の方もいるかもしれません。ブランド名は2017年末に変更され、現在ではWPBakery Page Builderとして知られています。
WPBakeryは、今回紹介するページビルダーの中で最も歴史のあるツールです。2011年に登場し、プレミアム版のみ提供されており、Envatoプラットフォームで入手できます。
そしてこのEnvato上では、WPBakeryはまさにスター的存在です。40万以上の販売実績を誇り、最も売れているページビルダーとなっています。
さらに、WPBakeryは200万以上のサイトにインストールされており、その理由の一つは多くのテーマに統合されているからです。ユーザーからの評価は高い一方で、開発者からの評価はあまり芳しくありません。
開発者たちは、操作性の悪さや旧式のショートコードシステム(これによりサイト移行が非常に困難になる)を批判しています。
使いやすさ
この比較でも触れている通り、WPBakery Page Builderは直感的とは言えず、操作もかなり複雑です。たとえば、コンテンツ要素の編集に多くのクリックが必要になります。
ただし、フロントエンドとバックエンドの両方で使用可能で、ドラッグ&ドロップのインターフェースを採用しています。
フロントエンドでは、変更内容を即座に確認できるWYSIWYGインターフェースが提供されています。
テンプレートとモジュール
WPBakery Page Builderには、40種類以上のモジュールがあらかじめ統合されています。画像や区切り線、アイコンといった基本的なものから、ウィジェットをカスタマイズできるサイドバーのような高度なモジュールまであります。
テンプレートについても悪くありません。80種類以上のテンプレートが用意されています。
カスタマイズ性
WPBakeryでは、カラム、セクション、カラー、タイポグラフィなど、あらゆる要素のカスタマイズが可能です。
この点については文句ありません。ただし繰り返しになりますが、モジュールやテンプレートのカスタマイズは容易ではありません。
気に入っている点:
- WYSIWYGインターフェースにより、ページ上のコンテンツをリアルタイムで編集可能
- 多数のアドオンが利用可能(例:Livemesh Addons for WPBakery Page Builder など)
気になる点:
- 操作性(UI/UX)が劣っている
- WPBakeryやそれを内包するテーマを無効化するとショートコードがページに大量に残る
- カスタマイズの手間がかかる
価格
WPBakery Page Builderは有料版のみの提供で、**価格は$64(1サイトあたり)**です。
WPBakery Page Builderは誰向け?
WPBakery Page Builderは、あらゆるレベルのユーザーに対応可能ですが、
技術的な制限や使いにくさを考慮すると、あまりおすすめできません。
Visual Composer
アクティブインストール数:5万以上 / ユーザー評価:5点中4.6
「Visual Composer?それってWPBakeryの旧名じゃないの?」
――そう思ったあなた、前の紹介をちゃんと読んでいたならお見事です。
確かにそれは正解ですが、ここで紹介するのはVisual Composer Website Builderです。これは、現在「WPBakery」として知られるページビルダーと同じ開発者によって2017年にリリースされたフリーミアム(無料+有料)型のサイトビルダーです。
この2つの違いがわかりづらい場合は、WPBakeryの記事をぜひご覧ください。
Visual Composer Website Builderはより高度なビルダーで、プレミアム版を使えば、ヘッダーやフッターも含めたサイト全体をカスタマイズ可能です。操作はドラッグ&ドロップ、テンプレートも豊富に用意されています。
使いやすさ
管理画面では、初期設定を行うための5つのサブメニュー(ダッシュボード、ヘッダー、フッター、サイドバー、基本設定)が表示されます。
私たちが実際にこのビルダーをテストした際、Elementor Pro、Beaver Builder、Divi Builderなどの競合製品に近いフロントエンド構造を持っていると感じました。左側には機能や要素のツールバーがあり、それを右側のページ上にドラッグ&ドロップで配置する仕組みです。
「シンプルですか?」
はい、WPBakeryよりはシンプルです。しかし、テキスト編集の操作性はやや直感性に欠け、クリック回数が多くなる傾向があります。
その一方で、キーボードショートカット(MacならCmd+Z、WindowsならCtrl+Z)や専用キーで操作を元に戻せる機能、またページ構造を階層表示で確認できる「ツリービュー」機能など、便利なポイントも備えています。
テンプレートとモジュール
Visual Composer Hub(クラウドベースの要素提供プラットフォーム)には、**約200種類のモジュール(Elements)**が用意されています。
プレミアム版を使用すれば、これらのモジュールをサイトに統合可能で、管理画面またはフロントエンドからHubにアクセスできます。
なぜこんなにモジュールが多いのか?
定番の画像・アイコン・HTML要素はもちろん、アニメーション付きボタンや3色ボタン、さらにWooCommerce専用の要素まで含まれているからです。
テンプレートも豊富で、ホームページ、「会社概要」ページ、ブログページなどのページテンプレートに加え、業種別テンプレートも用意されており、200近い選択肢の中から選べます。デザインのバリエーションが豊富で、カスタマイズのしやすさも評価できます。
カスタマイズ性
前述の通り、プレミアム版を使えば、ページの本文だけでなく、ヘッダー、フッター、サイドバーもカスタマイズ可能です。
ゼロから作成することも、既存テンプレートをベースに編集することも、自作テンプレートを再利用することもできます。
さらに、投稿や固定ページなど、コンテンツの種類ごとに異なるヘッダーやフッターを表示する設定も可能です。これはかなり便利です。
ページの中身に関しては、各要素にアニメーションや効果を加えたり、マージンやボーダーを簡単に調整できます。レスポンシブ対応として、デバイスごとに異なる設定値を指定することも可能です。
気に入っている点:
- テンプレートやモジュールのバリエーションが豊富
- コンテンツの種類ごとに異なるヘッダー/フッターを表示できる機能
- マージンやボーダーの管理が簡単
気になる点:
- テキスト編集がやや直感的ではない
- 一部の競合と比べて、カスタマイズオプションの自由度がやや劣る
価格
Visual Composerには無料版(制限あり)がWordPress公式ディレクトリで提供されています。
すべての機能を利用し、Visual Composer Hubへのアクセスを得たい場合は、3つの有料プランから選べます。
1サイトあたり年額49ドルが目安です。
Visual Composerは誰向け?
操作のしやすさやテンプレート・モジュールの豊富さから、Visual ComposerはあらゆるレベルのWebデザイナーに対応可能です。
ただし、Elementor ProやDivi Builderの方がカスタマイズ性では優れているため、いくつかのビルダーで迷っている場合は、そちらを検討するのも良いでしょう。
Spectra
Spectraは、以前は「Ultimate Addons for Gutenberg」として知られていた、WordPressブロックエディターに統合されるページビルダーです。
新しいシステムを一から学ぶ必要はなく、慣れ親しんだWordPressのエディター内で、投稿や固定ページの作成に役立つ新しいブロックやリソースにアクセスできます。
Spectraでは、28種類の新しいブロック、複数のブロックパターン、ワイヤーフレーム、無料および有料のテンプレートが提供されています。
これらはすべてエディターメニューからアクセス可能で、通常のWordPressブロックと同様の方法でSpectraブロックを選択できます。ブロックパターンやワイヤーフレーム、テンプレートにも、追加されたメニューからアクセスできます。
ページ上のすべての要素はカスタマイズ可能で、ブロックの追加・削除・変更も、これまでと同じ方法で作業可能です。
Spectraは、必要最小限のコードだけを読み込むことで、パフォーマンスを維持するよう設計されています。未使用のブロックのコードは読み込まれず、使用されるコードは極力スリムに保たれ、Reactフレームワークによって最大限のパフォーマンスが実現されています。
使いやすさ
Spectraが特に優れているのは、この**「使いやすさ」**です。新しい操作体系を覚える必要はなく、WordPressのブロックエディターにそのまま統合されます。
通常どおりにページや投稿を開くと、Spectra独自の追加ブロックが表示されます。メニューを確認すると、ワイヤーフレーム、ブロックパターン、テンプレートの項目も見つかります。
ワイヤーフレームを選べば、画像やテキストなどの要素がプレースホルダーとして設定されたあらかじめ用意されたセクションが表示されます。
ブロックパターンを選べば、ダミーテキスト(lorem ipsum)や仮画像付きの完成済みセクションが表示されます。テンプレートは、サイト全体で使えるテーマで、無料で使えるものも多く、一部は有料のSpectra Pro専用となっています。
カスタマイズはすべて、WordPress標準の設定メニューで行えます。色、タイポグラフィ、レイアウトなどを自由に調整でき、プリセットの使用で全体のデザインを素早く整えることもできます。
テンプレートとモジュール
Spectraは、ブロックエディターで使える28種類のブロックを提供しています。また、多数のブロックパターン、ワイヤーフレーム、テンプレートも含まれており、その数は随時増え続けています。
テンプレートは高品質でSEOにも最適化されており、完全レスポンシブ対応です。Spectra全体としてパフォーマンス重視で設計されており、読み込み速度にも影響を与えません。
カスタマイズ性
Spectraでは、WordPress標準ブロックと同じメニューから、すべての要素をカスタマイズできます。
タイポグラフィ、スタイル、色、余白、レイアウト、Flexブロックなどの詳細な調整が可能で、カスタムCSSも使用できます。
さらにSpectraは、スタイルのコピー&ペースト機能もサポートしています。ブロックやパターンを作成・デザインした後、そのスタイルをコピーしてサイト内の別の場所にペーストでき、作業時間を大幅に短縮できます。
気に入っている点:
- Spectraは完全無料で使用可能。Spectra Proも価格が良心的
- 独自システムではなくWordPressに直接統合されているため、操作がわかりやすい
- 使用してもページ速度がほとんど低下しない優れたパフォーマンス
- 提供されるテンプレートは、同社の代表テーマ「Astra」のクオリティを反映
- ページ上のすべてをカスタマイズ可能
気になる点:
- もっと多くのブロックが欲しいと感じる
- 最も優れたテンプレートはSpectra Pro専用である点
価格
Spectraは完全無料です。
Spectra Proは、1サイトでの利用が年額49ドルから利用可能です。
Spectraは誰向け?
Spectraはあらゆるタイプのユーザーに対応可能です。
WordPressに統合されているため学習コストはゼロで、すべてのブロックやツールをブロックエディター内から利用できます。
WordPressで検討すべきその他のページビルダー
これまでに、WordPressでおすすめのページビルダーをいくつかご紹介してきました。
しかし、このタイプのツールはWordPressエコシステム内に特に数多く存在しているため、以下に調査中に出会う可能性のある他のページビルダーもご紹介しておきます:
- Themify Builder:同名のプレミアムテーマストアが開発したページビルダー。
- WP Page Builder:QubelyやWP Mega Menuの開発元でもあるThemeumによって設計されたビルダー。
- Breakdance:Oxygen Builderの開発者が提供する、主に初心者向けのページビルダー。
- Page Builder Sandwich:バックエンドとフロントエンドの両方で使用可能なページビルダー。
- SeedProd:もともとは「メンテナンスページ」「近日公開ページ」作成に特化していたが、現在は独自のページビルダー機能も提供している。
- Nimble Page Builder:「高速」「軽快」をコンセプトに掲げるページビルダー。
- Bold Page Builder:100%無料で提供されており、プレミアム版が存在しない点が特徴。
- Pagelayer:約100種類のウィジェットを提供している、豊富な選択肢が魅力のビルダー。
WordPressのサイトエディター:ページビルダーの代替手段として有効か?
これまでご紹介してきたように、WordPressのページビルダーを使えば、コード不要でカスタムサイトやレイアウトを作成することが可能です。
しかし忘れてはならないのが、WordPressには初めからページビルダーに近い機能を備えたオプションが存在するという点です。以下に詳しく見ていきましょう。
WordPressのコンテンツエディター
ページや投稿を作成する際、多くの人がWordPress標準のコンテンツエディターを使用しているでしょう。
このエディター、通称**Gutenberg(グーテンベルク)**は、WordPress 5.0のリリースとともに2018年末に登場しました。
仕組みはシンプルで、「ブロック」と呼ばれるコンテンツのひな型をページや投稿内に追加していく形式です。
WordPressのコンテンツエディターでは、あらかじめ用意されたブロックを追加してコンテンツを作成します。
このエディターは登場以来大きく進化し、ネイティブ機能やサードパーティ製プラグインを通じて、ページビルダーに近い機能も増えてきましたが、依然として**「ページビルダー」ではありません**。
たとえば:
- ページ全体のビジュアルデザイン(構造)をカスタマイズすることはできません。ヘッダーやフッターの編集も不可です(多くのページビルダーでは可能)。
- バックエンド(管理画面)上でしか使用できません。フロントエンドでの編集は非対応です。
- 使用しているテーマのスタイルに依存するため、カスタマイズ性はページビルダーより制限されます。
とはいえ、ページビルダー並みの結果を目指せる強力なプラグインも存在します。
例:GenerateBlocks など。ただし、これらのプラグインを使いこなすにはある程度の技術的な知識が必要です。
結論として、初心者にとっては、WordPressのコンテンツエディターは主に記事の中身を編集するためのツールと捉えるのが妥当です。
「コンテンツエディター」と「ページビルダー」、どちらを使うべきか迷っているなら、
Gutenbergとページビルダーの詳細比較記事をご参照ください。
ところで、コードを一切書かずにサイト全体をデザインできる、より強力なエディターも登場しているのをご存知でしょうか?
それが、ここから紹介する「サイトエディター(Site Editor)」です。
サイトエディター
2022年1月、WordPress 5.9のリリースによって、WordPressのエコシステムに大きな変化がもたらされました。
このメジャーバージョンでは、**「フルサイト編集(Full Site Editing)」という新機能が追加されました(のちに「サイトエディター」**と名称変更)。
その目的は?
このエディターでは、ページのコンテンツだけでなく、ヘッダー、フッター、メニュー、テンプレートなど、サイト全体の構造をブロックベースで作成・編集することが可能になりました。
つまり、追加プラグイン不要・無料で、ページビルダーのように使えるというわけです!
分かりやすく整理すると、現在は2種類のエディターが共存しています:
- コンテンツエディター:記事やページの中身を編集するためのエディター。ただし、構造の変更はできない。
- サイトエディター(外観 > サイトエディター):サイト全体の構造(ヘッダー、フッター、テンプレートなど)を制限なく作成・編集可能。
「じゃあ、今後のサイト制作はこのサイトエディターで決まり?」
……と言いたいところですが、初心者にはまだおすすめしづらい理由がいくつかあります:
- 提供されている機能は徐々に充実してきてはいるものの、多くのページビルダーに比べると依然として機能不足。特にコードを一切触らずに自由にカスタマイズするには限界があります。
- ブロックテーマにしか対応していないという制約があります。公式ディレクトリ上のブロックテーマ数は増えてはいますが、記事執筆時点でまだ200種類強と限定的です。
- 初心者にとっては、ページビルダーよりも設定が複雑・技術的に感じられる可能性が高いです。
まとめ
初心者やWebデザイン・開発の経験が少ない方には、現時点ではページビルダーの使用をおすすめします。その方が手軽にサイトを構築できるでしょう。
一方で、中級者以上のユーザーにとっては、サイトエディターは非常に強力なツールとなり得ます。今後のWordPressの進化とともに、ますます注目すべき機能となるでしょう。