WordPressプラグインであるBeaver Builder(ビーバービルダー)は難しいコードや知識を必要とせず
ドラッグアンドドロップで直感的にサイト制作を行うことが出来ます。

とはいえ、操作方法にはある程度の知識が必要となります。

今回はその操作方法について分かりやすく解説していきたいと思います。

※本記事は操作方法についての説明となっております。
 Beaver Builder導入についてはこちらの記事よりご参照ください。


固定ページをビーバービルダーで開いてみましょう

1.実際に、固定ページをビーバービルダーで開いてみましょう。

 WordPress管理画面より固定ページをクリックすると画像のようにページ一覧が表示されます。
 すでにページが存在する様でしたら編集のリンクを、新しく一から作成する場合は新規追加の
 ボタン
をクリックしてください。

※本記事は既に作成したページを開くので、見た目が変わりますが、
 操作に変わりはありませんので引き続き続けてください。


2.編集のリンクをクリック後、画像の様な編集画面になるかと思います。

 この様な画面になりましたら、「Launch Beaver Builder」ボタンをクリックしてください。



3.「Launch Beaver Builder」ボタンをクリック後、画像のようにページが開かれたようでしたら
 編集可能状態となります。

ビーバービルダーの基本操作

編集ページが開いている状態で画像のようにクリックするとサイトを制作するために必要な
ウィンドウが開かれます。

制作に必要な項目が主に「モジュール」「列」となりますので、簡潔にご説明致します。



【モジュール】
サイトを構築するために必要な部品となります。
テキストモジュールを活用することで、文字を入力出来たり、画像モジュールで画像をページに差し込むことが
出来るなど出来ることは様々です。



【列】
サイトのレイアウト決めるために活用します。
例えばカラムを使用することでコンテンツを複数の列に分割することができます。
これにより、ページのレイアウトを調整し、読みやすさを向上させることができます。



【操作方法について】

このようにドラックアンドドロップでパーツを設置してテキストを入力したり、画像を入れ込んだりして
サイトを構築していきます。



【編集画面の保存と取り消し】

一通りサイト作成が完了した場合や途中経過を保存したい、また、今までの作成を
取り止めたい場合などについて説明します。

まずは、画面右上の「終了」ボタンをクリックします。
そこから4つのボタンがあることかと思いますので1つずつ説明したいと思います。

【Discard】
クリックすることでこれまでの編集を保存せずにサイトの画面に戻ります。
【下書きを保存】
クリックすることでこれまでの編集を一時的に保存します、サイトを公開させることは出来ません。
【Publish】
クリックすることでこれまでの編集を保存して、サイトを公開させることが出来ます。
【キャンセル】
クリックすることで元の編集画面に戻ります

今回は「下書きを保存」ボタンをクリックしてサイトを一時的に保存します。



【サイト表示画面から編集画面に戻る】

「下書きを保存」をクリックすることで編集画面を終了してサイトが表示されます。

この状態からもう一度、編集画面に戻る場合は画像のように画面上部のメニューより
「Beaver Builder」をクリックします。

まとめ

ビーバービルダーについて基本の操作をこのコラムでは説明してきました。

次回コラムにてビーバービルダーを使用したテキストの編集方法について解説していきます。