Beaver Builder WordPressプラグインガイドとレビュー

ページビルダーは、しばらくの間、WordPressコミュニティの話題になっています。これらのツールは長い間人気がありましたが、新しいブロックエディターの導入により、多くの人はそれらがいかに関連性があるか疑問に思っています.


ブロックエディタは興味深い新機能ですが、カスタムページや投稿のデザインに関しては、ページビルダープラグインに勝るものはありません。の Beaver Builder WordPressプラグイン この種類のツールが提供する利点の完璧な例です–使いやすく、驚くほど強力です.

この投稿では、ビーバービルダーを詳しく見ていきます。主な機能と価格について説明し、それが実際にどのように機能するかを示します。これがWebサイトに適切なページビルダーソリューションであるかどうかを自分で判断できます.

Beaver Build WordPressページビルダーの新しく改善されたガイドにすぐに飛び込もう!

WordPressページビルダーが必要になる理由

プラットフォームに慣れていない限り、おそらくクラシックWordPressエディターに精通しているはずです。

クラシックなWordPressエディター

これは機能的でしたが、常に最小限のシステムでした。テキスト、メディアなど、ほとんどすべてのコンテンツが1つのフィールドに追加されました。独自のレイアウトを作成し、優れた機能を追加することは可能でしたが、コーディングのノウハウや追加のプラグインが必要になることがよくありました.

しかし最近、WordPressの開発者は、Gutenbergを搭載した最新バージョンのエディターを公開しました。

WordPress Gutenbergエディター

この変化は久しぶりでしたが、特に新しいことは何もありません。ブロックエディターは、ページビルダーの合理化されたバージョンです。これは、しばらくの間WordPressユーザーに人気のあったソリューションです。.

WordPressのページビルダーはそれぞれ異なりますが、基本的なレベルでは、ほとんどすべて同じ基本的な概念に基づいています。事前に作成された要素の選択を提供し、それらの要素からコンテンツを構築できるようにします。目標は、デザインやコーディングの経験がない場合でも、独自のレイアウトと機能を備えたコンテンツを簡単かつ直感的に構築できるようにすることです.

ただし、ブロックエディタは非常に限定的な機能であることは注目に値します。投稿とページをより視覚的にデザインできますが、ブロックの小さなライブラリが提供され、複雑なレイアウトはほとんどサポートされません。これが、他のページビルダーオプション(この投稿の残りの部分で説明するプラグインなど)を検討する価値がある理由です。.

ビーバービルダーの基本

ワードプレス用ビーバービルダー

情報とダウンロードデモを見る

Beaver Builderは、最も人気のあるページビルダープラグインの1つであり、それには正当な理由があります。初心者でも簡単にピックアップできますが、さまざまなオプションが用意されています。基本的には、他のページビルダーと同様に、投稿とページを作成するためのドラッグアンドドロップシステムです。ただし、多くの追加機能も提供します.

このプラグインの主な機能の一部は次のとおりです。

  • 基本的なオプション(テキストや画像モジュールなど)からより高度な機能(行動を促すフレーズ、マップ、ギャラリーモジュールなど)までのコンテンツ「モジュール」の大規模なライブラリ.
  • ページ、投稿、カスタム投稿タイプを視覚的に構築し、変更をすぐに確認できるカスタム編集インターフェイス.
  • 複雑な複数列のレイアウトを作成し、サイズ、間隔などを調整する機能.
  • 必要に応じて変更できる設計プロセスを開始するための事前構築されたセクションとページテンプレート.
  • 後で使用するために独自のテンプレートを作成して保存するオプション.
  • より高度なユーザー向けに、カスタムHTMLおよび独自のCSSクラスを追加するためのオプション.

もちろん、この機能はすべてコストがかかります。ある間 ビーバービルダーライト 無料で利用可能なバージョン、それはいくつかの基本的なモジュールのみを提供し、含まれていません 多くのコア機能 テンプレートやインポート/エクスポートオプションなど。ただし、ライトバージョンは、このページビルダーにテスト実行を提供し、それがどのように機能するかを確認するのに役立ちます。.

Beaver Builderを本格的に使用する予定の場合は、プレミアムライセンスを取得して完全なパッケージにアクセスすることをお勧めします。これらは無制限のWebサイトでの使用が99ドルから始まり、1年間のサポートが受けられます。

ビーバービルダー価格

この特定のツール する 先行投資が必要です。ただし、初期費用は時間を節約し、長期的にはより効果的なウェブサイトで支払うことができるため、予算内であれば問題ありません。.

ビーバービルダーを使い始める方法

ウェブサイト用の新しいプラグインを入手するかどうかについて垣間見るときは、できる限りのことを学ぶことが最善です。ページビルダーに関しては、これには、それらがどのように見えるか、どのように機能するか、およびどのオプションが提供されるかが含まれます.

これを念頭に置いて、Beaver Builderをピックアップして、投稿とページの作成にそれを使い始める方法を見ていきましょう。当然、最初に行う必要があるのは、プラグインをインストールしてアクティブ化することです.

さらに、プレミアムバージョン(このチュートリアルで使用します)を購入した場合は、ライセンスキーをアクティブ化する必要があります。その後、あなたは仕事に権利を得ることができます.

ステップ1:Beaver Builder Editorにアクセスする

プラグインをインストールすると、ダッシュボードに新しいBeaver Builderタブが表示されます。これは、カスタムコンテンツが保存される場所です。たとえば、独自のテンプレートを作成した場合などです。.

次のようにして、ページビルダーでコンテンツを作成することもできます ビーバービルダー>新規追加. または、単に ページ>新規追加 (または、投稿とカスタム投稿タイプの同等物)。新しいオプションが表示されます。

ビーバービルダーを起動する

