関連フォーラムトピック
2022.2.3 追記
VK Blocks が 1.23.0 にアップデートされて、スマホでもフローブロックがバランスよく表示されるようになりました。
その結果、最初にこの記事に書いた CSS は不要になっていますが、画像を中央揃えしたい場合は CSS を追加すればオッケーです。（下記参照）
フローブロックの画像の配置をカスタマイズ
VK Blocks のフローブロックをスマホで表示すると以下の「カスタマイズ前」のように画像の下が空いてしまい、バランスが悪くなります。
そこで、文面と画像を上下に並べるようにカスタマイズして、以下の「カスタマイズ後」のようにしてみましょう。
カスタマイズ前
カスタマイズ後
カスタマイズ手順
以下の CSS を追加します。
@media (max-width: 575.98px) {
.vk_flow .vk_flow_frame {
flex-direction: column;
}
.vk_flow .vk_flow_frame_image {
margin: 10px auto 0;
}
}VK Blocks が 1.23.0 にアップデートされて、上記の CSS を使わなくてもスマホでフローブロックがバランスよく表示されるようになりました。
画像を中央揃えしたい場合は下記の CSS を使いましょう。
@media (max-width: 575.98px) {
.vk_flow .vk_flow_frame_image {
margin: 0 auto;
}
}カスタマイズしたフローブロック
- お問い合わせ
- まずはお問い合わせフォームまたは電話 Tel 025-779-xxxx にてお気軽にご連絡ください。
- ヒアリング
- 担当者よりご連絡させていただき、現状の確認やお客様の要望などをお伺いいたします。
- ご提案・お見積り
- ヒアリングした内容を元にお客様にベストなプランとお見積りをご提案させていただきます。
- ご契約・発注
- 秘密保持契約など、発注に際して必要な契約をいたします。
- サービスのご提供
- ご提案させていただいた内容にて業務を実施いたします。
- 確認・納品
- 成果物に対して、ご確認いただきます。必要に応じて修正を行い、納品となります。
- ご入金
- 納品月の末締めで請求書を発行させていただきますので、翌月末にてご入金願います。
投稿者プロフィール
- 魚沼情報サービス・ベクトル公式テクニカルパートナー
-
【日本全国対応】WordPress のサイト制作、設定、カスタマイズ、トラブルでお悩み、お困りの方、ベクトル公式テクニカルパートナーがお手伝いいたします。
Lightning / VK Blocks / VK Filter Search のサポート、カスタマイズを得意としています。
遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。
オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを制作・運用する上でうまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。
デザイナー様、制作業者様のサイト制作のお手伝いも数多く行っています。難しい部分のコーディング ( PHP / CSS / jQuery ) をやってほしい、いま人手が足りない等、お仕事の依頼をお待ちしています。
ご要望をうかがった上で費用見積り（無料）を提示させていただきますので、お気軽にお問い合わせください。
≫メールでのお問い合わせはこちら
