MTS Simple Bookingにセキュリティ脆弱性が発見されました。以下のバージョンを使用中の場合はアップデートが必要です。
- 無償版の「MTS Simple Booking C Ver.1.2.1」を含む旧バージョン
- 「MTS Simple Bookingビジネス版 Ver.1.28.0」を含む旧バージョン
WordPressの予約プラグイン「MTS Simple Booking」のカレンダーには、予約状況を示す「○」や「×」が表示されます。通常は次のように文字で表示されますが、画像に変更することもできます。

予約カレンダーに表示される文字の「○」「×」
「○」「△」「×」「-」を画像に変更するには、「予約システム」‐「各種設定」メニューで設定します。通常は予約状況を示す文字が入っています。

予約状況を示す「○」「△」「×」「-」
この「空きマーク」などに入っている文字を画像に変更します。たとえば、「○」の代わりに「<img src="http://-----.com/ok.png">」という画像のimgタグを入力します。

「○」「△」「×」「-」を画像に変更する
imgタグを簡単に作成するには、投稿や固定ページの編集画面で「メディアを追加」から画像を挿入してテキストエディタでコピーする方法があります。
※編集画面を一時的に使っただけなので、このページは保存する必要はありません。

テキストエディタでimgタグを作成してコピー
「空きマーク」などを画像に入れ替えて予約カレンダーを表示すると、「○」「△」「×」「-」が画像に置き換わります。

「○」「△」「×」「-」を画像に変更
画像のサイズによっては、ウィジェットに表示するカレンダーやスマホ対応のときに個別に画像表示サイズの修正が必要になる場合があります。スマホ表示のときに「○」「△」「×」「-」の画像サイズを設定するCSSの例を以下に紹介します。
/* スマホでは画像を小さく */ @media (max-width: 480px) { #content .calendar-mark img { width:30px; } }
※「#content」はBizVektorのCSSセレクタです。それ以外のテーマでは適当に修正してご利用ください。

スマホでの予約カレンダー
あとは試行錯誤をお願いします。よくわからなければ「WordPress個別サポート」にご相談ください。
WordPressでお困りのときはご相談を
この記事を書いた西沢直木が直接、WordPress個別サポートで対応します。
こんなときはご相談を
- WordPressの使い方(ページやメニューの作り方を教えてほしい)
- カスタマイズ(機能の追加やデザイン調整をお願いしたい)
- トラブル対応(画面真っ白・「ログインできない」を解決したい)
マンツーマンなので相談内容は自由です。いただいた課題をその場で解決、CSSやPHPも目の前で修正します。気軽にご相談ください。
カスタマイズがうまくいかないときは
お急ぎのときはWordPressメールサポートで対応します。ご活用ください。

関連記事
スポンサーリンク