WordPressテーマdeerでフルワイドのランディングページを作る方法
WordPressテーマdeerでは、画面横幅いっぱいのフルワイドなランディングページを作ることができます。
ということで今回は、フルワイドLPの作り方を解説していきます。
deerで作れるフルワイドLPの作り方
大きな手順としては、
- 固定ページのテンプレートを「LP(ノーマル)」or「LP(ヘッダーあり)」のどちらかでページを作る
- ブロックパターン『【deer】フルワイド』を使用して組み立てていく
たったこれだけです。
基本的な作業だけ、簡単に説明します。
↓ まずは、固定ページの作成画面でテンプレートを「LP(ノーマル)」か「LP(ヘッダーあり)」にしましょう。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/4c8dd8627504cf1426c6a075550a3eb2.png)
↓ そして、本文に追加していくブロックは「パターン」の中の、
- 【deer】フルワイド
- 【deer】左メディア+右テキスト
- 【deer】左テキスト+右メディア
この1~3のどれかを使って下さい。この3つがフルワイド対応のブロックです。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/76912d8fb7f35c898fb7e7a46ba95096.png)
あとは、このブロックパターンを組み合わせていけば、フルワイドのランディングページができます。
フルワイドブロックをカスタマイズする基本
1.ブロックの背景色を変える
↓ 追加したフルワイドブロックの背景色を変えるには、右のブロック編集メニューの「オーバーレイ」から変更できます。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/1b2761ee3b43d4bf9ee6fb146b3a61b5.png)
2.背景に画像や動画を入れるには?
↓ フルワイドブロックを選択した後、「メディアを追加」をクリックしてから好きな画像や動画を選んで下さい。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/e8e570bdaaf7eecf7bb6e9949f23fd5b.png)
↓ そうするとこのように、ブロック全体の背景に画像や動画が追加できます。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/0a7407190fe0a4b219e8deb449317f84.png)
3.背景に置いた画像の微調整をするには?
↓ 右側にカバーブロックの編集メニューがあります。その「メディア設定」で色々微調整ができます。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/73cdd1510341fe168f37c94b84a21bd5-1024x645.png)
4.フルワイドブロックの上に載せた文字の色を変更するには?
↓ 文字色を変更したい段落ブロックを選択し、右側の編集メニューの色⇒テキスト色で変更する。これは通常の段落ブロックの色の変更方法と同じですね。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/c6ab1439f36e29e420c7f34999520e51.png)
5.フルワイドブロックの中に、色んなブロックを追加するには?
↓ フルワイドブロックの中の「+」ボタンをクリックして、追加したいブロックを選択するだけです。基本的にWordPressの通常ブロックであれば何でも追加できます。
![フルワイドLPの作り方](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/08/b2aae45d36ea72e041c53d3fca4add29.png)
以上、このあたりの基本が分かればあとは、ブロックの組み合わせでフルワイドのランディングページを作成することができます。
今回の解説は以上です。
結果を出すために、派手さはいらない
「集客」に使うことだけを徹底的に考えて作ったWordPressテーマ
![deerのロゴ(白)文字入り](https://fanfare-co-ltd.com/deer/wp-content/uploads/2021/07/6fc9dfa4a44ab47d794f3145134a7d91-2.png)
決して多機能ではありませんが、使う機能を必要最低限に限定してシンプルにしているからこそ使いやすい、初心者さんに優しいテーマです。