こんにちは！ともこです！
今回はLP（ランディングページ）をおしゃれに簡単に作る方法をご紹介します！
使うのはプラグイン「Elementor page builder」
こちらをインストール、有効化することで、
おしゃれなテンプレや設定が簡単にできるようになります！
使い方はごく簡単で、
固定ページ、投稿ページ内の「Elementorで編集」ボタンを押して、
Elementor編集ページのテンプレートを使うだけ！
こんな感じのページが簡単に作れちゃいます！
それでは詳しい使い方をご説明していきます！
LPをおしゃれに簡単に作るプラグイン「Elementor」を解説！
訪問者のアクションを誘導することに特化したページ（広告や登録ページ）の事です。
こんな感じのページですね！
https://tmk0no0.biz/mailmagazine/
このページも「Elementor」を使って作成しています。
早速作り方を説明していきます！
「Elementor」インストール・有効化・設定
まずはプラグイン「Elementor」をインストールしましょう！
プラグイン→新規追加→「Elementor」を検索。
表示されたらインストールして有効化します。
ダッシュボードに「Elementor」の表示が出てきますので、設定をしていきます。
私がしている設定は次の通り。
| 投稿タイプ | ・投稿 ・固定ページ ・CTA 全てにチェック |
|---|---|
| デフォルトカラーを無効化 | チェックを外す |
| デフォルトフォントを無効化 | チェックを入れる。 |
投稿タイプは必要なところをチェックしましょう。
私の場合は全部にチェックを入れていますが、
投稿に関してはあまり使っていませんので外しても大丈夫です。
カラーの無効化はサイトのカラーやイメージをそのまま使いため、無効化していません（チェックを外します）
フォントの無効化は「Elementor」で選べるフォントを使いたいため、無効化しています。（チェックを入れています）
固定ページを「Elementor」で編集
固定ページの新規追加をします。
まずは通常のページで
- タイトル
- パーマリンク
- アイキャッチ画像（サムネイル）
これらを設定し、下書き保存します。
後からも変えられますが、ここで設定した方が分かりやすいかと思います。
できたらタイトル欄下の「Elementorで編集」をクリックします。
するとElementorの編集画面に変わります。
右側にアイテム、左側に編集するページが表示されます。
ページレイアウトの1カラム表示
ランディングページの場合サイトのヘッダーやフッターを表示させず、1カラムで表示させることが多いと思います。
ページレイアウトで好みのレイアウトに変更しましょう。
①まずは画面左下の歯車のマークをクリックします。
②メニュー下の「ページレイアウト」からレイアウトを選択します。
選択できるレイアウトは
- デフォルト（通常の投稿画面）
- Elementorキャンパス（ヘッダー、フッターなし）
- Elementor全幅（ヘッダー、フッター、Elementor）
- テーマ対応のレイアウト
WPテーマをJINにしているためそのレイアウトも表示されていますが、
使っているテーマのレイアウトをご確認ください。
Elementorのテンプレートを使う
レイアウトを設定できたら今度は内容を決めていきます。
初めのうちは何がなんだか・・・という方は最初はテンプレートを使いましょう！
簡単ですが動画でご説明していきます。
- 新規セクション（点線の囲い）の中のファイルマークをクリックします。
- ライブラリの中から好きなテンプレートを選択します。
- デザインの内容を確認したら、挿入をクリックします。
- ページ内に表示されたら完了です。
無料版の場合、「PRO」と書かれたテンプレートは使えません。
使いたい場合は有料版にアップデートする必要があります。
そして内容をそれぞれクリックして編集していきます。
右側のメニュー部分で内容の編集ができます。
WPの記事作成とほぼ変わりませんので、すぐに使えると思います。
これをお好みで編集するだけで簡単にLPページが作成できます！
エレメント・セクション・カラムなど、
詳しい設置方法についてはこちらの記事で説明しています。
最後に
今回はランディングページをおしゃれに簡単に作る方法をご紹介してきました！
- プラグイン「Elementor」を使う
- 固定ページで「Elementorで編集」ボタンを押す
- 初めはテンプレートをフル活用する。
使っていくうちにだんだんわかってくると思います！
習うより慣れろ！です！
構成の詳しい説明はこちらの記事で説明しています。
https://tmk0no0.biz/tool/elementorsectioncolumn/
「WPでLP(ランディングページ)をおしゃれに簡単に作るプラグイン「Elementor」を解説！」はここまで！
最後まで読んでいただきありがとうございました！
