最高のWordPressWYSIWYGエディター–7つのページビルダーの比較

WordPressに最適なWYSIWYGエディターをお探しですか？

この記事は、あるドラッグアンドドロップWPエディターから別のエディターに移動したときの過去3年間の私の経験に基づいています。

私はついに私が愛するのが好きなものを見つけました、そして私はそれがどれであるかを下に教えます。

では、なぜWordPress用のWYSIWYGエディターが必要なのですか？

結局のところ、WordPressには、技術的にはWYSIWYGエディターであるTinyMCEと呼ばれるエディターがすでにバンドルされています。

ここで明確にする必要があるのは、WYSIWYGエディターとは、ページまたは投稿を作成するときに得られるものを正確に確認できるエディターのことです。

TinyMCEを使用すると、「保存」をクリックしてプレビューするまで、出力がどのようになるか正確にはわかりません。

ここで確認したWYSIWYGエディターはすべて、ライブフロントエンド編集を許可します（SiteOriginのPageBuilderを除きます。詳細については以下を参照してください）。 つまり、ページを編集したり投稿したりすると、ページに表示されているとおりの最終出力が表示されます。

そのため、適切なWYSIWYGエディター、別名ドラッグアンドドロップエディターまたはビジュアルエディターは、記事やブログ投稿をすばやくアップロードする必要がある忙しいブロガーにとって必須です。

最近、使用しているビジュアルエディタをSiteOriginのPageBuilderPremiumからThriveArchitectに変更しました。 行動を起こす前に、私はかなりの調査を行いました。これらは私が検討した候補でした。

最高のWordPressWYSIWYGエディターは何ですか？

Visual Composerは、WordPressで最も売れているドラッグアンドドロップページビルダーの1つです。 それは間違いなく最高のWordPressWYSIWYGエディターの候補です。

完全に機能するバックエンドとフロントエンドのエディターがあり、WordPressのテーマで動作します。

Visual Composerには、次のような45を超えるコンテンツモジュールが付属しています。

• ポストグリッド
• メディアサポート
• チャート
• スライドショーの背景
• カルーセルスライドショー
• YouTube
• Vimeo
• セルフホストビデオ

VisualComposerの他の機能のいくつかは次のとおりです。

• セクション、行、列に簡単に適用できる視差背景効果
• アルファチャネルをサポートするCSSグラデーションの背景
• 投稿、ページ、カスタム投稿をサポートします
• WordPressショートコードをサポート
• テンプレートシステムを使用すると、カスタマイズしたデザイン要素をテンプレートとして保存できます
• SEO向けに最適化されているため、キーワードのランキングに関してコンテンツは順調にスタートしています。
• モバイルデバイスで完全に応答
• 完全な改訂履歴により、以前のバージョンの作業にすばやく戻すことができます
• デフォルトのWordPressウィジェットをサポートします
• サイドバーエディタ
• ヘッダーエディター
• フッターエディター
• VisualComposerテンプレートをサイトからサイトに数秒で移行します
• グーテンベルクとの互換性-ページレイアウトの任意の場所にグーテンベルクブロックを追加します

手短に

基本的なレイアウトに適しています。 レイアウトとUIはあまり直感的ではありません。 他のページビルダーと比較して、コンテンツ要素の優れた選択ではありません。

価格設定

• 無料
• 年間49ドルから

100万を超えるアクティブなインストールがあるSiteOriginのPageBuilderは、最も人気のあるWordPressページビルダーの1つです。 その人気の一部は、無料であるという事実によるものです（ただし、プレミアムウィジェットバンドルを購入することはできます）。

機能の一部を次に示します。

• WordPressテーマで動作します
• 追加する列ごとに正確な行数を選択してください
• 既存のすべてのWordPressウィジェットを使用する
• レスポンシブデザイン
• 投稿、ページ、カスタム投稿タイプがサポートされています
• 改訂履歴ツールを使用すると、変更を元に戻すことができます

SiteOriginのPageBuilderは無料ですが、次のようなアドオンを含むプレミアムウィジェットバンドル（$ 29）があります。

• アコーディオン
• ブロックアニメーション
• お問い合わせフォーム
• 召喚状ウィジェット
• ライトボックス
• 視差スライダー
• お客様の声

Site Origin Page Builderは任意のWPテーマと統合されるため、特定のテーマにコミットすることはありません。

他のWordPressビジュアルエディターほど多くのスタイリングオプションはありません。 高度なスタイリングを行うには、CSSに精通している必要があります。

Site Originには、バックエンドエディターとフロントエンドエディターの両方があります。 ただし、フロントエンドエディターは、ここで確認した他のwysiwygエディターほど高度ではありません。

