いつもベクトル製品をご利用いただき、ありがとうございます。
WordPress プラグイン VK Booking Manager Pro 3.10.0 で、メニューループブロックと予約ブロックのサービス一覧に表示するカード画像の比率を選べるようになりました。アイコン画像やスタッフの顔写真も、本文の長さに関係なく同じ形でそろえて表示できます。
これまでのカード表示では、画像の高さが右側の本文の高さに合わせて伸びていました。そのため、サービスメニューの説明文や料金の区分が多くなると画像が縦長になり、左右が切れてしまうことがありました。今回、画像の比率を固定できる設定を追加し、本文の量に関係なく画像を同じ形で表示できるようにしました。

初期設定は「本文の高さに合わせる」で、これまでと同じ表示です。更新しただけでは見た目は変わりません。
選べる画像の比率
| 選択肢 | 表示 |
|---|---|
| 本文の高さに合わせる(初期値) | これまでと同じです。画像の高さが本文の高さまで伸びます。 |
| 元のサイズ | 画像を元の縦横比のまま表示し、本文の上端にそろえます。 |
| 正方形 – 1:1 | 正方形で表示します。メニューのアイコンや、スタッフの顔写真に向いています。 |
| 標準 – 4:3 | 4:3 の横長で表示します。 |
| ワイド – 16:9 | 16:9 の横長で表示します。客室や店内の写真に向いています。 |
「正方形 – 1:1」「標準 – 4:3」「ワイド – 16:9」では、枠からはみ出した部分を切り取って表示します。スマートフォンなどで画像が本文の上に並ぶときも、選んだ比率で表示されます。
画像の比率を設定する場所
画像の比率は、使っている表示に合わせて次の 2 か所で設定します。
| 表示する場所 | 設定する場所 |
|---|---|
| メニューループブロック(ページに置くサービス一覧) | ブロックの設定サイドバー →「表示要素」→「画像の比率」 |
| 予約ブロックのサービスメニュー一覧 | 「BM 設定」→「システム設定」→「サービスメニューの画像比率」 |
設定の手順
メニューループブロックで設定する場合
メニューループブロックを選択する
サービス一覧を表示しているページを編集画面で開き、「メニューループ」ブロックをクリックして選択します。
「表示要素」を開く
右のサイドバーで「表示要素」をクリックして開きます。「アイキャッチ画像を表示」がオンのときに、その下に「画像の比率」が表示されます。
画像の比率を選ぶ
「画像の比率」で「正方形 – 1:1」などを選びます。エディターのプレビューにも、選んだ比率がすぐに反映されます。

ページを更新する
画面右上の「更新」(新しいページでは「公開」)をクリックして保存します。
「画像の比率」の欄が見つからないときは、「表示モード」が「テキスト」で、「サービスグループ」が「指定したサービスグループ」になっていないか確認してください。この組み合わせではカードが表示されないため、欄も表示されません。
予約ブロックで設定する場合
「BM 設定」を開く
管理画面の左のメニューで「BM 設定」をクリックし、設定画面の左側に並ぶメニューから「システム設定」をクリックします。
サービスメニュー一覧が表示される設定か確認する
「予約ページの表示要素」で「サービスメニュー一覧」にチェックが入っていることを確認します。チェックが入っていないと、比率の欄は表示されません。
画像の比率を選ぶ
「サービスメニュー表示モード」の下にある「サービスメニューの画像比率」で、比率を選びます。

変更を保存する
画面下の「変更を保存」をクリックします。
今の表示のままでよい場合
何もする必要はありません。初期値は「本文の高さに合わせる」で、更新前と同じ表示です。
対象バージョン
VK Booking Manager Pro 3.10.0 以降
ぜひご活用ください。
VK Booking Manager について
VK Booking Manager は、美容サロンや整体院、宿泊施設など、複雑な予約管理に対応した WordPress 予約システムプラグインです。
WordPress 予約システムプラグイン VK Booking Manager
美容サロン、整体院など、複雑な予約管理に対応した WordPress 専用プラグイン


を購入して
特典をゲットしよう!


特典A
X-T9 工務店
( ナチュラル )
19,800円 (税込)
0円に!


特典B
Lightning ビジネス
(Evergreen)
9,900円 (税込)
0円に!


特典C
Lightning 工務店
( ナチュラル )
19,800円(税込)
0円に!
今なら!
Vektor Passport の
有効期間中、上記の
デモサイトデータを
何度でも素早くまるごと
インポートできます!


パターンを使って
よりクオリティの高いサイトに
パターンとは、WordPressのブロックを組み合わせて作ったデザインテンプレートのようなもの。プロのデザイナーが制作したパターンを500以上公開中!コピペしながら高品質なサイトを簡単に作れます。
ブロックエディターで
ABテストを
自由に作成できる

VK AB Testing は、ABテストを実施するための WordPress 用プラグインです。ブロックエディターでテストパターンを自由に作成でき、ランダム表示とクリック計測が可能です。Webサイトや広告などの施策の改善にぜひご活用ください。














