【VK Patterns Library をはじめて利用する方へ】
VK Pattern Library のユーザー登録するには Lightning G3 Pro Pack か Vektor Passport のいずれかのライセンスが有効である必要があります。
VK Pattern Library のユーザー登録は VWS のマイアカウント からのみとなります。
VK Pattern Library の ユーザー登録の流れ はこちらをご覧ください。
このパターンではテーマ「Lightning ( G3 / theme.json )」「X-T9」での使用を想定しています。他のテーマでは崩れる可能性がありますのでご注意ください。
このパターンではプラグイン「VK Block Patterns」「VK Blocks Pro (有料)」と、独自にカスタマイズしたCSSを使用しています。
画像素材について
パターンで使用している画像をそのまま使いたい場合は下記画像をダウンロードして差し替えてください。
画像はライセンスが有効なアカウントでログインすると表示されます
設定のコツ
- ヒーローエリア の見出しとリード部分
- 実際に運用する際は、ヒーローエリアの見出しとリード文章は内容が同じものを設置する想定ですので、同期パターン(旧再利用ブロック)を作成すると便利です。
- ヒーローエリア・EVENT・SERVICE・CTA
- 三角屋根風のデザインの区切りは「Outer」ブロックの区切りの設定のタイプを「大きい三角」にしています。
- INFOMATION・EVENT
- 「一覧を見る」ボタンはVK Blocks の「非表示設定」で画面サイズごとに出しわけしています。
- 「選ばれる3つの理由」
- タイトルの背景画像はグループブロックに背景画像を入れて、サイズを「contain」にして設定しています。カバーブロックでも背景画像を設定できますが、「contain」の設定ができないためグループブロックに設定しています。
- ずらしたデザインの背景はカバーブロックのオーバーレイの不透明度100、グラデーションを 透明色→白 にして設定しています。
- 「VOICE(お客様の声)」
- ずらしたデザインの背景はグループブロックの色>背景をグラデーションで 透明→ベージュ にして設定しています。
- ずらしたデザインの背景はグループブロックの色>背景をグラデーションで 透明→ベージュ にして設定しています。
背景のグラデーションについて詳細は、下の動画を参照してください
ナビゲーションについて
- パターンに合わせて直書きしたナビゲーションを表示しています。
パターンをペーストしたあとで、ご自分のサイトに合わせたナビゲーションを設置してください。
参考:ランディングページ（LP）で、ナビゲーションブロックでページ内リンク（カスタムリンク）を設置する方法
ブロックテンプレートパーツ機能について
- Lightning G3 Pro Unit ヘッダーとフッターで使える ブロックテンプレートパーツ機能については、以下の動画を参照ください。
