WordPressのLPの作成方法は3つ!おすすめのテーマやプラグインもご紹介! | Coneのコンテンツ制作所

WordPressのLPの作成方法は3つ!おすすめのテーマやプラグインもご紹介!

Coneの中の人

WordPressでLP(ランディングページ)を作りたいけど、

  • WordPressでLPは作れるの?
  • 自作する方法は?
  • おすすめテーマやプラグインは?

こんな悩みを抱えていませんか?

今回は、WordPressでLPを作る方法やおすすめのテーマやプラグインについて解説していきますので、自作したい方はぜひ参考にしてください。

WordPressでLPは作れる?メリットは?

結論、WordPressでLP(ランディングページ)は作れます。

WordPressの場合は、基本的にテーマやプラグインを使って作成することが多いです。

主なメリットは以下になります。順番に解説していきます。

  • HTML/CSS知識無しでも作成可
  • コストを抑えて制作可能
  • 同一ドメインで管理可能

HTML/CSS知識無しでも作成可能

WordPressには、テキストや画像などのコンテンツをブロックとして操作できる「ブロックエディタ」が備わっています。

この機能を使うことで、HTMLやCSSの知識が無くても、直感的な操作であらゆるページをノーコードで作れるようになっています。

ただし、デフォルトのままだと少し弱いです。基本的にはLP向けのテーマやプラグインで機能を強化することで、高品質なページを制作できるようになります。

コストを抑えて制作可能

WordPressテーマやプラグインは、利用にかかる費用をコストをかなり抑えることができます。

実際に外注費用と比較すると以下になります。

制作会社に外注10〜30万円程度
有料テーマ or プラグイン1〜5万円程度

有料テーマ・プラグインの場合、要件定義やデザイン設計、実装作業など、制作に必要な作業を済ませた状態で販売しているので、ここまで費用を抑えることができるんですよね。

また、お問い合わせフォームなどもプラグインで無料で実装できるので、コストを抑えたい方には非常におすすめです。

同一ドメインで管理可能

WordPressには、独立したページを作成できる「固定ページ」と呼ばれる機能が備わっています。

この固定ページでLPを作成すれば、既存サイトの下層ページにLPを用意できるので、新たにサブドメインやサブディレクトリを用意する手間が省けます。

例)サービスAをexample.comで運用している場合
サービスAのLPタイプ1を以下に用意
example.com/lp1
サービスAのLPタイプ2を以下に用意
example.com/lp2

固定ページを作成する時に、スラッグを指定すれば上記のようなURLを簡単に指定できます。WordPressの管理画面1つに対して、複数のLPを管理できるのも魅力的です。

WordPressでLPを作る時の注意点

低コストでサクッと作れるメリットはある反面、以下の注意点があります。

  • 自由度はやや制限される
  • 更新作業・メンテナンスが必要
  • 表示速度が遅くなる可能性

自由度はやや制限される

テーマやプラグインを利用する場合、あらかじめ用意されたデザインやレイアウトの枠組みの中で作る必要があるため、どうしても自由度は制限されます。

例えば、「このコンテンツをここに配置したい」「この余白をもっと調整したい」など、細部にこだわりたい場合は、備わっている機能だけでは対応できない可能性があります。

基本的なレイアウトは変更できますが、もし細かい部分まで理想通りに仕上げたい場合は、CSSの追加やPHPファイルの編集で対応する必要があります。

更新作業・メンテナンスが必要

WordPressは「作ったら終わり」ではなく、継続的な管理が必要な点も覚えておきましょう。

テーマやプラグイン、WordPress本体は、定期的にアップデートが配布されます。これらを放置するとセキュリティリスクが高まったり、表示崩れやフォームの不具合が発生することがあるので、定期的なメンテナンスが必要になります。

ただし、管理画面からボタンを押したり、ファイルをアップロードするなどの操作でアップデートできるので、そこまで難しくはありません。

