Diverは、ブログやサイト制作だけでなく、LP（ランディングページ）も簡単に制作することができます。
このページでは、DiverのLP制作機能の詳細や実際に作成した際のプレビュー（イメージ）画像をご紹介します。
- LP制作機能で設定できること
- DiverのLPページのプレビュー画像
- 投稿ページとの違い
目次
DiverのLPページで設定できること
- タイトル
- テキスト（内容）
- LPファーストビュー
- 背景設定
- サイズ設定
- デザイン設定（メインエリア背景色など）
- head内出力設定
- カスタムCSS
タイトル
LP（ランディングページ）のタイトルは、ページ内には表示されません。
タイトルに入力した内容は、ウィンドウのタブに表示されます。
テキスト（内容）
LP（ランディングページ）の内容をここに入力します。
何も入力していない状態だと、こんな感じです。
まっさらで何もありません。
表示内容が少なすぎるので、メインエリア（白いエリア）の下にグレー部分ができてしまっていますが、実際にはメインエリアの下部にグレー部分はありません。
入力補助やショートコードも問題なく使用できるので、投稿記事や固定記事の制作と同じ感覚でLP（ランディングページ）を作ることができます。
幅いっぱいの見出しをLPで使用したい場合は、CSSや余白設定で調整する必要があります！
その他、いくつかの入力補助をLPで撮影してきました！
| ボックス（幅いっぱい）の見出し | ランキングと関連記事 | ボタンと会話 |
|---|---|---|
 |   |  |
LPファーストビュー
DiverのLP用ファーストビューは、PC表示時とモバイル表示時で別の画像を設定することができます。
タブレットはPC版の画像が使用されます(*'ω'*)
PC版では、ウィンドウサイズに合わせて画像が縦横比そのままに拡大されます。
正方形に近い形の画像を使用すると、ファーストビューがとても大きくなってしまう場合があるので注意が必要です。
| 設定イメージ | PC版 | タブレット版 | モバイル版 |
|---|---|---|---|
 | |   |  |
背景設定
DiverのLPは、背景も個別に設定することができます。
リピート画像か、背景カラーを設定するかを選択できます。
また、どちらも設定しない場合（デフォルト設定も消して未入力状態にする）透明扱いになり、カスタマイザーで設定されている背景が適用されます。
| 設定ブロック | リピート画像を使用 | カスタマイザーの背景を使用 |
|---|---|---|
 |  |  |
サイズ設定
LPでは、ウィンドウサイズも個別に設定することができます。
サイズ設定では、％かpx（ピクセル）のどちらかで数値設定します。
画像の拡縮が気になる方は、px（ピクセル）で設定するといいと思います！
| ウィンドウサイズの大きい時 | ウィンドウサイズの小さい時 |  |  |
|---|---|
また、デバイスごとに余白設定もできます。1px以上の数値が設定できます。
自由に余白を設定できるので、レスポンシブデザインに合わせて余白を調節できます。
| 左右20px、上下40px（デフォルト） | 左右100px、上下100px | 左右1px、上下1px |
|---|---|---|
 |  |  |
 |  |  |
デザイン設定（メインエリア背景色など）
デザイン設定では、メインエリアの背景色や影効果の有無を設定できます。
メインエリアの背景色は、未入力状態（デフォルト設定も消去）にすることで透明にもできます。
背景色も透明の場合は、カスタマイザーで設定されている背景が適用されます。
| デザイン設定ボックス | 影効果あり | 影効果なし | メインエリア背景色透明 |
|---|---|---|---|
 | |  |  |
head内出力設定
DiverのLP（ランディングページ）には、head内出力エリアも搭載されています。
この入力フォームに入力すると、head内に入力した内容が出力されます。
トラッキングコード等をhead内に出力したい場合に便利です。
投稿ページとの違い
LP（ランディングページ）の投稿ページとの大きな違いは、以下の点が挙げられます。
- head内出力エリアがある
- サイズ設定や背景色設定をLP（ランディングページ）に対して個別に行える
- サイドバーウィジェットやヘッダー、フッターがない
見出しデザインなどのカスタマイザー設定や、CSS設定はLP（ランディングページ）でも適用されます。
もし、見出しデザインを投稿ページと違うものにしたい場合は、入力補助の見出しを利用してデザインを変更するとよいでしょう。
また、カスタムCSSも投稿ページと同様に搭載されているので、LP（ランディングページ）用のCSSも設定可能です。
LPページの機能や設定項目 まとめ
いかがでしたでしょうか。
DiverではLPを投稿ページのように簡単に作ることができます。
入力補助など、Diverの独自機能も使用できるので、ページ内容も投稿ページを作るかのように苦戦することなく制作できます。
サイトやブログ制作ももちろん、LP（ランディングページ）を必要とするサイト制作者におすすめのWordPress有料テーマと言えるでしょう。
