このパターンではテーマ「Lightning ( G3 / theme.json )」「X-T9」「Twenty Twenty-Three」での使用を想定しています。他のテーマでは崩れる可能性がありますのでご注意ください。

このパターンではプラグイン「VK Blocks Pro (有料)」と、独自にカスタマイズしたCSSを使用しています。

設定のコツ
  • まず、「気軽に / 人気! / おトク」の段落をそれぞれ横並びグループで囲み、このグループに[高度な設定] – [追加 CSS クラス]より、vkp_tips を追加しておきます。
  • 次に、上記グループ (vkp_tips) で、テキスト色と背景色、枠線と角丸を設定します。
  • 上記グループ (vkp_tips) をさらに横並びグループで囲むことで、上下左右のセンタリングができます。
  • グリッドカラムカードのカスタムCSSで、丸 ( vkp_tips ) に対して位置とサイズを指定しています。
関連するパターン