制作会社にメンテナンスを依頼することもできますが、月額数万円の費用が発生するので、コストを抑えたい場合は自分で管理した方が良いでしょう。

表示速度が遅くなる可能性

WordPressのLPは便利な反面、ページの読み込みが遅くなるリスクがあります。

特に汎用的なテーマや多機能なプラグインを使うと、LPには不要なCSSやJavaScriptまで読み込まれてしまうので、結果として表示速度が落ちやすくなります。

ただし、最近のテーマは、ある程度高速化対応が進んでいるので、そこまでの悪影響はありません。

HTMLやCSS、JavaScriptだけで書かれたようなLPよりも表示速度は遅くなるが、ユーザビリティが悪化するようなレベルではない、くらいに思っておいてください。

WordPressでLPを作る方法は3つ

WordPressでLPを作成する方法は、以下の3種類が一般的です。

テーマのLP作成機能を利用LP作成機能が備わったテーマを使う方法
テーマの機能で作れるので初心者でも簡単
サクッとLPを作って公開したい人向け
プラグインを利用ページビルダー(作成ツール)系プラグインを使う方法
豊富なパーツを使って直感的にページを制作可能
ノーコードツール感覚でLPを作りたい人向け
自作テンプレートで対応固定ページテンプレートを自作してコーディングする方法
ページ自体はHTML/CSSで作成
HTML/CSSでページを制作できる人向け

WordPressテーマのLP作成機能を利用する方法(おすすめテーマ4つ)

テーマの機能でLPを制作する方法は主に以下の2つです。どちらも備わっているテーマもあります。

LP制作機能を利用固定ページでLPを作成できる機能を使う方法
1つのテーマで複数のLPを制作可能
LP型サイトのトップページを利用トップページをそのままLPとして利用する方法
1テーマ = 1LPとなることが多い

以下におすすめのテーマをご紹介します。

  • SWELL
  • TCDシリーズ
  • Snow Monkey
  • OLTANA「No.006」

SWELL

引用:SWELL

「SWELL」にはランディングページ向けの「LP機能」が備わっています。

具体的には、以下のような「投稿」や「固定ページ」を同じようにページを作成できる機能になっており、各ページ毎にコンテンツの最大幅やアイキャッチ画像は表示するかどうかなど、細かく設定することができます。

引用:SWELLのLP機能

また、子テーマのルートに「lp」というディレクトリを作成し、そこにLPのスラッグ名を用いた.htmlファイルもしくは.phpファイルを配置しておくと、そのファイルを読み込める仕様になっています。

HTMLとCSSが得意な方は、この仕様を使って自由にコーディングしたページを作ることも可能です。

LP作成機能
LP専用のページ作成機能あり
LP型サイト
トップページをLP仕様にすることも可
料金買い切り型
¥17,600
ライセンス100%GPL(使い回し制限無し)
サポートフォーラム
マニュアル

TCDシリーズ

出典:TCD

80種類以上の様々な用途のサイトを作れるテーマ「TCD」には、固定ページでLPを制作できるカスタムテンプレートが用意されています。

固定ページで専用のテンプレートを選択すると、LP向けの仕様になり、様々な設定が利用できるようになります。

出典:ランディングページ(LP)を作成する方法

これによって、ヘッダーやフッターの非表示、コンテンツの横幅など、細かいところまでこだわれる仕様になっています。

また、LP型サイトを作れるテーマもありますので、そちらを購入するという選択肢もありです。

LP作成機能
LP専用のカスタムテンプレートあり
※テーマによって仕様が異なるため要問合せ
LP型サイト
トップページをLP仕様にできるテーマあり
※テーマによって仕様が異なるため要問合せ
料金買い切り型
1〜5万円程度
※金額はテーマによって異なる
ライセンススプリットライセンス
自社サイトのみ使い回しOK
第三者サイトの制作には別途料金が発生
サポートメールサポート
マニュアル

Snow Monkey

出典:Snow Monkey

「Snow Monkey」は、決められたデザインのテンプレートというより、ブロックエディタを使って自由にレイアウトを作成したい方のWordPressテーマです。