フロントエンドエディタで行った変更はすぐには表示されません。ページがリロードされるまで数秒待つ必要があります。

これにより、他の編集者に比べて不格好に感じられ、新しいブログ投稿を作成するプロセスが遅くなります。

Site Origin Page Builderで私が見つけたもう1つの問題は、新しい段落、新しい見出し、新しい画像などの要素を挿入するための適切な場所を見つけるのが難しいことです。

ライブエディターでは、左側のパネルにのみ要素（またはモジュール）を追加できます。 しかし、左側のパネルのどこにいるかを知ることは非常に困難です。

すばらしいのは、次のような機能が追加された場合です。右側のパネルの要素にマウスを合わせると、左側のパネルが自動的に下にスクロールし、左側のパネルの関連するブロックが強調表示されます。 このようにして、新しい要素またはモジュールを挿入する場所を知ることができます。

私はこれについて1年ちょっと前にSiteOrigin PageBuilderに手紙を書きました。 しかし、彼らは明らかにそれを船に乗せませんでした。

最後の考慮事項：

Site Origin Page Builderをアンインストールすると、クリーンなHTMLとショートコードが混在したままになります。 これは、Site Originで作成したページが、別のページビルダーで編集できない可能性があることを意味します。

手短に

SiteOriginのPageBuilderは、ElementorやThriveArchitectと同じリーグではありません。 私の意見では、それは「最高のWordPressWYSIWYGエディター」の実行にはありません。

一つには、「ライブエディタ」は真のフロントエンドエディタではありません。 編集中に変更がすぐに表示されるわけではありません。編集するたびにページがリロードされるため、時間の遅れがあります。 これは本当にあなたを遅くします。

価格設定

• Site Origin PageBuilderは無料でダウンロードできます
• Site OriginPremiumは年間29ドルから

Divi Builderは、元々、ElegantThemesによるDiviテーマの一部でした。 しかし、今では、WordPressテーマで動作するスタンドアロンのページビルダーになっています。

機能の一部は次のとおりです。

• フロントエンドとバックエンドの両方の編集
• 完全なレスポンシブデザイン
• 投稿、ページ、カスタム投稿のサポート
• 46のページビルダーモジュールが付属しています
• 速くて使いやすい
• さまざまなレイアウトをA / Bテストできます
• カスタムCSSをサポートする

手短に

500,000を超える顧客を抱える、Divi Builderは、利用可能な最も人気のあるWordPressエディターの1つです。 さまざまな種類のWebサイト用に20以上の異なるレイアウトとテンプレートが付属しています

ただし、DiviBuilderはショートコードに大きく依存しています。 これは、別のページビルダーに切り替えることができないことを意味します。 事実上、DiviBuilderの使用に固定されています。 これは重大な欠点であり、私の意見では、最高のWordPressWYSIWYGエディターの競争からそれを取り除きます。

価格設定

• Divi Builderをダウンロードするには、年間89ドルのElegantThemesのメンバーになる必要があります。
• また、エレガントなテーマによって作成されたすべてのテーマとプラグインにアクセスできます。これは悪いことではありません。

Elementor Page Builderは比較的新しいWordPressビジュアルエディター（2016年にリリース）ですが、すでに1,000,000を超えるアクティブなインストールがあります。

それは「世界をリードするWordPressページビルダー」と自称しています。

私の知る限り、これは唯一のオープンソースのWordPressページビルダーです。 何千人もの開発者が、テーマ、アドオン、その他の製品を構築することでElementorのコア機能を拡張してきました。

機能の一部を次に示します。

• テンプレーティングシステムを使用すると、レイアウトを保存して、Webサイトの他の場所で再利用できます。
• 他のWordPressプラグインで作成されたウィジェットを追加できます
• あらゆる業界とニーズに合うように設計された300以上のテンプレートが付属しています
• 真のフロントエンド編集-ページを編集しながらライブで見る
• クリーンなコードを残します（Elementorを非アクティブ化した場合）
• Elementor'sCanvasを使用してランディングページ全体をデザインする
• 高度なアコーディオン、スライダー、紹介文、アイコン、ソーシャルメディア、タブなどの基本的な画像およびテキストウィジェットを含む、80を超えるデザイン要素
• 任意のWordPressテーマとプラグインで動作します
• 改訂履歴を使用すると、簡単なキーストロークで間違いをすばやく元に戻すことができます
• Facebookの投稿とビデオをページに埋め込む
• レスポンシブモバイルフレンドリーデザインをサポート

手短に

これは、世の中で最も先進的なページビルダーの1つです。 最高のWordPressビジュアルエディターになることを約束することで、絶え間ない改善を確実にすることができます。

