WPBakery (別名 Visual Composer): ドラッグ アンド ドロップでサイトを構築
WordPress は素晴らしいもので、WordPress で実行する Web サイトをカスタマイズできるのはおまけにすぎません。ただし、私たち全員がコーディングの達人であるわけではありません。 WordPress 愛好家の中には、HTML や CSS について何も知らない人もいます。ただし、これによって WordPress テーマをカスタマイズできなくなるわけではありません。ここでページビルダーが登場します。
ドラッグ アンド ドロップ ページ ビルダーはプラグインとして広く利用でき、多くの人気のあるテーマに組み込まれています。これらにより、あらゆるレベルのユーザーがテーマの全体的なレイアウトを変更できるようになり、追加の装飾 (アイコン、スキルバー、価格表など) を非常に簡単に追加できるようになります。特に、私たちの新しいお気に入りのページ構築 WordPress プラグインである WPBakery Visual Builder を紹介したいと思います。
さらに詳しく知りたいですか? 最新の WPBakery の使い方ガイドを読んでフォローしてください。このより詳細なウォークスルーでは、この人気のあるページ ビルダーの詳細と使用例を示します。
WPベーカリーとは何ですか？ (以前の名前は Visual Composer)
WPBakery Visual Builder は、WP Bakery によって開発された素晴らしいプラグインで、ドラッグ アンド ドロップ ページ ビルダーを WordPress テーマに追加します。私たちはこれを Total MultiPurpose WordPress テーマに追加しましたが、Themeforest のほぼすべての新しいトップセラーでも見ることができます。コードを 1 行も触れることなく、複雑なページ レイアウトを作成できるようにするために必要なツールが提供されます。
WPBakery ビジュアル ビルダーの仕組みと何ができるか
これはプラグインなので、インストールして有効にするだけで、その素晴らしい機能をすべて活用できます。 WPBakery Visual Builder をアクティブにすると、ページのレイアウトを制御できるようになります。新しいページを追加するだけで、クラシック モードとビルダー モードを切り替えるための新しいボタンと、ライブ フロントエンド エディターに移動するためのボタンが表示されます。
ここからの可能性は、あなた (またはあなたのクライアント) の想像力によってのみ制限されます。 WPBakery Visual Builder のすべてのオプションを使用して、行、列、ボタン、テキスト、画像などを追加できます。さらに、レイアウトをテンプレートとして保存して何度も再利用するオプションもあります。
行
ビルダーにはページ構築要素が含まれています。これらの要素は、ページの文字通りの構成要素として使用できます。まず行を追加します。行を使用すると、ワンクリックで列を追加できます。行の左上隅にある黄色の段落タブにカーソルを置き、レイアウトを選択するだけです。選択したレイアウトに従って、行は自動的に列に分割されます。
ページ要素
次のステップでは、ページ機能の追加を開始します。 [要素の追加] ボタンをクリックするだけで、ポップアップ メニューが開きます。テキスト ボックス、見出し、ソーシャル共有、画像とギャラリー、トグルまたはタブ、アコーディオン、最近の投稿 (ブログ投稿に加えてテーマのカスタム投稿タイプでも機能します)、ボタン、さらには追加するためのオプションが多数あります。サイドバーウィジェット。
また、WPBakery Visual Builder で使用している WordPress テーマと互換性のあるプラグインに応じて、表示されるページ要素の増減が異なります。上記の例は Total Drag & Drop WordPress テーマのものであるため、Total 専用に作成およびスタイル設定された追加の 30 ページ ビルダー要素があります。これには、カスタム ディバイダー、アイコン ボックス、マイルストーン、カルーセルなどが含まれます。
任意の要素をクリックして、その要素のオプションを開きます。以下は、Total テーマの Icon Box モジュールの「オプション」の例です。ご覧のとおり、各モジュールには多くの設定を含めることができ、設定の複数のタブを含めることもできます。
このビルダーは、Layer Slider、Revolution Slider、Gravity Forms、Contact Form 7 という 4 つの素晴らしいサードパーティ プラグインもサポートしています。これらのプラグインのいずれかがインストールされている場合、テーマのページ要素が自動的に表示されます。これらのプラグインのいずれかにページ要素を挿入することを選択すると、WPBakery Visual Builder は、作成したそれぞれのスライダー/フォームのドロップダウンを表示するか、スライダー ID を追加するための入力ボックスを表示します。ショートコードをコピーして貼り付ける必要はもうありません。
ドラッグドロップ
デザイン プロセスのどの時点でも、行またはページ要素をドラッグ アンド ドロップして再配置できます。任意の行や要素を複製することもできるため、繰り返しのコンテンツをすばやく簡単に追加できます (類似の列、FAQ、切り替えなどに最適です)。
気に入ったデザインを作成したら、テンプレートとして保存できます。これは、再利用したいカスタム ページ レイアウトやサイドバーを作成するときに便利です。 [テンプレート] ボタンをクリックし、レイアウトに名前を付けて、[保存] をクリックするだけです。テンプレートを使用すると、保存したレイアウトと要素がページに自動的に入力されます。
行オプション: 行のフォーマット、複製、削除
各行の左端には 3 つの追加機能が追加されており、行全体とそのすべての内容のクローンまたは複製、新しいモジュールの追加、列の編集などに使用できます。編集する必要がある行にカーソルを合わせるだけです。これらの設定にアクセスするには:
繰り返しになりますが、使用しているテーマによっては、利用できる書式設定オプションが異なる場合があります。一部のテーマ開発者は WPBakery Visual Builder をそのままにすることを選択しますが、多くはテーマのニーズやスタイルに合わせてプラグインをカスタマイズします。
フロントエンドエディター
強力な WPBakery Visual Builder にはフロントエンド エディターが含まれるようになり、独自のページやレイアウトの構築をこれまでより簡単に開始できるようになりました。唯一の注意点は、すべてのテーマがまだフロントエンド エディターをサポートしているわけではないということです。 Visual Composer フロントエンド エディターが WordPress テーマと互換性があるかどうかを確認するには、テーマの機能リストを再確認するか、テーマ開発者に直接連絡してください。当社のTotal WordPress テーマはフロントエンド エディタと 100% 互換性があるため、現在のテーマが互換性がない場合は、当社のテーマへの「アップグレード」を検討してください。
拡張機能
最後に触れたい機能は、WPBakery Visual Builder の拡張性です。あなたが上級コーダーまたはテーマ開発者であれば、独自のショートコードをプラグインに統合できます。実際、私たちは独自の Symple Shortcodes Premium を追加して、Total ユーザーに追加のページ構築要素を提供しました。これにより、ユーザーはページを作成する際にさらに多くのオプションを得ることができます。
プログラマーではない場合は、CodeCanyon をチェックアウトし、WPBakery または Visual Composer アドオンを簡単に検索してください。 WPBakery Visual Builder に追加機能を追加する優れたプレミアム プラグインがたくさんあり、Symple Shortcodes プラグインなどの優れた無料プラグインもあります。
Visual Composer の設定オプション
私は WPBakery をページビルダーとして常に参照していますが、投稿やカスタム投稿タイプでもうまく機能します。あなたがしなければならないのは、オプションを有効にすることだけです。 [設定] > [WPBakery] に移動します。次のような画面が表示されます (注 – このプラグインは以前 Visual Composer という名前であったため、使用しているバージョンに応じてサイドバーに Visual Composer または WPBakery と表示される場合があります)。
このプラグインは、WordPress テーマに含まれるさまざまなコンテンツ タイプを自動的に表示します。 WPBakery ページビルダーで使用したいものを選択するだけです。上の例は Total テーマのものです。そのため、ポートフォリオ、スタッフ、紹介文 (すべてのカスタム投稿タイプ)、フォーラム、トピック、返信、製品 (Total でサポートされている bbPress および WooCommerce プラグインに関連する) のオプションが追加されています。 。
WordPress サイトにすでにインストールされている WPBakery Visual Builder にショートコード プラグインをマップすることもできます。設定ページで、上部の「マイショートコード」タブをクリックし、「ショートコードをマッピング」ボタンをクリックします。これにより、サードパーティのショートコードがコンポーザー要素に追加されます。簡単！
実際に見てみる
先ほども言いましたが、私たちは WPBakery Visual Builder が大好きなので、ベストセラーの Total WordPress テーマ (購入時に無料で含まれています) に組み込みました。 Total Theme のライブ デモのさまざまなページをご覧ください。ライブ デモで表示されるページのほとんどは、WPBakery Visual Builder で作成されました。背景、見出し、テキスト、画像、アイコンなどを追加します。それはすべて「簡単なこと」です。
完全な WPBakery Visual Builder 使用ガイド
すでにプラグインを所有していて、その使用方法に関するガイドをお探しの場合は、完全な WPBakery (旧 Visual Composer) 使用ガイドを参照してください。このガイドでは、ステップごとに説明し、プラグインの使用方法を示します。
どこで入手できるか
WPBakery Visual Builder (旧 Visual Composer) は、自分で入手したい場合、CodeCanyon から入手できます。また、プレミアム WordPress テーマ Total と完全に統合されています (他の 2 つのプレミアム プラグインと合わせて合計 67 ドルになります。これはテーマに支払った金額よりも高いです!)。
合計を取得 WPBAKERY ビジュアル ビルダーを取得
以下のプラグインについてのご意見をお聞かせください。私たちは WPBakery Visual Composer に非常に感銘を受けており、それについてのご意見をお待ちしています。