このテーマには、「Snow Monkey Blocks」や「Snow Monkey Editor」など、ブロックエディタを大幅に拡張する機能が備わっているので、これらを使ってLPを作成できます。

また、有料ではありますが、LPサイトを作るのに最適なパターンが18種類詰め込んだパターン集も販売されていますので、こちらも合わせて利用していると良いかもしれません。

出典:LP(ランディングページ)向けパターン集
LP作成機能
LP専用のカスタムテンプレートあり
LP型サイト
トップページをLP仕様にすることも可
料金サブスク型(年払い)
スタンダード:¥16,500
プロ:¥55,000
ライセンス100%GPL(使い回し制限無し)
サポートフォーラム
マニュアル

OLTANA「No.006」

出典:No.006(ナンバーシックス)

様々なテーマを販売している「OLTANA」のLP(ランディングページ)向けテーマ「No.006」です。

このテーマは、固定ページでLPを作成するのではなく、トップページをLP仕様にしたテーマとなっているため、1テーマ = 1LPのような使い方のようです。

また、そのトップページは以下のようにカスタマイザーで設定していくので、初心者でも簡単にLPを作成することが可能です。

「No.006」の操作画面(カスタマイザー)

見本となるデモサイトも7種類用意されているので、お好みのサンプルをインポートすると、より簡単につくれるのでおすすめです。

LP作成機能
LP型サイト
トップページがLP仕様
料金買い切り型
19,800円(税込)
ライセンスクライアントワーク利用時は1サイトにつき1テーマ
サポートマニュアル
メールサポート

ページビルダー系プラグインを利用する方法

WordPressはブロックエディタでページを作るのが一般的ですが、これとは別に独自のエディタ(ページビルダー)を提供しているプラグインがあります。

このエディタは、ブロックエディタよりも直感的なドラッグ&ドロップの操作 でページをデザインできるため、こちらを使ってLPを制作する方もいます。

世界的に最も有名なのは「Elementor」というプラグインで、以下のエディタで作成できます。

Elementorの操作画面

Studioのようなノーコードツールの画面に似ていますね。これWordPressか?と思うくらい面影がありません。

制限はありますが、無料版でもそこそこ使えます。Pro板にすると、より高機能なパーツやテンプレートを利用できますが、年間で60ドル(日本円で9000円程度)かかります。

まずは、無料版を触ってみて、操作感を確かめるとよいかもしれません。

ただし、Elementorはテーマの影響を受けるので、スタイルが干渉して、デザインが崩れる可能性があります。その点はご注意ください。

固定ページテンプレートで自作する方法

HTMLとCSSができる方は、独自の固定ページテンプレートを用意することで、自由なデザインのページを作成することも可能です。

今回は、固定ページのエディタにHTMLやCSSを記載して、LPを作成できるカスタムテンプレートを2種類用意しました。

おそらくどのテーマでも使えますので、テーマ内に新たにPHPファイルを作成し、以下のコードをコピペしてみてください。(PHPファイルは「index.php」と同じディレクトリに設置してください。)

  • テーマのヘッダー・フッター利用タイプ
  • フルスクラッチタイプ

テーマのヘッダー・フッター利用タイプ

テーマで使われているヘッダーとフッターをそのまま利用して、メインエリアのみ自由にマークアップする方法になります。

ただし、テーマによっては、ヘッダーやフッターの読み込み方に差があるので、デザインが崩れる可能性は高いです。

まずは、「pagg-lp-main.php」という名前のファイルを作成し、以下の内容をコピペしてください。(必要に応じてカスタマイズしても構いません。)

<?php
/*
Template Name: LP(ヘッダー・フッター利用)
*/

// ヘッダーの読み込み
get_header();

?>
<main class="lp-main">
  <?php
    while (have_posts()) : the_post();
      // エディタの内容がここに表示される
      the_content();
    endwhile;
  ?>
</main>
<?php

