PageBuilder(ページビルダー)で簡単にレスポンシブレイアウトを作成

aikyacchi

WEB制作担当の多胡です。
ホームページ制作、楽しんでますか?
毎日ブログの更新や固定ページの作成、大変ですよね。

「WordPress(ワードプレス)の固定ページをもっと見やすく、且つかっこよく見せたい!!(…でも楽をしたい!)」
みなさんそうお思いでしょう。
あまり大きな声では言えませんが、何を隠そう私もです。

今日はそんなあなたにピッタリのWordPress(ワードプレス)プラグイン、Page Builderをご紹介いたします。

Page Builderとは?

固定ページや投稿ページを好きなレイアウト(カラム数)に設定できるプラグインです。
もちろんレスポンシブデザイン対応です。

「画像を3枚横に綺麗に並べたい」
「画像の隣に文字を綺麗に配置したい」

大丈夫。あなたの思いのままです。

Page Builderのインストール方法

まずはWordPress(ワードプレス)管理画面からプラグインの新規追加でPage Builderを検索します。

手順1

有効化をします。

手順2

 

これでインストール完了です。

次に「Installing Black Studio TinyMCE」というプラグインもインストールします。
最近、このプラグインを入れないとPage Builderが使えない仕様になったようです。

手順9

Page Builderの使い方

固定ページから新規作成でページを作成します。
右上のPage Builderのタブを選択します。

手順3
左上のAdd Rowを選択します。

手順4
すると…なんということでしょう。
カラム数が自由に選べるようになりました!

手順5
カラム数を選んだら、次はウィジェットを選びます。

手順6
「Visual Editor」を選びます。

手順7
Editをクリック。

手順8
普段編集されている「ビジュアル」から編集できます。
画像も挿入可能!

手順11

完成です。

公開ページで見るとこんな感じ。

手順12

今回は2カラムでしたが、3カラムや4カラム、はたまたそれ以上にも簡単にできます!
ぜひお試し下さい。