WordPressで人気No.1のページビルダーはこれ!「Elementor」の使い方

ヨッチヨッチ

こんにちは。代表のヨッチです。
ミライヨッチにお越しいただき、ありがとうございます。

あなたは、Elementor(エレメンター)というページビルダーを知っていますか?
WordPressのページビルダーの中でも、圧倒的No.1の人気があるプラグインです。

しかも、無料版が用意されていて、基本的な機能はすべて使うことができます。
ソースコードを見ることなく、だれでも簡単にページを作れるのが特徴です。

この記事では、Elementorのインストールから使い方までわかりやすく紹介します。
ページの作り方も説明しているので、完成までの流れをイメージしやすくなっています。

というわけで、さっそく無料版のElementorを試していきましょう!

記事の内容を動画でまとめました!

ヨッチヨッチ

記事について、動画ですべてお話ししています。
補足も交えて解説しているので、気になる方はこちらもどうぞ。

Elementorのインストール

まずはWordPressにプラグインをインストールしていきましょう。
「プラグイン」→「新規追加」→「Elementor」で検索すると出てきます。

Elementor

Elementorをインストールして有効化すると、ようこそ画面が表示されます。

ようこそ画面

この画面は閉じてもいいし、「最初のページを作成」をクリックしてもOKです。

「最初のページを作成」をクリックすると、すぐに編集を開始できます。

Elementorの編集画面

ここから、もっと詳しい使い方について解説していきます。

Elementorの使い方

エレメンターは、投稿・固定ページのどちらでも使うことができます。

記事を新規作成してから、画面の上にある「Elementorで編集」をクリックしてみましょう。

「Elementorで編集」をクリック

これで、エレメンターの編集画面が表示されます。

Elementorの編集画面

ここからは、エレメンターで実際にブログ記事を書く方法をお伝えしていきます!

エレメンターでブログ記事を書く方法【3ステップ】

エレメンターは、すごく直感的に使うことができるページビルダーです。

ブログの記事であれば、たったの3ステップで作ることができます。
もちろん、ソースコードはまったく見なくてOKです。

  1. 見出しウィジェットを追加
  2. 画像ウィジェットを追加
  3. テキストエディターを追加

それでは、この3つの手順でサクッとブログ記事を書いてみましょう。

【1】見出しウィジェットを追加

まずは見出しウィジェットを追加します。

左側の「見出し」から、ウィジェットをドラッグ&ドロップしましょう。

「見出し」からウィジェットをドラッグ&ドロップ

見出しが追加されたので、タイトルをそのまま書きます。

タイトルをそのまま書く

スタイルも変更できますが、今回はデフォルトのデザインで進めていきます。

【2】画像ウィジェットを追加

次に画像ウィジェットを追加します。

まずは、右上の四角アイコンをクリックしてウィジェット画面に戻りましょう。

四角アイコンをクリック

ウィジェット一覧で、左側の「画像」ウィジェットをドラッグ&ドロップします。

「画像」ウィジェットをドラッグ&ドロップ

「画像の選択」から、画像をアップロード・選択しましょう。

「画像の選択」から画像をアップロード・選択する

通常のエディターと同じように、画像を選択して「メディアを挿入」でOKです。

画像を選択して「メディアを挿入」

これで画像が挿入されました!

画像が挿入された

サイズや配置も変更できますが、今回はこのまま進めていきます。

【3】テキストエディターを追加

最後に、テキストエディターで文章を書いていきましょう。

右上の四角アイコンをクリックして、ウィジェット画面に戻ります。

四角アイコンをクリック

左側の「テキストエディター」ウィジェットをドラッグ&ドロップします。

「テキストエディター」ウィジェットをドラッグ&ドロップ

テキストエディターが設置されるので、「ビジュアル・テキスト」エディタで編集します。

ここでは、直感的でわかりやすい「ビジュアル」で文字を入力しています。

「ビジュアル」で文字を入力

これで文章も入力できました。

文章も入力できた

ブログ記事であれば、この繰り返しで1つの記事を書きあげることが可能です。
コードをまったく見なくても、だれでも簡単に記事が書けますね!

ひととおり編集できたら、「下書きを保存」「公開」のどちらかを選んでクリックしましょう。

「下書きを保存」「公開」のどちらかを選んでクリック

下書き状態であれば、まだ公開はされていません。
また後から、続きを編集できます。

公開をクリックすると、あなたのサイト上に記事が公開されます。

WordPressのダッシュボードに戻る

下書き・公開ができたら、ダッシュボードに戻りましょう。

左上の三本線アイコンをクリックします。

三本線アイコンをクリック

メニューが表示されるので、「ダッシュボードに戻る」をクリックしましょう。

「ダッシュボードに戻る」をクリック

これでダッシュボードに戻ることができました。

ダッシュボードに戻ることができた

ここまで、エレメンターで記事を編集する方法をお伝えしました。

エレメンターは、記事・固定ページのどちらでも使うことができます。
かなり便利なページビルダーなので、いろいろ試してみるのが良いと思います。

初心者が最初に知っておくべき機能まとめ

ここまで、エレメンターを使って記事を編集する方法をお伝えしてきました。

ただ、このプラグインは非常に多機能で、ほかにもできることはたくさんあります。
プロのWebデザイナーも使用するページビルダーなので、すべてマスターするのはちょっと大変ですよね。

そこで、初心者向けの機能に絞り込んで、関連記事をまとめました!
最初に知っておくことで、より便利にエレメンターを使うことができますよ。

ページビルダーでできること

セクション・カラム・ウィジェットの役割について

ウィジェットの基本的な使い方

スマホ・タブレットのデザイン編集(レスポンシブ対応)

公式テンプレートを挿入する方法

SEOの強化

一緒に使いたいプラグインまとめ

おすすめの無料テーマまとめ

【まとめ】Elementorは優秀なページビルダープラグイン

WordPressのプラグインの中でも、Elementorはかなり優秀です。
ページビルダーの中でいえば、圧倒的な差をつけてNo.1の人気があります。

実際に使ってみても、直感的ですごくわかりやすいです。
ブログ記事はもちろん、ハイクオリティなページも簡単に作ることができます。

たとえば、僕は以下のページをエレメンターで作成しました。

Web集客の基礎について、無料の動画+PDFを配布しているページです。
デザイン性の高いコンテンツを、あっという間に完成させることができました。

WPクエストでは、エレメンターのこともより深く解説していきます。
なので、WordPressに興味があれば気軽に覗いてみてはどうでしょうか?

「WordPress × Elementor」の可能性は無限大です。
その感覚を、あなたにも感じてもらえたら嬉しいです。