つまり、デフォルトのWordPressエディターまたはページビルダーでコンテンツを作成できます。ヒットしましょう Beaver Builderを起動します ボタン:

ビーバービルダーページエディター

ご覧のとおり、まったく新しいインターフェースに移動します。ここでは、コンテンツを作成して、ページ上でどのように表示されるかを正確に確認できます.

ステップ2:開始テンプレートを選択する

テンプレートを使用したくない場合は、使用する必要がないことに注意してください。好きなモジュールを追加することで、ページと投稿を完全にゼロから構築できます。学習する最も簡単な方法は、テンプレートから始めることですが、これはここで説明します。.

エディターの右側のメニューで、 テンプレート 上部のタブをクリックすると、たくさんのオプションが表示されます。テンプレートをクリックするか、ページにドラッグするだけで、フルバージョンが表示されます。

ビーバービルダーテンプレート

これにより、プレースホルダーのテキストと画像とともに、開始レイアウトが提供されます。幸いなことに、ここのすべての要素は自由に置き換えて変更できるため、Webサイトに固有の何かを作成できます.

ステップ3:個々のモジュールを編集する

ビーバービルダーエディターの各要素は、自己完結型のモジュールです。意味を確認するには、開始テンプレートのテキスト、画像、または機能にカーソルを合わせます。青色で囲まれたモジュールが表示され、クリックすると新しいメニューが表示されます。

Beaver Builderモジュールの設定

これは、そのモジュールの設定ボックスです。選択したコンテンツのすべてのカスタマイズオプションが含まれています。したがって、含まれる内容は、使用しているコンテンツのタイプによって異なります.

たとえば、 写真 モジュールを使用すると、使用するファイルを変更したり、キャプションやリンクを追加したりできます。に切り替えることもできます スタイル タブを使用して、画像の配置、境界線などを変更します。

ビーバービルダーのスタイル設定

ほとんどのモジュールには、 上級 タブでは、マージンを調整したり、特定のタイプのデバイスでのみ表示したり、カスタムHTMLを追加したりできます。

ビーバービルダーの詳細設定

ご覧のとおり、Beaver Builderモジュールのカスタマイズは簡単です。各タイプのモジュールが提供するオプションに慣れるには少し経験が必要ですが、一度習得すれば、すぐに自分のコンテンツを追加できるようになります。.

ステップ4:コンテンツの構成とレイアウトをカスタマイズする

個々のモジュールに変更を加えるだけでなく、ページ全体をカスタマイズすることもできます。これを行う方法の1つは、モジュールを追加および削除することです。モジュールを追加するには、エディターのメインメニューからモジュールを選択し、ページ上の所定の場所にドラッグします。

Beaver Builder連絡フォームモジュール

一方、モジュールを削除するには、 バツ それらにカーソルを合わせると表示されます。モジュールを上下または左右にドラッグして、自由に再配置することもできます.

また、ページの全体的なレイアウトを変更することもできます。この動作の例を確認するには、モジュールにカーソルを合わせて、 列の編集>列の設定

ビーバービルダーの列

ここでは、特定の列のすべてのモジュールに関連するオプションを見つけることができます。たとえば、列の背景色と間隔を変更したり、境界線を追加したりできます.

ページの背景にカーソルを合わせて、 行の設定 右上隅に:

ビーバービルダー行

同様のメニューが表示されますが、今回はオプションがモジュールの関連する行に適用されます。行を固定幅または全幅に設定したり、色をカスタマイズしたり、列で利用できるのと同じ変更の多くを行うことができます.

最後に、エディタのメインメニューを再度選択して、 タブ:

Beaver Builderの列オプション

ここにページに新しい行と列を追加して、レイアウトを劇的に変更できます。また、ページや投稿を最初から作成する場合は、ここが最初に行きたい場所です。最初にコンテンツのレイアウトを決定してから、モジュールを好きな場所に追加できます.

ステップ5:ページビルダーの機能セットを拡張する(オプション)

あることに注意する価値があります 他の多くの機能とオプション ビーバービルダーでは、ここでは表面をなぞっただけです。ただし、開始するために理解する必要がある主要な機能については説明しました。その後、実践的なアプローチは、ロープを学ぶための最良の方法です.

ただし、最後に、この特定のページビルダーをさらに活用するにはいくつかの方法があることを指摘しておく必要があります。まず、オフィシャル ビーバービルダーのテーマ, 上位2つのライセンスレベルで無料で入手できます。

Beaver Builder Frameworkテーマ

Beaver Builderは、好きなテーマで使用できます。ただし、これはゼロから構築され、ページビルダーと一緒に機能します。それはあなたがウェブサイトの多くの異なるタイプとスタイルに形を作ることができる基本的なフレームワークを提供します.

オプションのアドオン、Beaver Themerもあります。

ビーバーテマーアドオン

この追加のプラグインを使用すると、サイトのヘッダーとフッター、アーカイブページ、404ページと検索ページなどでBeaver Builderのドラッグアンドドロップページビルダーを使用することもできます。これにより、同じシステムを使用してほぼすべてのWebサイトを設計できます。.

147ドルですべての予算に収まるとは限りませんが、収益化する予定のウェブサイトや、複数のサイトで作業する開発者やデザイナーにとっては便利な追加です。.


あなたのウェブサイトにページビルダーを選択することは大きなコミットメントです。コンテンツの作成方法と設計方法を変更すると互換性の問題が発生する可能性があるため、長期的に使用しても問題ないことがわかっているツールから始めるのが最善です。.

幸いにも, ビーバービルダー 初心者と上級ユーザーの両方にとって確かなオプションです。さらに、上記のように簡単に始めることができます.

ビーバービルダーを使用したことがありますか?以下のコメントセクションで私たちと共有してください!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me