// フッターの読み込み
get_footer();

このファイルをテーマのルートディレクトリに設置すると、固定ページのテンプレート選択のドロップダウンに「LP(ヘッダー・フッター利用)」が表示されるようになります。

こちらを選択して保存し、エディタの内容がそのまま表示されるかお試しください。(うまくいけば、ヘッダーバーとフッターエリアとエディタに入力しいた内容が表示されるはずです。)

フルスクラッチタイプ

固定ページでテーマとは全く無関係のデザインのページを作成したい、それを実現するのにオススメなのがフルスクラッチタイプのテンプレートです。

このテンプレートは、できる限りテーマのパーツを一切読み込まないようにしているので、headやbodyからこだわりたい、テーマと干渉する可能性を下げたい方におすすめです。

HTMLとCSSで1からページを組める方であれば、PHPの知識がなくとも、エディタに書き込むだけでオリジナルのLPを作成することが可能です。

「page-lp-scratch.php」という名前のファイルを作成し、以下の内容をコピペしてください。(必要に応じてカスタマイズしても構いません。)

<?php
/*
Template Name: LP(フルスクラッチ)
*/

// 投稿データを取得
the_post();

// ページタイトル
$title = get_the_title();
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
  <meta charset="<?php bloginfo('charset'); ?>">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title><?php echo esc_html($title); ?> | <?php bloginfo('name'); ?></title>
  <?php wp_head(); ?>
</head>
<body <?php body_class('page-lp-scratch'); ?>>
  <?php
    // 本文(エディタで入力したHTML)をそのまま出力
    the_content();
  ?>
  <?php wp_footer(); ?>
</body>
</html>

このファイルをテーマのルートディレクトリに設置すると、固定ページのテンプレート選択のドロップダウンに「LP(フルスクラッチ)」が表示されるようになります。

こちらを選択して保存し、エディタの内容がそのまま表示されるかお試しください。(エディタの内容だけ表示される真っ白な画面になるはずです。)

WordPressのLPにお問い合わせフォームを設置するには?

LPを作る時にセットで知りたいのが、お問い合わせフォームを設置する方法です。

WordPressでお問い合わせフォームを作成する方法は以下の4つです。

ツール費用難易度デザイン
Googleフォーム無料色やフォントなど変更可
自由度が非常に低い
WordPressプラグイン無料★★変更にはCSSの知識が必要だが、
自由度は非常に高い
※CF7の場合(プラグインによる)
フォーム作成ツール有料プリセットが豊富で、
ツール上で手軽に変更可能
※ツールによって異なる
フォームの自作0円〜※★★★自由自在
※フォームを自作する場合は、エンジニアの稼働時間がコストになります。

予算や実現したいデザインを考慮して、最適な方法をお選びください。詳しい実装方法は、以下の記事をご覧ください。

なお、フォーム作成ツールをお探しの場合は、以下に実用的なツールを比較・解説してますので、こちらも合わせてご覧ください。

まとめ

今回は、WordPressでLPを作成する方法について紹介しました。

主な作り方は以下の3つになりますので、ぜひ試してみてください。

テーマのLP作成機能を利用LP作成機能が備わったテーマを使う方法
テーマの機能で作れるので初心者でも簡単
サクッとLPを作って公開したい人向け
プラグインを利用ページビルダー(作成ツール)系プラグインを使う方法
豊富なパーツを使って直感的にページを制作可能
ノーコードツール感覚でLPを作りたい人向け
自作テンプレートで対応固定ページテンプレートを自作してコーディングする方法
ページ自体はHTML/CSSで作成
HTML/CSSでページを制作できる人向け

Coneの中の人

資料・記事など、BtoBコンテンツについてCone社のメンバー一同で知識を集めあわせて解説します。株式会社Coneを応援してね!※Twitterリンクは代表のものです。

メルマガ登録

資料、記事、サイト制作などの作成方法から活用方法まで、BtoBコンテンツに関する情報をお届けします。たま〜にサービスに関する情報も。