WordPress(ワードプレス)ではランディングページをカンタンに作る事ができます。
初心者でもプラグインやテーマを使って、カッコいいプロレベルのランディングページを作る事もできます。
ここではテーマをインストールしたり、難しいHTMLやCSSを書く必要も無いとてもカンタンな方法を教えます。
たった5分、3ステップでワードプレスのランディングページを作ってみましょう。
WordPressでランディングページを作れるの?
はい、作れます。
つい最近までは、業者さんに1ページ何万円も払ってランディングページを作ってもらうのが当たり前でした。 (※実際、僕たちも長い間そうやってランディングページを作ってもらっていました)
しかし、最新のオンラインマーケティングの世界では、ランディングページをWordpressで作るのが一般的になりつつあります。
実際、オンラインビジネスが日本よりも進んでいる海外では、多くのビジネスがWordpressでランディングページを作っています。
理由は、
- コストが圧倒的に安い
- リリースまでの時間が早い
- いつでも好きな時に更新できる
と、オンラインビジネスに必要な全ての要素を兼ね備えているからです。
WordPressでランディングページを作る4つの方法
WordPressでランディングページを作るにはいくつか方法があります。
- イメージに合う無料テーマを探してインストールして使う
- クオリティーの高い有料テーマを探してインストールして使う
- 自分でテーマをカスタマイズして使う
- 自分でゼロからテーマを作成して使う
どのように選ぶかというと、ランディングページの用途とあなたが出来る事に合わせて方法を選ぶ事になります。
例えば、急いでいる案件があってすぐにでもランディングページを立ち上げて公開したい、という状況では有料でクオリティーの高いテーマやプラグインを使ってランディングページを作る事になります。
あまり急いでいないので多少手間がかかっても良いから無料で使えるテーマを使ってランディングページを作りたい、と考えるかもしれません。
今回は無料で、さらにすぐにできる方法を解説します。
デフォルトテーマを使う簡単な方法
今回はデフォルトのテーマ(twenty シリーズ)を使用します。
twenty シリーズとは(fourteen/fifteen/sixteen)はWordpress(ワードプレス)をインストールすると、初めから入っているテーマです。
ですので、新しく別のテーマをインストールする必要はありません。
デフォルトのテーマを使用するので、テーマのクオリティーや作り込みに安心感があります。
無料のテーマの中にはアーカイブページやカテゴリページがちゃんと表示されないものや、モバイルや特定のデバイスでレイアウトが崩れてしまってまともに見れないものもあるので注意が必要です。
それに対してデフォルトで入っている公式テーマはしっかりとチェックが行われているのでそういった心配は皆無、安心です。
ですので、できれば公式テーマであるtwenty シリーズをそのまま使いたいのですが、これらのテーマは
- サイドバー
- コンテンツエリア
2カラムのブログレイアウト。
このままではランディングページとして使う事ができません。
なので、このテーマを3ステップで簡単カスタマイズしてランディングページとして使えるようにしていきましょう。
Twenty sixteenをランディングページに使う方法
最新版のWordPressには「Twenty sixteen」がインストールされています。
新規インストール、またはWordPressのアップデートを行うと自動的にTwenty sixteenが使えるようになります。
Twenty sixteen自体をカスタマイズすることになるのですが、HTMLやCSSを変更するのでタイヘンです。
ですので、Twenty sixteenの「子テーマ」として1カラムのランディングページ用テーマを使えるようにしましたので、ご利用ください。
→ Twenty sixteen LP(子テーマ)をダウンロード
テーマのインストールと有効化
ダッシュボードのサイドメニューから「外観」-「テーマ」を選択してテーマ一覧を開きます。
「新規追加」をクリックして、
↑のテーマ(Twenty sixteen子テーマ)をアップロードします。
一覧に、「Twenty Sixteen/twentysixteen-LP」が表示されるので有効化します。
ランディングページ化するためのカスタマイズ
よりランディングページっぽくシンプルにするために、表示部分を少しだけカスタマイズして最適化します。
サイドメニューからテーマのカスタマイズを選択します。
「サイトの基本情報」をクリックして、ランディングページには不要なヘッダのテキストを消していきます。
「ヘッダーテキストを表示する」のチェックを外すと、ヘッダは表示されなくなります。
「保存して公開」ボタンをクリックして保存しましょう。
背景色も薄いグレーなどに変更しておくと、自然でミニマルな感じに仕上がります。
もう一個。
Twenty sixteenではメインコンテンツの下にウィジェットがデフォルトで表示されていますので、こちらも表示されないように設定をします。
あとは内容を考えて入力するだけ。
ミニマルなランディングページをカンタンに作る事ができます。
FourteenXtdを使用してランディングページを作成する
プラグインインストール
デフォルトのテーマを変更するには通常、複雑なHTMLやCSSの変更が必要です。
それをボタン一つでランディングページ化できるのがこのプラグインです。
FOURTEEN EXTENDED(← 公開中止)
FourteenXtd(←最新版にアップデートされました)
WordPress公式サイトのプラグインのリンクが切れているのでこちらのページから直接ダウンロードしてください。
サイトの一番上の赤い文字、テキストの下部の赤い文字「WordPress Fourteen Extended Plugin Download」がダウンロードリンクです。
インストール方法1:管理画面からインストール
ダッシュボードのサイドバー、プラグインから新規追加をクリック。
ダウンロードしたプラグインをアップロード。
Fourteen-extendedをインストール。
インストール方法2:FTPでアップロード
- Fourteen-extended プラグインをダウンロード
- FTPクライアント(Filezillaなど)を使用してアップロード /[wordpressのディレクトリ]/wp-content/plugin/
にファイルをアップロード。
- 管理画面にログイン
- サイドバーのプラグイン – インストール済プラグインから一覧を表示
- Fourteen-extendedを有効化する。
プラグイン設定
プラグインをインストールすると、
Fourteen-Extended専用の設定が新たに追加されます。
たくさんの設定があって迷ってしまいそうですが、Wordpressをランディングページ化するのに必要な設定はこれだけです。
「Remove Primary (Left) Sidebar? -Hide」のチェックボックスを「ON」にして右上の青い「保存」ボタンをクリックしてください。
ページ作成
ランディングページを作成するために、固定ページを新規作成します。
次に、固定ページをランディングページに使えるように設定を変更します。
コメント欄を消す設定
まず、ページ上部の「表示オプション」をクリック。
次に、ディスカッションをクリックするとページの下部にコメント欄の表示、非表示を制御できるボックスが出てきます。
「コメントの投稿を許可する」のチェックを外すとコメント欄が無くなります。 逆に、チェックを入れるとコメント欄が表示されます。
「トラックバックとピング」のチェックも同様に必要無いので外します。
次に、キャッチコピーやボディーコピー、オプトインボックスなど、ページに必要な要素を入れていきます。
すると、シンプルなランディングページが完成します。
細かい部分や見た目をカスタマイズするにはもう一工夫必要になりますが、
- とにかく早く
- お金をかけないで
- 知識ゼロのド素人でも
ランディングページを作りたいときには、便利な方法です。
初心者でも簡単に売れるWordpressランディングページを作る方法
実はもう一つ、Wordpressで実証済みの売れるテンプレートを使って初心者でも3分でランディングページを作る方法があります。
私たち自身も使っているのですが、
- とにかく簡単に今すぐランディングページやセールスページを作って
- 見栄えが良いだけの売れないページではなく
- プロレベルのキレイなデザインで
- 売れるページを作って売上げが欲しい
加えて、安く済ませたいというなら、この方法以外にはないと思います。
海外のオンラインマーケッターやオンラインビジネスで最も選ばれているランディングページ作成システムの一つで、ネットでビジネスをするために、今や必要不可欠なツールです。
→ スリーミニッツホームページ(3minutes Home Page)
お世話になります。
このページに書かれている通り「Twenty sixteen」をインストールしましたら、Wordpressにログインさえできなくなり、以下のエラーメッセージが出ています。
Parse error: syntax error, unexpected ‘[‘ in /home/users/2/sub.jp-asukajuku/web/wp/lp/wp-content/themes/twentytwenty/classes/class-twentytwenty-script-loader.php on line 32
対処法が解らず困っています。
解決法を教えて頂けませんでしょうか。よろしくお願いします。
ヒロさん、
はい、そうですね。
古い情報でもうしわけないです。
調べてみたところ、開発が終了してしまっているようでした。
FourteenXtdのダウンロードリンクがみつかりません。結局もうできないんでしようか?
カネコさん、こんにちは。
良かったです^^
フッターに関しては、そうですね。
テーマファイルを直接書き換えれば変更は出来るのですが、無料で使えるテーマの多くは管理画面から「copyright」を消すことが出来ないようになっています。
ヘッダーに関してはテーマによってヘッダー画像のジャストサイズがあります(縦横比を合わせる)それに合わせるのが一番ラクですが、CSSを直接して調整することもできます。
大変役に立ちました。ありがとうございます。
フッターのcopyrightが変えられません。
どこで、変えれば宜しいのでしょうか?
また、ヘッダーのようにページの最初に画像を設定すると、スペースが大きく空いていて、あまり見栄えが良くありません。
やはり、フリーのテンプレートでは限界がありますか?
こんにちは。
一旦、ダッシュボードの「外観」-「テーマ」から、元々設定してあったテーマに切り替えて(有効化)してみてください。
複数ある場合には、一つずつ順番に切り替えていくと、どれが元の設定か、分かると思います。
「テーマ」を切り替えると、サイト全体が着せ替え人形のように切り替わってしまいます。
ですので、既にホームページを運用されている場合には、1.別のドメイン、または2.サブドメインなどで
「もう一つWP」をインストールしてランディングページ用とするのが、分かりやすいと思います。
初めまして
WordPressでランディングページを作成したいと思い
Twenty sixteen LP(子テーマ)をダウンロード
しましたら
自社のHPのランディングページになってしまいました。
どうしたHPとランディングページが分けられますか?
もとの戻す場合はどうしたらいいですか?
初心者で大変困ってます。
よろしくお願いします。
徳田さま、ご連絡ありがとうございます。
TwentyFourteenExtendedの開発が終わってしまったようなので、TwentySixtyにてシンプルなランディングページを作る方法を紹介します。
お試しいただけますと幸いです。
ありがとうございます!
初めまして。
急なお問い合わせで大変失礼致します。
WordPressでランディングページを作成したいと思い、
ネットでいろいろ調べていた時にこちらのサイトに辿り着きました。
【WordPress公式サイトのプラグインのリンクが切れているのでこちらのページから直接ダウンロードしてください。】
という案内のページを見てみたのですが、
テキストの下部の赤い文字「WordPress Fourteen Extended Plugin Download」が見当たりませんでした。
現在はダウンロードできない状態になっているのでしょうか?
そこからいろんなページに飛んでみて【fourteen-extended-beta120.zip】というファイルはダウンロードできたのですが、アップしてもFourteen-Extended専用の設定が新たに追加されていなかったため断念しました。
大変お手数をお掛けして申し訳ないのですが、
もしこちらの問い合わせが確認できましたら、
ご教授頂けましたら幸いです。
宜しくお願い致します。