【WordPress】無料の「Elementor」を使ったオシャレなLP(ランディングページ)を作る手順【準備編】

【WordPress】無料の「Elementor」を使ったオシャレなLP(ランディングページ)を作る手順【準備編】

LPとは、広告費をかけたキャンペーン、新しい商品・サービスの訴求、アフィリエイトのペラサイトなど様々な場面で使える形式のウェブサイトページのことをいいます。

Webで集客や商品の販売をするには「非常に効果的」な方法なので、出来るだけ簡単に作る方法は覚えて損のないスキルです。

私はコードの知識はほとんどありませんが、下記のようなページを作ることが出来ました。

完成図サンプル

https://www.liberta-corp.jp/lp-sample/

今回はこのようなLPをWordPressでオシャレに作る方法についてご紹介します。

 

作りたいLPのデザインを決定する

LPのデザインは訴求したい商品、サイトの内容によってふさわしいデザインが変わります。

なぜならLP作成の目的がブランディングなのか、商品の販売なのか、メールアドレスの取得なのかによって構成が変わるからです。

例えば、美容系のサイトと投資セミナーのサイトではデザインが全く違いますよね?
サイトを作りはじめる前に、おおよその構成をつかむことが重要です。

 

ほかのサイトのデザインを真似しよう

LPをカンタンに作成するにはほかのサイトを真似するのが最も早く、効果的な方法です。

真似するサイトを選ぶ基準は

  • 商品・サービスの種類や属性が似ている
  • 目的(アドレス取得・ブランディング・販売)が同じ

この二つを前提としておくと良いですね。

 

LPのまとめサイトを利用する

LP ARCHIVE
https://rdlp.jp/lp-archive

こちらのサイトでLPのサンプルを探すことができます。

ジャンルごとに検索することも可能なので、参考にしてみてください。

 

WordPressでLPを作成する

WordPressでLPを作るには「固定ページ」を利用するか、サブディレクトリを取得して新しいテーマを入れる方法があります。

今回の例では固定ページを使い、Elemetorという無料プラグイン利用する方法でLPを作ります。

 

Elementorをダウンロード

無料ページビルダープラグインの「Elementor」をダウンロードします。

Elementor Page Builder

※WordPressの新規プラグインの項目から検索しても出てきます。

有料のプロ版はアップグレードすることで利用することが出来ますが、基本機能は無料版で全て利用することが可能です。

 

固定ページを作成する

Elementorを有効化すると、固定ページの作成の際に「Elementorで編集」というボタンがでるので、こちらをクリックします。

これでElementorを使った固定ページの作成が可能になりました。

 

Elementorの設定を変更する

歯車マークからelementorのレイアウト方法を変更することができます。

「設定⇒レイアウト⇒Elementorキャンパス」の順に選択してください。

これでWordPressテーマの影響を受けない作成が可能になります。

 

決めたLPデザイン通りにウィジットを配置する

Elementorはコードの知識が無くても「ウィジット」をドラッグ&ペーストすることでサイトのデザインが可能です。

操作方法についてはこちらの記事でも詳しくまとめています。

コード知識0でプロ並みのサイトに!Elementorのおすすめの使い方【WordPress】

 

LP制作はトライアル&エラーが大切

今回紹介したLPの制作手順をまとめると

  1. 真似するLPサイトを見つける
  2. 固定ページでElementorを有効化する
  3. Elementorを使ってデザイン通りにウィジットを配置する

このような流れです。

これだけ条件が揃えば、あとは実践から少しずつ制作に慣れていけばよいでしょう。
次回は「実践編」として、LPの実際の制作過程をご紹介します。