大きなプラスは、無料版では有料版の約90％にアクセスできることです。 ただし、Elementorはコンバージョンに焦点を当てていないため、マーケターにとって最良の選択ではありません。

Elementorが最高のWordPressWYSIWYGエディターであると考える人もいるでしょう。 しかし、あなたの焦点があなたのウェブサイトからのコンバージョンを最大化することにあるなら、私はそのタイトルがThriveArchitectに属すると信じています。

価格設定

• 無料
• 49ドルの1回限りの料金

Thrive Architect（Site Origin Page Builderから）に移動したばかりで、非常に感銘を受けているので、ここで少し客観性が失われる可能性があります。

Thrive Architectは、Thriveの以前のページビルダーであるThrive Content Builderに基づいており、大幅なオーバーホールと多くの新機能が提供されています。

Thrive Architectが他のビジュアルエディタから際立っているのは、変換に重点を置いていることです。 そしてそれがブロガーやマーケターのお気に入りになっている理由です。

Thrive Architectには、カスタマイズ可能なボタン、お客様の声、カウントダウンタイマー、およびすべての主要な電子メールマーケティングツールと統合するリード生成フォームが付属しています。

すでにThriveLeadsを使用している場合は、ボタンをクリックするだけでオプトインフォームを追加できます。

私が絶対に気に入っているThriveArchitectの1つの側面は、スライダーを使用して画像を拡大縮小できることです（以前のページビルダーでは、5つまたは6つの固定サイズしかありませんでした）。

Thrive Architectのもう1つの優れたオプションは、画像の上に色付きのレイヤーを配置する機能です。

そして、本当に人々の注意を引きたいのであれば、アニメーションの見出しを追加することができます（私は以下のgifで両方のテクニックを使用しました）：

フロントエンドの編集は絶対的な喜びです。おそらく、ビジュアルエディタの中で最高のフロントエンド編集エクスペリエンスです。

Thrive Architectについて私が気に入っているもう1つの点は、高度なドロップシャドウコントロールです。

スクリーンショットの周りにドロップシャドウを配置して、テキストから目立つようにするのが好きです。 以前のエディターでは、これを行う方法がなかったため、グラフィックアプリケーションにドロップシャドウを追加しました。これには非常に時間がかかります。

Thrive Architectを使用すると、ワンクリックで実行できます。

Thrive Architectは変換を専門としていると言ったことを覚えていますか？

ThriveArchitectに強力なランディングページビルダーが含まれているのは当然のことです。

これらは、ランディングページに追加できる既製の（ただしカスタマイズ可能な）セクションの一部です。

• 社会的証明/推薦状セクション
• ヒーロー画像セクション
• CTAセクション
• 機能セクション
• 仕組みセクション
• ボーナスセクション
• 保証課
• セールスファネル

ThriveArchitectの他の機能のいくつかを次に示します。

• モバイルフレンドリーなレスポンシブデザイン
• 内蔵のテンプレートシステムにより、
• レイアウトの保存と読み込み
• 改訂履歴と元に戻すと
• やり直しボタンで修正
• そよ風を変える
• スタイル付きの箇条書き
• リスト（このような）
• 機能グリッド（画像またはアイコン付き）
• 動的カウントダウンタイマー
• オプトインフォーム
• ページイベント-特定のトリガーに基づいてライトボックスポップアップを表示します

Thrive Themesのチームは、ThriveArchitectに常に新しい機能を追加しています。 そしてそれはこのWordPressエディターがWordPressのための最高のWYSIWYGエディターであり続けることを保証します。

手短に

Thrive Architectは、マーケターや、訪問者をサブスクライバーや顧客に変えようとしている人にとって理想的なページビルダーです。 Thrive Architectは変換を専門としており、私が知っている他のどのページビルダーよりも多くの変換ツールを備えています。 Thrive Architectは、ルックアンドフィールの点でElementorと比較されることがよくあります。 しかし、私はElementorよりもThriveArchitectのUIの方が好きです。 私の意見では、ThriveArchitectは最高のWordPressWYSIWYGエディターです。

価格設定

ThriveArchitectはThriveSuiteの一部であり、四半期あたり90ドルです。

500,000以上のアクティブなインストールがある、BeaverBuilderは最も人気のあるWordPressページビルダーの1つです。 また、最も使いやすいものの1つであるため、ブロガーを始めるのに最適です。

BeaverBuilderが提供する機能の一部を次に示します。

