【VK Patterns Library をはじめて利用する方へ】
VK Pattern Library のユーザー登録するには Lightning G3 Pro Pack か Vektor Passport のいずれかのライセンスが有効である必要があります。
VK Pattern Library のユーザー登録は VWS のマイアカウント からのみとなります。
VK Pattern Library の ユーザー登録の流れ はこちらをご覧ください。
このパターンではテーマ「Twenty Twenty-Four」「Twenty Twenty-Five」「Lightning ( G3 / theme.json )」「X-T9」「Twenty Twenty-Three」での使用を想定しています。他のテーマでは崩れる可能性がありますのでご注意ください。
このパターンではプラグイン「VK Blocks Pro (有料)」と、独自にカスタマイズしたCSSを使用しています。
画像素材について
パターンで使用している画像をそのまま使いたい場合は下記画像をダウンロードして差し替えてください。
画像はライセンスが有効なアカウントでログインすると表示されます
設定のコツ
- 全体をグリーンのグループで囲み、そのなかでセクションごとのグループに分けています
- 社名「サンプルエキスパート」とキャッチコピー「Webコンサルティングサービス」はグループ化することで、同じ幅に表示されます
- 黄色い背景のカラム社名( サンプルエキスパート)で画像が入っているカラムは 、[埋めるように拡張]を設定しまいます。そのうえで画像ブロックにカスタムCSS を設定しています。
画像はカラムの高さに合わせて表示され、モバイルのとき画像上部だけ角丸に、PCのとき画像右(または左)だけ角丸になります - BUSINESS など見出しに上にあるグレーの文字は、[行の高さ]を少なめにすることで、見出しに少し重なるようになります
文字サイズは、カスタムCSS で clamp 指定をすることで画面幅によって変化します - 「こんなお客様にご利用いただいてます」 の黄色い吹き出しは逆三角のアイコンを使い、カスタムCSSで上にずらしています
- 「よくある質問」はカスタムCSS で角丸にしています
