ELEMENTOR-WPのページビルダープラグイン

ELEMENTORプラグイン

ELEMENTOR-便利すぎて手放せない無料ツール

ELEMENTORはワードプレスのプラグインで無料でたくさんの機能が使えるエディターツールです。

初心者には難しいCSSの書き換えや追加をすることなく、ドラッグアンドドロップでお好みにレイアウトしたり様々なパーツを配置でき、出来上がりをプレビューで確認しながらページを作成できます。

通常の投稿記事でも見出しにアクセントを加えたいときや少し画像に動きをつけたい時も役立ちますが、特にランディングページを作成するときには、外注しなくてもプロ並みのキレイなページがサクッとできてしまうのでおすすめです。

今回はELEMENTORのLP制作にフォーカスしたおすすめ機能をピックアップしてご紹介します。

ELEMENTORプラグイン

ELEMENTORプラグイン

無料で使えるWordPress-ワードプレスのエディタープラグイン。
プラグインページから検索してインストールできます。
詳しい機能や最新情報はこちら。

ELEMENTORのおすすめ機能ベスト7

ELEMENTORの最大の特徴はページのレイアウトやボックスの分割が簡単にできてしまうことです。

テーブルを作成することなく、画像や文字、アイコンの配置が簡単にできるのでCSSがわからない初心者でも苦労することがありません。

またネットショップのようなサイトを作成するときに商品の簡単な説明や画像を配置したいときも予め用意されたウェジットをドラッグアンドペーストで配置しその部分を編集するだけですので、時間をかけずにサクッとできてしまいます。

下記のような感じです。
今回は3つのボックスに分けてみました。

スイーツ

見出しタイトルをいれます

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

和スイーツ

見出しタイトルをいれます

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

cream-puffs-427181_1280

見出しタイトルをいれます

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

作成方法についてはまた詳しく解説していく予定ですが、流れは

  1. 分割するセクション数を選択する
  2. それぞれのセクションに「画像ボックス」ウェジットをドラッグアンドペーストする
  3. 画像ボックスセクションに画像をアップロードし見出しと本文の編集をする
  4. 枠線が必要な場合は線の種類や色を選んで設定する

このようになります。

予め画像や入力する内容を決めていればわずか数分で作成することができます。

LPにも色んなタイプがあり、よくファーストビューにあたるヘッダー画像が画面いっぱいに表示されるものがあるのはご存知でしょうか。

とてもダイナミックで目をひきますよね。

 

ELEMENTORを導入しておくと、投稿ページでも固定ページでもそのサイトで使用しているテーマの影響をうけないLPを作成することができます。

 

投稿画面の右メニューに投稿の属性の「テンプレート」から「ELEMENTORキャンバス」を選択しELEMENTORで編集するとそれが可能です。

 

ヘッダーをスライダーにしたり動画を背景にしたり、画像を動かしたり、色んなことができます。

サンプル画像

上記は動画+画像モーション機能を使用した例です。

サブヘッドのカスタマイズが色々できます。

LPのサブヘッドはそのページで伝えたいことをわかりやすく伝えるのにとても重要な要素です。
全体のデザインのバランスも考えながら設定しなければならないので、画像で作成してしまうと変更が難しいのですが、ELEMENTORならプレビュー画面を見ながら形や色、文字を組み合わせて作成でき、そのスタイルをコピーして他のサブヘッドに使えます。

スピーディにキレイにできるのがELEMENTORです。

見出しテキストを追加

上記は背景に画像を配置し、見出しテキストに動きをつけたサブヘッドです。

他にも色々なことができますので、また機会があれば例をあげて作成手順をご紹介していく予定です。

LP制作に欠かせないのがお客様の口コミや評価の星です。
ELEMENTORの無料ウェジットにはそんな機能も標準でついています。

下記は一例です。

 

私もおすすめします。
このコンテンツは非常に
役にたちます。
Jene Doe
Designer
おすすめ度
4/5

何かを購入、またはご登録いただくのにボタンは非常に重要です。

通常はボタン画像を用意してレイアウトして配置しますが、ELEMENTORではその場で出来上がりを確認しながらボタンを作成、デザインすることが可能です。カラー、文字のフォント・カラー・シャドウなど細かく設定することができます。

また、ボタンに動きをつけることもできます。

下記は一例です。

説明する文章が長くなると、見た目のデザインも悪くなりますし、読みづらくなったりします。
読み手が知りたい情報だけ開いてみれるようにすると、ページもスッキリしますね。

 

それを可能とするのがアコーディオン機能です。
背景色や画像も設定できます。

ページを見やすく美しく整えるためにもぜひ活用したい機能です。

アコーディオンとは下記のようなクリックで開閉するものです。

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。
吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

LPページのレイアウトが難しい場合、あらかじめレイアウトされたテンプレートやパーツがいくつかありますので、お好きなものを選択しそれを編集することで時短作成できます。

ただし、英語で作成されたものなので、日本語に直したときにイメージが変わってしまう可能性はありますが、初心者さんにはレイアウトが一番大変だと思いますので、テンプレートを使うのもいいのではないかと思います。

また、自分で完成させたLPをテンプレートとして保存しておき、同じタイプのものを次に作成するときに呼び出して編集し再利用することもできます。

ELEMENTORテンプレート

ELEMENTORはLP作成だけでなく、記事投稿事にも使えます。

私はELEMENTORの便利さを知っていますので、このプラグインなしでは投稿記事の作成も本当に面倒くさく感じてしまいます。

今までこのプラグインを知らなかった方にぜひ知ってもらいたいと思いご紹介していますが、また少しづつそれぞれの機能について図解や動画でご紹介していきたいと思っています。

また更新情報を逃さないためにもぜひ「MIRAI WEB INFO」メールマガジンにご登録くださいね。

ELEMENTORプラグイン

ELEMENTORプラグイン

無料で使えるWordPress-ワードプレスのエディタープラグイン。
プラグインページから検索してインストールできます。
詳しい機能や最新情報はこちら。

コメントを残す