• 任意のWordPressテーマで動作します
• ライブフロントエンド編集–変更を加えながら変更を確認します
• WordPressウィジェットとショートコードのサポート
• カスタムCSSクラスとIDをサポートします
• Beaver Builderをアンインストールすると、コンテンツはネイティブWPエディターに転送されます
• モバイルデバイス向けに最適化
• 事前に作成された数十のページテンプレートが付属しています
• スライダー、カルーセル、背景、コンテンツブロック、ボタンなどのモジュールを提供します

私は言わないといけない; Beaver Builderのユーザーインターフェイスは、ElementorまたはThriveArchitectと比較して少し基本的に見えます。

手短に

Beaver Builderは、コツをつかむのに大きな学習曲線がないため、初心者には最適なオプションです。 他のページビルダーほど多くのモジュールを提供していません。 プラス面として、WordPressエディターに戻したい場合、Beaver Builderは100％クリーンなコードを残します。 そのため、WordPressエディターや他のほとんどのページビルダーで以前の投稿を編集できるようになります。

価格設定

• 初年度は99ドル、その後40％割引で更新

WordPressには、常に独自のプリインストールされたエディターが付属しています。 しかし、WordPressは最近、Gutenbergと呼ばれるまったく新しい完全無料のドラッグアンドドロップエディターをリリースしました。

グーテンベルクには、非常にクリーンで直感的なユーザーインターフェイスがあります。

Gutenbergをインストールすると、それがデフォルトのエディターになります。選択する必要はありません。

グーテンベルクエディタは、「プラス」記号をクリックしてページに挿入または投稿したブロックに基づいて動作します。

Gutenbergは、WordPressがプリインストールされたオープンソースのTinyMCEエディターから大きく飛躍しましたが、有料ページビルダーで利用できる高度な機能の一部がまだ不足しています。

これがグーテンベルクに付属しているブロックのサンプルです

• コンテンツ概要ブロック
• AdvancedListブロック
• ボタンブロック
• 画像ブロック
• 高度なビデオブロック
• 目次ブロック
• Googleマップブロック
• AdvancedTableブロック
• アコーディオンブロック
• お客様の声ブロック
• ソーシャルリンクブロック

私はすっきりとした整頓されたインターフェースが好きですが、いくつかのバグに気づきました（私が使用していたバージョンでは）：

• グーテンベルク内からパーマリンクを編集するのは困難でした
• 箇条書きはそれ自体のブロック内に配置する必要があります。そうしないと、ブロック内のテキスト全体が箇条書きになります。

ここで、グーテンベルクは十分にレビューされていないことに言及する必要があります。 公式のWordPressサイトで、グーテンベルクの編集者は1791件のレビューを受け、5つ星のうち平均2.2つ星を獲得しています。

手短に

グーテンベルクは、エレガントで整頓されたドラッグアンドドロップページビルダーです。 ただし、上記で確認したページビルダーのいずれかと競合する前に、さらに作業が必要です。 確かに、それは無料ですが、Site Origin、Elementor、およびVisualComposerはすべて完全に機能する無料バージョンを提供します。

価格設定

• 無料（WordPressに含まれています）

私が新しいWordPressページビルダーを探していたとき、これらは私が探していた重要な機能でした：

• 使いやすいインターフェース
• 真のフロントエンド編集（つまり、ページを編集するとすぐに変更が表示されます）
• モバイルデバイスで完全に応答
• 任意のWordPressテーマで動作します
• すべてのデフォルトのWordPressウィジェットをサポートします
• カスタマイズされた要素とレイアウトを保存して再利用できるようにするテンプレートシステム
• 以前のバージョンにすばやく戻すことができる改訂履歴
• 目次モジュール
• カスタムCSSをサポート
• クリーンなコードを残す

ElementorとThriveArchitectは2つの最も高度なWordPressページビルダーのようで、どちらも私の最小要件のリストを満たしていました。

私は2つの理由でThriveArchitectを選ぶことになりました。

理由＃1

Thrive Architectでページを編集すると、モジュールは画面の片側にあり、各モジュールのコントロールは画面の反対側にあります。

しかし、Elementorでは、モジュールとコントロールは画面の同じ側にあります。

これは、ThriveArchitectよりもElementorで多くのクリックを行うことを意味します。 Elementorでは、段落、見出し、または画像のスタイル設定が完了したら、クリックして戻ってモジュールのメニューに移動する必要があります。

Thrive Architectでは、モジュールは画面の反対側にまだあります。

理由＃2

ほとんどのブロガーのように、私は訪問者を加入者に（そして最終的には顧客に）変えようとしています。

Thrive Architectのコンバージョンへの注力は、私にとって決定的な要因でした。 Thrive Architectには、他のWordPressページビルダーよりも多くの変換関連モジュールがあります。